diff options
author | fragosti <francesco.agosti93@gmail.com> | 2018-11-10 05:19:59 +0800 |
---|---|---|
committer | fragosti <francesco.agosti93@gmail.com> | 2018-11-10 05:19:59 +0800 |
commit | fa7bd072d064d1c79c8e84bc42463491ebbad33f (patch) | |
tree | fbf5ffa8f2ea603a96d60824d8f07e9e8a4271e4 /packages/instant/src/components/buy_order_progress.tsx | |
parent | daa011f7cbbc6719d99eef251d07f552e23c21fb (diff) | |
download | dexon-sol-tools-fa7bd072d064d1c79c8e84bc42463491ebbad33f.tar dexon-sol-tools-fa7bd072d064d1c79c8e84bc42463491ebbad33f.tar.gz dexon-sol-tools-fa7bd072d064d1c79c8e84bc42463491ebbad33f.tar.bz2 dexon-sol-tools-fa7bd072d064d1c79c8e84bc42463491ebbad33f.tar.lz dexon-sol-tools-fa7bd072d064d1c79c8e84bc42463491ebbad33f.tar.xz dexon-sol-tools-fa7bd072d064d1c79c8e84bc42463491ebbad33f.tar.zst dexon-sol-tools-fa7bd072d064d1c79c8e84bc42463491ebbad33f.zip |
feat: refactor progress bar code to expose static progress bar
Diffstat (limited to 'packages/instant/src/components/buy_order_progress.tsx')
-rw-r--r-- | packages/instant/src/components/buy_order_progress.tsx | 23 |
1 files changed, 17 insertions, 6 deletions
diff --git a/packages/instant/src/components/buy_order_progress.tsx b/packages/instant/src/components/buy_order_progress.tsx index bc7319423..9c73d58af 100644 --- a/packages/instant/src/components/buy_order_progress.tsx +++ b/packages/instant/src/components/buy_order_progress.tsx @@ -1,6 +1,7 @@ +import * as _ from 'lodash'; import * as React from 'react'; -import { TimedProgressBar } from '../components/timed_progress_bar'; +import { ProgressBar, TimedProgressBar } from '../components/timed_progress_bar'; import { TimeCounter } from '../components/time_counter'; import { Container } from '../components/ui/container'; @@ -12,7 +13,7 @@ export interface BuyOrderProgressProps { export const BuyOrderProgress: React.StatelessComponent<BuyOrderProgressProps> = props => { const { buyOrderState } = props; - + let content: React.ReactNode = null; if ( buyOrderState.processState === OrderProcessState.Processing || buyOrderState.processState === OrderProcessState.Success || @@ -21,15 +22,25 @@ export const BuyOrderProgress: React.StatelessComponent<BuyOrderProgressProps> = const progress = buyOrderState.progress; const hasEnded = buyOrderState.processState !== OrderProcessState.Processing; const expectedTimeMs = progress.expectedEndTimeUnix - progress.startTimeUnix; - return ( - <Container padding="20px 20px 0px 20px" width="100%"> + content = ( + <React.Fragment> <Container marginBottom="5px"> <TimeCounter estimatedTimeMs={expectedTimeMs} hasEnded={hasEnded} key={progress.startTimeUnix} /> </Container> <TimedProgressBar expectedTimeMs={expectedTimeMs} hasEnded={hasEnded} key={progress.startTimeUnix} /> + </React.Fragment> + ); + } else { + // Just show a static progress bar if we aren't processing or in an end state + content = ( + <Container marginTop="10px"> + <ProgressBar width="0px" /> </Container> ); } - - return null; + return ( + <Container padding="20px 20px 0px 20px" width="100%"> + {content} + </Container> + ); }; |