diff options
Diffstat (limited to 'packages')
| -rw-r--r-- | packages/instant/src/components/buy_order_progress.tsx | 35 | ||||
| -rw-r--r-- | packages/instant/src/containers/selected_asset_progress.tsx | 42 |
2 files changed, 39 insertions, 38 deletions
diff --git a/packages/instant/src/components/buy_order_progress.tsx b/packages/instant/src/components/buy_order_progress.tsx new file mode 100644 index 000000000..e259e5606 --- /dev/null +++ b/packages/instant/src/components/buy_order_progress.tsx @@ -0,0 +1,35 @@ +import * as React from 'react'; + +import { TimedProgressBar } from '../components/timed_progress_bar'; + +import { TimeCounter } from '../components/time_counter'; +import { Container } from '../components/ui'; +import { OrderProcessState, OrderState } from '../types'; + +export interface BuyOrderProgressProps { + buyOrderState: OrderState; +} + +export const BuyOrderProgress: React.StatelessComponent<BuyOrderProgressProps> = props => { + const { buyOrderState } = props; + + if ( + buyOrderState.processState === OrderProcessState.PROCESSING || + buyOrderState.processState === OrderProcessState.SUCCESS || + buyOrderState.processState === OrderProcessState.FAILURE + ) { + 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%"> + <Container marginBottom="5px"> + <TimeCounter estimatedTimeMs={expectedTimeMs} hasEnded={hasEnded} key={progress.startTimeUnix} /> + </Container> + <TimedProgressBar expectedTimeMs={expectedTimeMs} hasEnded={hasEnded} key={progress.startTimeUnix} /> + </Container> + ); + } + + return null; +}; diff --git a/packages/instant/src/containers/selected_asset_progress.tsx b/packages/instant/src/containers/selected_asset_progress.tsx index a910d8031..354a15bf0 100644 --- a/packages/instant/src/containers/selected_asset_progress.tsx +++ b/packages/instant/src/containers/selected_asset_progress.tsx @@ -1,49 +1,15 @@ -import * as React from 'react'; +// TODO: rename file and props to SelectedAssetBuyOrderProgress and use .ts import { connect } from 'react-redux'; -import { TimedProgressBar } from '../components/timed_progress_bar'; - -import { TimeCounter } from '../components/time_counter'; -import { Container } from '../components/ui'; +import { BuyOrderProgress } from '../components/buy_order_progress'; import { State } from '../redux/reducer'; -import { OrderProcessState, OrderState, SimulatedProgress } from '../types'; - -interface SelectedAssetProgressComponentProps { - buyOrderState: OrderState; -} -// TODO: rename this component and move to seperate file, and get props using mapStateToProps -export const SelectedAssetSimulatedProgressComponent: React.StatelessComponent< - SelectedAssetProgressComponentProps -> = props => { - const { buyOrderState } = props; - - if ( - buyOrderState.processState === OrderProcessState.PROCESSING || - buyOrderState.processState === OrderProcessState.SUCCESS || - buyOrderState.processState === OrderProcessState.FAILURE - ) { - 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%"> - <Container marginBottom="5px"> - <TimeCounter estimatedTimeMs={expectedTimeMs} hasEnded={hasEnded} key={progress.startTimeUnix} /> - </Container> - <TimedProgressBar expectedTimeMs={expectedTimeMs} hasEnded={hasEnded} key={progress.startTimeUnix} /> - </Container> - ); - } - - return null; -}; +import { OrderState } from '../types'; interface ConnectedState { buyOrderState: OrderState; - simulatedProgress?: SimulatedProgress; } const mapStateToProps = (state: State, _ownProps: {}): ConnectedState => ({ buyOrderState: state.buyOrderState, }); -export const SelectedAssetProgress = connect(mapStateToProps)(SelectedAssetSimulatedProgressComponent); +export const SelectedAssetProgress = connect(mapStateToProps)(BuyOrderProgress); |