Use proper loading and null value logic (#848)

This commit is contained in:
Dominik Żegleń 2020-11-23 10:38:46 +01:00 committed by GitHub
parent c96d252fd1
commit 607eba6a10
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 18 deletions

View file

@ -9,10 +9,12 @@ interface PercentProps {
const Percent: React.FC<PercentProps> = ({ amount }) => (
<LocaleConsumer>
{({ locale }) =>
(amount / 100).toLocaleString(locale, {
maximumFractionDigits: 2,
style: "percent"
})
amount
? (amount / 100).toLocaleString(locale, {
maximumFractionDigits: 2,
style: "percent"
})
: "-"
}
</LocaleConsumer>
);

View file

@ -221,6 +221,8 @@ const VoucherList: React.FC<VoucherListProps> = props => {
const channel = voucher?.channelListings?.find(
listing => listing.channel.id === selectedChannel
);
const hasChannelsLoaded = voucher?.channelListings?.length;
return (
<TableRow
className={!!voucher ? classes.tableRow : undefined}
@ -241,10 +243,8 @@ const VoucherList: React.FC<VoucherListProps> = props => {
{maybe<React.ReactNode>(() => voucher.code, <Skeleton />)}
</TableCell>
<TableCell className={classes.colMinSpent}>
{channel?.minSpent ? (
<Money money={channel.minSpent} />
) : channel && channel.minSpent === null ? (
"-"
{hasChannelsLoaded ? (
<Money money={channel?.minSpent} />
) : (
<Skeleton />
)}
@ -269,21 +269,19 @@ const VoucherList: React.FC<VoucherListProps> = props => {
className={classes.colValue}
onClick={voucher ? onRowClick(voucher.id) : undefined}
>
{voucher &&
voucher.discountValueType &&
channel?.discountValue ? (
{hasChannelsLoaded ? (
voucher.discountValueType ===
DiscountValueTypeEnum.FIXED ? (
<Money
money={{
amount: channel.discountValue,
currency: channel.currency
}}
money={
channel?.discountValue && {
amount: channel?.discountValue,
currency: channel?.currency
}
}
/>
) : channel?.discountValue ? (
<Percent amount={channel.discountValue} />
) : (
"-"
<Percent amount={channel?.discountValue} />
)
) : (
<Skeleton />