aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src/components
diff options
context:
space:
mode:
authorSteve Klebanoff <steve.klebanoff@gmail.com>2018-10-26 06:42:35 +0800
committerSteve Klebanoff <steve.klebanoff@gmail.com>2018-10-26 06:42:35 +0800
commitced4c893ba412ca401430a66694e194806d46e6b (patch)
treef594cd94048c1bc6ad14429b50e7ff52e840c37c /packages/instant/src/components
parente3510f3bcf4eea76d93888faedd822117bab7bdb (diff)
downloaddexon-sol-tools-ced4c893ba412ca401430a66694e194806d46e6b.tar
dexon-sol-tools-ced4c893ba412ca401430a66694e194806d46e6b.tar.gz
dexon-sol-tools-ced4c893ba412ca401430a66694e194806d46e6b.tar.bz2
dexon-sol-tools-ced4c893ba412ca401430a66694e194806d46e6b.tar.lz
dexon-sol-tools-ced4c893ba412ca401430a66694e194806d46e6b.tar.xz
dexon-sol-tools-ced4c893ba412ca401430a66694e194806d46e6b.tar.zst
dexon-sol-tools-ced4c893ba412ca401430a66694e194806d46e6b.zip
Show View Transaction button on failure, and allow setting of width for Try Again button and View Txn button
Diffstat (limited to 'packages/instant/src/components')
-rw-r--r--packages/instant/src/components/buy_order_state_button.tsx10
-rw-r--r--packages/instant/src/components/retry_button.tsx6
-rw-r--r--packages/instant/src/components/secondary_button.tsx6
-rw-r--r--packages/instant/src/components/view_transaction_button.tsx6
4 files changed, 20 insertions, 8 deletions
diff --git a/packages/instant/src/components/buy_order_state_button.tsx b/packages/instant/src/components/buy_order_state_button.tsx
index 44115e5a1..73a4d62e2 100644
--- a/packages/instant/src/components/buy_order_state_button.tsx
+++ b/packages/instant/src/components/buy_order_state_button.tsx
@@ -1,5 +1,7 @@
import * as React from 'react';
+import { Flex } from '../components/ui/flex';
+
import { PlacingOrderButton } from '../components/placing_order_button';
import { SelectedAssetBuyButton } from '../containers/selected_asset_buy_button';
import { SelectedAssetRetryButton } from '../containers/selected_asset_retry_button';
@@ -10,9 +12,15 @@ export interface BuyOrderStateButtonProps {
buyOrderProcessingState: OrderProcessState;
}
+// TODO: rename to buttons
export const BuyOrderStateButton: React.StatelessComponent<BuyOrderStateButtonProps> = props => {
if (props.buyOrderProcessingState === OrderProcessState.FAILURE) {
- return <SelectedAssetRetryButton />;
+ return (
+ <Flex justify="space-between">
+ <SelectedAssetRetryButton width="48%" />
+ <SelectedAssetViewTransactionButton width="48%" />
+ </Flex>
+ );
} else if (
props.buyOrderProcessingState === OrderProcessState.SUCCESS ||
props.buyOrderProcessingState === OrderProcessState.PROCESSING
diff --git a/packages/instant/src/components/retry_button.tsx b/packages/instant/src/components/retry_button.tsx
index 0d6188e6a..36ae55e72 100644
--- a/packages/instant/src/components/retry_button.tsx
+++ b/packages/instant/src/components/retry_button.tsx
@@ -1,11 +1,11 @@
import * as React from 'react';
-import { SecondaryButton } from './secondary_button';
+import { SecondaryButton, SecondaryButtonProps } from './secondary_button';
-export interface RetryButtonProps {
+export interface RetryButtonProps extends SecondaryButtonProps {
onClick: () => void;
}
export const RetryButton: React.StatelessComponent<RetryButtonProps> = props => {
- return <SecondaryButton onClick={props.onClick}>Try Again</SecondaryButton>;
+ return <SecondaryButton {...props}>Try Again</SecondaryButton>;
};
diff --git a/packages/instant/src/components/secondary_button.tsx b/packages/instant/src/components/secondary_button.tsx
index 3c139a233..849003d0a 100644
--- a/packages/instant/src/components/secondary_button.tsx
+++ b/packages/instant/src/components/secondary_button.tsx
@@ -8,13 +8,14 @@ import { Text } from './ui/text';
export interface SecondaryButtonProps extends ButtonProps {}
+// TODO: don't hard code this
export const SecondaryButton: React.StatelessComponent<SecondaryButtonProps> = props => {
const buttonProps = _.omit(props, 'text');
return (
<Button
backgroundColor={ColorOption.white}
borderColor={ColorOption.lightGrey}
- width="100%"
+ width={props.width}
onClick={props.onClick}
{...buttonProps}
>
@@ -24,3 +25,6 @@ export const SecondaryButton: React.StatelessComponent<SecondaryButtonProps> = p
</Button>
);
};
+SecondaryButton.defaultProps = {
+ width: '100%',
+};
diff --git a/packages/instant/src/components/view_transaction_button.tsx b/packages/instant/src/components/view_transaction_button.tsx
index 7aa44e657..8d11bf132 100644
--- a/packages/instant/src/components/view_transaction_button.tsx
+++ b/packages/instant/src/components/view_transaction_button.tsx
@@ -1,11 +1,11 @@
import * as React from 'react';
-import { SecondaryButton } from './secondary_button';
+import { SecondaryButton, SecondaryButtonProps } from './secondary_button';
-export interface ViewTransactionButtonProps {
+export interface ViewTransactionButtonProps extends SecondaryButtonProps {
onClick: () => void;
}
export const ViewTransactionButton: React.StatelessComponent<ViewTransactionButtonProps> = props => {
- return <SecondaryButton onClick={props.onClick}>View Transaction</SecondaryButton>;
+ return <SecondaryButton {...props}>View Transaction</SecondaryButton>;
};