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 }) => ( const Percent: React.FC<PercentProps> = ({ amount }) => (
<LocaleConsumer> <LocaleConsumer>
{({ locale }) => {({ locale }) =>
(amount / 100).toLocaleString(locale, { amount
maximumFractionDigits: 2, ? (amount / 100).toLocaleString(locale, {
style: "percent" maximumFractionDigits: 2,
}) style: "percent"
})
: "-"
} }
</LocaleConsumer> </LocaleConsumer>
); );

View file

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