aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'packages/instant/src/components')
-rw-r--r--packages/instant/src/components/asset_button.tsx51
-rw-r--r--packages/instant/src/components/buy_button.tsx6
-rw-r--r--packages/instant/src/components/zero_ex_instant_container.tsx6
3 files changed, 6 insertions, 57 deletions
diff --git a/packages/instant/src/components/asset_button.tsx b/packages/instant/src/components/asset_button.tsx
deleted file mode 100644
index 4ae7a2704..000000000
--- a/packages/instant/src/components/asset_button.tsx
+++ /dev/null
@@ -1,51 +0,0 @@
-import { AssetBuyer, BuyQuote } from '@0x/asset-buyer';
-import * as React from 'react';
-
-import { AsyncProcessState } from '../types';
-
-// TODO: better name?
-
-import { BuyButton } from './buy_button';
-import { RetryButton } from './retry_button';
-import { Container } from './ui';
-
-// TODO: split into sepearte components? getting really big..
-interface AssetButtonProps {
- assetBuyer?: AssetBuyer;
- buyQuote?: BuyQuote;
- buyOrderState: AsyncProcessState;
- onBuyClick: (buyQuote: BuyQuote) => void;
- onBuySuccess: (buyQuote: BuyQuote) => void;
- onBuyFailure: (buyQuote: BuyQuote) => void;
- onRetryClick: () => void;
-}
-
-export class AssetButton extends React.Component<AssetButtonProps, {}> {
- public render(): React.ReactNode {
- return (
- <Container padding="20px" width="100%">
- {this._renderButton()}
- </Container>
- );
- }
- private _renderButton(): React.ReactNode {
- // TODO: figure out why buyOrderState is undefined in beginning, get rid of default
- switch (this.props.buyOrderState) {
- case AsyncProcessState.FAILURE:
- return <RetryButton onClick={this.props.onRetryClick} />;
- case AsyncProcessState.SUCCESS:
- return <div />;
- default:
- return (
- <BuyButton
- buyQuote={this.props.buyQuote}
- assetBuyer={this.props.assetBuyer}
- onClick={this.props.onBuyClick}
- onBuySuccess={this.props.onBuySuccess}
- onBuyFailure={this.props.onBuyFailure}
- text={'Buy'}
- />
- );
- }
- }
-}
diff --git a/packages/instant/src/components/buy_button.tsx b/packages/instant/src/components/buy_button.tsx
index 4d2386620..5eef18aa3 100644
--- a/packages/instant/src/components/buy_button.tsx
+++ b/packages/instant/src/components/buy_button.tsx
@@ -6,7 +6,7 @@ import { ColorOption } from '../style/theme';
import { util } from '../util/util';
import { web3Wrapper } from '../util/web3_wrapper';
-import { Button, Container, Text } from './ui';
+import { Button, Text } from './ui';
export interface BuyButtonProps {
buyQuote?: BuyQuote;
@@ -14,7 +14,6 @@ export interface BuyButtonProps {
onClick: (buyQuote: BuyQuote) => void;
onBuySuccess: (buyQuote: BuyQuote, txnHash: string) => void;
onBuyFailure: (buyQuote: BuyQuote, tnxHash?: string) => void;
- text: string;
}
export class BuyButton extends React.Component<BuyButtonProps> {
@@ -24,12 +23,11 @@ export class BuyButton extends React.Component<BuyButtonProps> {
onBuyFailure: util.boundNoop,
};
public render(): React.ReactNode {
- // TODO: move container out
const shouldDisableButton = _.isUndefined(this.props.buyQuote);
return (
<Button width="100%" onClick={this._handleClick} isDisabled={shouldDisableButton}>
<Text fontColor={ColorOption.white} fontWeight={600} fontSize="20px">
- {this.props.text}
+ Buy
</Text>
</Button>
);
diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index cf918d890..088d0a93e 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
import { LatestBuyQuoteOrderDetails } from '../containers/latest_buy_quote_order_details';
import { LatestError } from '../containers/latest_error';
-import { SelectedAssetBuyButton } from '../containers/selected_asset_buy_button';
+import { SelectedAssetButton } from '../containers/selected_asset_button';
import { SelectedAssetInstantHeading } from '../containers/selected_asset_instant_heading';
import { ColorOption } from '../style/theme';
@@ -26,7 +26,9 @@ export const ZeroExInstantContainer: React.StatelessComponent<ZeroExInstantConta
<Flex direction="column" justify="flex-start">
<SelectedAssetInstantHeading />
<LatestBuyQuoteOrderDetails />
- <SelectedAssetBuyButton />
+ <Container padding="20px" width="100%">
+ <SelectedAssetButton />
+ </Container>
</Flex>
</Container>
</Container>