aboutsummaryrefslogtreecommitdiffstats
path: root/packages
diff options
context:
space:
mode:
Diffstat (limited to 'packages')
-rw-r--r--packages/instant/src/components/instant_heading.tsx11
1 files changed, 6 insertions, 5 deletions
diff --git a/packages/instant/src/components/instant_heading.tsx b/packages/instant/src/components/instant_heading.tsx
index 48cda7f88..265c3e0a5 100644
--- a/packages/instant/src/components/instant_heading.tsx
+++ b/packages/instant/src/components/instant_heading.tsx
@@ -20,7 +20,6 @@ export interface InstantHeadingProps {
const placeholderColor = ColorOption.white;
export class InstantHeading extends React.Component<InstantHeadingProps, {}> {
public render(): React.ReactNode {
- const placeholderAmountToAlwaysShow = this._placeholderAmountToAlwaysShow();
return (
<Container
backgroundColor={ColorOption.primaryColor}
@@ -43,22 +42,24 @@ export class InstantHeading extends React.Component<InstantHeadingProps, {}> {
<Flex direction="row" justify="space-between">
<SelectedAssetAmountInput fontSize="45px" />
<Flex direction="column" justify="space-between">
- <Container marginBottom="5px">{placeholderAmountToAlwaysShow || this._ethAmount()}</Container>
- <Container opacity={0.7}>{placeholderAmountToAlwaysShow || this._dollarAmount()}</Container>
+ <Container marginBottom="5px">
+ {this._placeholderOrAmount(this._ethAmount.bind(this))}
+ </Container>
+ <Container opacity={0.7}>{this._placeholderOrAmount(this._dollarAmount.bind(this))}</Container>
</Flex>
</Flex>
</Container>
);
}
- private _placeholderAmountToAlwaysShow(): React.ReactNode | null {
+ private _placeholderOrAmount(amountFunction: () => React.ReactNode): React.ReactNode {
if (this.props.quoteRequestState === AsyncProcessState.PENDING) {
return <AmountPlaceholder isPulsating={true} color={placeholderColor} />;
}
if (_.isUndefined(this.props.selectedAssetAmount)) {
return <AmountPlaceholder isPulsating={false} color={placeholderColor} />;
}
- return null;
+ return amountFunction();
}
private _ethAmount(): React.ReactNode {