From 19f61906d3075391efb32c17c99c2cba1f7a3858 Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 10 Oct 2018 18:27:06 -0700 Subject: feat: Move over features from zrx-buyer --- .../instant/src/components/instant_heading.tsx | 39 +++++++++++++++++++--- 1 file changed, 35 insertions(+), 4 deletions(-) (limited to 'packages/instant/src/components/instant_heading.tsx') diff --git a/packages/instant/src/components/instant_heading.tsx b/packages/instant/src/components/instant_heading.tsx index be0414b8d..cde3862c7 100644 --- a/packages/instant/src/components/instant_heading.tsx +++ b/packages/instant/src/components/instant_heading.tsx @@ -1,11 +1,42 @@ +import { BigNumber } from '@0xproject/utils'; +import { Web3Wrapper } from '@0xproject/web3-wrapper'; +import * as _ from 'lodash'; import * as React from 'react'; +import { ethDecimals } from '../constants'; import { SelectedAssetAmountInput } from '../containers/selected_asset_amount_input'; import { ColorOption } from '../style/theme'; import { Container, Flex, Text } from './ui'; -export interface InstantHeadingProps {} +export interface InstantHeadingProps { + selectedAssetAmount?: BigNumber; + totalEthBaseAmount?: BigNumber; + ethUsdPrice?: BigNumber; +} + +const displaytotalEthBaseAmount = ({ selectedAssetAmount, totalEthBaseAmount }: InstantHeadingProps): string => { + if (_.isUndefined(selectedAssetAmount)) { + return '0 ETH'; + } + if (_.isUndefined(totalEthBaseAmount)) { + return '...loading'; + } + const ethUnitAmount = Web3Wrapper.toUnitAmount(totalEthBaseAmount, ethDecimals); + const roundedAmount = ethUnitAmount.round(4); + return `${roundedAmount} ETH`; +}; + +const displayUsdAmount = ({ totalEthBaseAmount, selectedAssetAmount, ethUsdPrice }: InstantHeadingProps): string => { + if (_.isUndefined(selectedAssetAmount)) { + return '$0.00'; + } + if (_.isUndefined(totalEthBaseAmount) || _.isUndefined(ethUsdPrice)) { + return '...loading'; + } + const ethUnitAmount = Web3Wrapper.toUnitAmount(totalEthBaseAmount, ethDecimals); + return `$${ethUnitAmount.mul(ethUsdPrice).round(2)}`; +}; export const InstantHeading: React.StatelessComponent = props => ( @@ -26,18 +57,18 @@ export const InstantHeading: React.StatelessComponent = pro - rep + zrx - 0 ETH + {displaytotalEthBaseAmount(props)} - $0.00 + {displayUsdAmount(props)} -- cgit From 03b235bb428e8a61934ff603f22f057d8394b56a Mon Sep 17 00:00:00 2001 From: fragosti Date: Thu, 11 Oct 2018 17:35:22 -0700 Subject: feat: populate order details with information from worst buy quote --- packages/instant/src/components/instant_heading.tsx | 14 +++----------- 1 file changed, 3 insertions(+), 11 deletions(-) (limited to 'packages/instant/src/components/instant_heading.tsx') diff --git a/packages/instant/src/components/instant_heading.tsx b/packages/instant/src/components/instant_heading.tsx index cde3862c7..951858695 100644 --- a/packages/instant/src/components/instant_heading.tsx +++ b/packages/instant/src/components/instant_heading.tsx @@ -6,6 +6,7 @@ import * as React from 'react'; import { ethDecimals } from '../constants'; import { SelectedAssetAmountInput } from '../containers/selected_asset_amount_input'; import { ColorOption } from '../style/theme'; +import { format } from '../util/format'; import { Container, Flex, Text } from './ui'; @@ -19,23 +20,14 @@ const displaytotalEthBaseAmount = ({ selectedAssetAmount, totalEthBaseAmount }: if (_.isUndefined(selectedAssetAmount)) { return '0 ETH'; } - if (_.isUndefined(totalEthBaseAmount)) { - return '...loading'; - } - const ethUnitAmount = Web3Wrapper.toUnitAmount(totalEthBaseAmount, ethDecimals); - const roundedAmount = ethUnitAmount.round(4); - return `${roundedAmount} ETH`; + return format.ethBaseAmount(totalEthBaseAmount, 4, '...loading'); }; const displayUsdAmount = ({ totalEthBaseAmount, selectedAssetAmount, ethUsdPrice }: InstantHeadingProps): string => { if (_.isUndefined(selectedAssetAmount)) { return '$0.00'; } - if (_.isUndefined(totalEthBaseAmount) || _.isUndefined(ethUsdPrice)) { - return '...loading'; - } - const ethUnitAmount = Web3Wrapper.toUnitAmount(totalEthBaseAmount, ethDecimals); - return `$${ethUnitAmount.mul(ethUsdPrice).round(2)}`; + return format.ethBaseAmountInUsd(totalEthBaseAmount, ethUsdPrice, 2, '...loading'); }; export const InstantHeading: React.StatelessComponent = props => ( -- cgit From f3391e1250767eb9ef7a74f78eded38fa3c94586 Mon Sep 17 00:00:00 2001 From: fragosti Date: Fri, 12 Oct 2018 11:00:36 -0700 Subject: feat: make redux actions type-sage --- packages/instant/src/components/instant_heading.tsx | 2 -- 1 file changed, 2 deletions(-) (limited to 'packages/instant/src/components/instant_heading.tsx') diff --git a/packages/instant/src/components/instant_heading.tsx b/packages/instant/src/components/instant_heading.tsx index 951858695..377bb20bf 100644 --- a/packages/instant/src/components/instant_heading.tsx +++ b/packages/instant/src/components/instant_heading.tsx @@ -1,9 +1,7 @@ import { BigNumber } from '@0xproject/utils'; -import { Web3Wrapper } from '@0xproject/web3-wrapper'; import * as _ from 'lodash'; import * as React from 'react'; -import { ethDecimals } from '../constants'; import { SelectedAssetAmountInput } from '../containers/selected_asset_amount_input'; import { ColorOption } from '../style/theme'; import { format } from '../util/format'; -- cgit From f39541436a5088e928660b61bde7cef5153bc7a1 Mon Sep 17 00:00:00 2001 From: fragosti Date: Fri, 12 Oct 2018 16:11:30 -0700 Subject: feat: model asset meta data and add dynamic assetData state --- packages/instant/src/components/instant_heading.tsx | 9 +-------- 1 file changed, 1 insertion(+), 8 deletions(-) (limited to 'packages/instant/src/components/instant_heading.tsx') diff --git a/packages/instant/src/components/instant_heading.tsx b/packages/instant/src/components/instant_heading.tsx index 377bb20bf..492c1b2c0 100644 --- a/packages/instant/src/components/instant_heading.tsx +++ b/packages/instant/src/components/instant_heading.tsx @@ -43,14 +43,7 @@ export const InstantHeading: React.StatelessComponent = pro - - - - - zrx - - - + -- cgit