diff options
author | fragosti <francesco.agosti93@gmail.com> | 2018-06-28 09:21:51 +0800 |
---|---|---|
committer | fragosti <francesco.agosti93@gmail.com> | 2018-06-28 09:21:51 +0800 |
commit | 4454cfa65dfb2f0928cddc8732a64010b0c5f0d8 (patch) | |
tree | 7bece7be80044428384dbc589d1ec8c776c0ce83 /packages/website/ts/components/onboarding/add_eth_onboarding_step.tsx | |
parent | 382839464f7d554bfc89176f669c4d72df6093f3 (diff) | |
download | dexon-0x-contracts-4454cfa65dfb2f0928cddc8732a64010b0c5f0d8.tar dexon-0x-contracts-4454cfa65dfb2f0928cddc8732a64010b0c5f0d8.tar.gz dexon-0x-contracts-4454cfa65dfb2f0928cddc8732a64010b0c5f0d8.tar.bz2 dexon-0x-contracts-4454cfa65dfb2f0928cddc8732a64010b0c5f0d8.tar.lz dexon-0x-contracts-4454cfa65dfb2f0928cddc8732a64010b0c5f0d8.tar.xz dexon-0x-contracts-4454cfa65dfb2f0928cddc8732a64010b0c5f0d8.tar.zst dexon-0x-contracts-4454cfa65dfb2f0928cddc8732a64010b0c5f0d8.zip |
Customize flow depending on what steps you've completed
Diffstat (limited to 'packages/website/ts/components/onboarding/add_eth_onboarding_step.tsx')
-rw-r--r-- | packages/website/ts/components/onboarding/add_eth_onboarding_step.tsx | 36 |
1 files changed, 23 insertions, 13 deletions
diff --git a/packages/website/ts/components/onboarding/add_eth_onboarding_step.tsx b/packages/website/ts/components/onboarding/add_eth_onboarding_step.tsx index 1dd47773c..62d44885c 100644 --- a/packages/website/ts/components/onboarding/add_eth_onboarding_step.tsx +++ b/packages/website/ts/components/onboarding/add_eth_onboarding_step.tsx @@ -2,17 +2,27 @@ import * as React from 'react'; import { Container } from 'ts/components/ui/container'; import { Text } from 'ts/components/ui/text'; -export interface AddEthOnboardingStepProps {} +export interface AddEthOnboardingStepProps { + hasEth: boolean; +} -export const AddEthOnboardingStep: React.StatelessComponent<AddEthOnboardingStepProps> = () => ( - <div className="flex items-center flex-column"> - <Text> Before you begin you will need to send some ETH to your wallet.</Text> - <Container marginTop="15px" marginBottom="15px"> - <img src="/images/ether_alt.svg" height="50px" width="50px" /> - </Container> - <Text className="xs-hide"> - Click on the <img src="/images/metamask_icon.png" height="20px" width="20px" /> metamask extension in your - browser and click either <b>BUY</b> or <b>DEPOSIT</b>. - </Text> - </div> -); +export const AddEthOnboardingStep: React.StatelessComponent<AddEthOnboardingStepProps> = props => + props.hasEth ? ( + <div className="flex items-center flex-column"> + <Text> Great! Looks like you already have ETH in your wallet.</Text> + <Container marginTop="15px" marginBottom="15px"> + <img src="/images/ether_alt.svg" height="50px" width="50px" /> + </Container> + </div> + ) : ( + <div className="flex items-center flex-column"> + <Text> Before you begin you will need to send some ETH to your wallet.</Text> + <Container marginTop="15px" marginBottom="15px"> + <img src="/images/ether_alt.svg" height="50px" width="50px" /> + </Container> + <Text className="xs-hide"> + Click on the <img src="/images/metamask_icon.png" height="20px" width="20px" /> metamask extension in + your browser and click either <b>BUY</b> or <b>DEPOSIT</b>. + </Text> + </div> + ); |