Skip to content

Commit

Permalink
prop for optionally displaying value on ValueViewComponent
Browse files Browse the repository at this point in the history
  • Loading branch information
TalDerei committed Nov 22, 2024
1 parent 29ceb15 commit 6d25583
Showing 1 changed file with 18 additions and 9 deletions.
27 changes: 18 additions & 9 deletions packages/ui/src/ValueView/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,10 @@ export interface ValueViewComponentProps<SelectedContext extends Context> {
* If true, the displayed amount will be shortened.
*/
abbreviate?: boolean;
/**
* If false, the amount will not be displayed.
*/
showValue?: boolean;
}

/**
Expand All @@ -58,19 +62,22 @@ export const ValueViewComponent = <SelectedContext extends Context = 'default'>(
priority = 'primary',
hideSymbol = false,
abbreviate = false,
showValue = true,
}: ValueViewComponentProps<SelectedContext>) => {
const density = useDensity();

if (!valueView) {
return null;
}

let formattedAmount: string;
if (abbreviate) {
const amount = getFormattedAmtFromValueView(valueView, false);
formattedAmount = shortify(Number(amount));
} else {
formattedAmount = getFormattedAmtFromValueView(valueView, true);
let formattedAmount: string | undefined;
if (showValue) {
if (abbreviate) {
const amount = getFormattedAmtFromValueView(valueView, false);
formattedAmount = shortify(Number(amount));
} else {
formattedAmount = getFormattedAmtFromValueView(valueView, true);
}
}

const metadata = getMetadata.optional(valueView);
Expand Down Expand Up @@ -109,9 +116,11 @@ export const ValueViewComponent = <SelectedContext extends Context = 'default'>(
getGap(density),
)}
>
<div className='shrink grow' title={formattedAmount}>
<ValueText density={density}>{formattedAmount}</ValueText>
</div>
{showValue && (
<div className='shrink grow' title={formattedAmount ?? undefined}>
<ValueText density={density}>{formattedAmount}</ValueText>
</div>
)}
{!hideSymbol && (
<div className='shrink grow truncate' title={symbol}>
<ValueText density={density}>{symbol}</ValueText>
Expand Down

0 comments on commit 6d25583

Please sign in to comment.