aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src/components/order_details.tsx
diff options
context:
space:
mode:
authorBrandon Millman <brandon.millman@gmail.com>2018-11-14 02:14:20 +0800
committerBrandon Millman <brandon.millman@gmail.com>2018-11-14 02:29:21 +0800
commit5527de62ffda68c00ae5fb68781c2e081fcc372e (patch)
tree61d3fb172de49a194bb5e5f4fe78365696818692 /packages/instant/src/components/order_details.tsx
parente8afc66a5afd65ee1ae640b43dee927ee57dceea (diff)
downloaddexon-sol-tools-5527de62ffda68c00ae5fb68781c2e081fcc372e.tar
dexon-sol-tools-5527de62ffda68c00ae5fb68781c2e081fcc372e.tar.gz
dexon-sol-tools-5527de62ffda68c00ae5fb68781c2e081fcc372e.tar.bz2
dexon-sol-tools-5527de62ffda68c00ae5fb68781c2e081fcc372e.tar.lz
dexon-sol-tools-5527de62ffda68c00ae5fb68781c2e081fcc372e.tar.xz
dexon-sol-tools-5527de62ffda68c00ae5fb68781c2e081fcc372e.tar.zst
dexon-sol-tools-5527de62ffda68c00ae5fb68781c2e081fcc372e.zip
chore(instant): update selectedAssetAmount in the redux state to be named selectedAssetUnitAmount
Diffstat (limited to 'packages/instant/src/components/order_details.tsx')
-rw-r--r--packages/instant/src/components/order_details.tsx32
1 files changed, 17 insertions, 15 deletions
diff --git a/packages/instant/src/components/order_details.tsx b/packages/instant/src/components/order_details.tsx
index fc316b9f8..5fc956e1c 100644
--- a/packages/instant/src/components/order_details.tsx
+++ b/packages/instant/src/components/order_details.tsx
@@ -16,22 +16,22 @@ import { Text } from './ui/text';
export interface OrderDetailsProps {
buyQuoteInfo?: BuyQuoteInfo;
- selectedAssetAmount?: BigNumber;
+ selectedAssetUnitAmount?: BigNumber;
ethUsdPrice?: BigNumber;
isLoading: boolean;
}
export class OrderDetails extends React.Component<OrderDetailsProps> {
public render(): React.ReactNode {
- const { buyQuoteInfo, ethUsdPrice, selectedAssetAmount } = this.props;
+ const { buyQuoteInfo, ethUsdPrice, selectedAssetUnitAmount } = this.props;
const buyQuoteAccessor = oc(buyQuoteInfo);
- const assetEthAmount = buyQuoteAccessor.assetEthAmount();
- const feeEthAmount = buyQuoteAccessor.feeEthAmount();
- const totalEthAmount = buyQuoteAccessor.totalEthAmount();
- const perUnitEthAmount =
- !_.isUndefined(assetEthAmount) &&
- !_.isUndefined(selectedAssetAmount) &&
- !selectedAssetAmount.eq(BIG_NUMBER_ZERO)
- ? assetEthAmount.div(selectedAssetAmount).ceil()
+ const assetEthBaseUnitAmount = buyQuoteAccessor.assetEthAmount();
+ const feeEthBaseUnitAmount = buyQuoteAccessor.feeEthAmount();
+ const totalEthBaseUnitAmount = buyQuoteAccessor.totalEthAmount();
+ const pricePerTokenEth =
+ !_.isUndefined(assetEthBaseUnitAmount) &&
+ !_.isUndefined(selectedAssetUnitAmount) &&
+ !selectedAssetUnitAmount.eq(BIG_NUMBER_ZERO)
+ ? assetEthBaseUnitAmount.div(selectedAssetUnitAmount).ceil()
: undefined;
return (
<Container padding="20px" width="100%" flexGrow={1}>
@@ -48,19 +48,19 @@ export class OrderDetails extends React.Component<OrderDetailsProps> {
</Container>
<EthAmountRow
rowLabel="Token Price"
- ethAmount={perUnitEthAmount}
+ ethAmount={pricePerTokenEth}
ethUsdPrice={ethUsdPrice}
isLoading={this.props.isLoading}
/>
<EthAmountRow
rowLabel="Fee"
- ethAmount={feeEthAmount}
+ ethAmount={feeEthBaseUnitAmount}
ethUsdPrice={ethUsdPrice}
isLoading={this.props.isLoading}
/>
<EthAmountRow
rowLabel="Total Cost"
- ethAmount={totalEthAmount}
+ ethAmount={totalEthBaseUnitAmount}
ethUsdPrice={ethUsdPrice}
shouldEmphasize={true}
isLoading={this.props.isLoading}
@@ -88,7 +88,7 @@ export class EthAmountRow extends React.Component<EthAmountRowProps> {
const { rowLabel, ethAmount, isEthAmountInBaseUnits, shouldEmphasize, isLoading } = this.props;
const fontWeight = shouldEmphasize ? 700 : 400;
- const ethFormatter = isEthAmountInBaseUnits ? format.ethBaseAmount : format.ethUnitAmount;
+ const ethFormatter = isEthAmountInBaseUnits ? format.ethBaseUnitAmount : format.ethUnitAmount;
return (
<Container padding="10px 0px" borderTop="1px dashed" borderColor={ColorOption.feintGrey}>
<Flex justify="space-between">
@@ -112,7 +112,9 @@ export class EthAmountRow extends React.Component<EthAmountRowProps> {
);
}
private _renderUsdSection(): React.ReactNode {
- const usdFormatter = this.props.isEthAmountInBaseUnits ? format.ethBaseAmountInUsd : format.ethUnitAmountInUsd;
+ const usdFormatter = this.props.isEthAmountInBaseUnits
+ ? format.ethBaseUnitAmountInUsd
+ : format.ethUnitAmountInUsd;
const shouldHideUsdPriceSection = _.isUndefined(this.props.ethUsdPrice) || _.isUndefined(this.props.ethAmount);
return shouldHideUsdPriceSection ? null : (
<Container marginRight="3px" display="inline-block">