Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 | 332x 11002x 332x 9388x 9388x 7694x 3608x 3194x | import { suspendedFallback } from "~app/components/suspense-wrapper";
import { Badge } from "~components/badge";
import type { ViewReactNode } from "~components/view.web";
type Children = ViewReactNode | ((props: { amount: number }) => ViewReactNode);
const renderChildren = (children: Children, amount: number) =>
typeof children === "function" ? children({ amount }) : children;
export const AmountBadge = suspendedFallback<{
children: Children;
useAmount: () => number;
}>(
({ children, useAmount }) => {
const amount = useAmount();
if (amount === 0) {
return <>{renderChildren(children, amount)}</>;
}
return (
<Badge content={amount} color="danger">
{renderChildren(children, amount)}
</Badge>
);
},
({ children }) => renderChildren(children, 0),
);
|