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 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 | 3x 22x 3x 3x 113x 22x 3x 22x | import { capitalize } from "lodash";
import { styled } from "@theme/v2/Provider";
import GiveChip, { TChipColors } from "@shared/Chip/GiveChip";
import { TextProps } from "@shared/Text/giveText.types";
import GiveText from "@shared/Text/GiveText";
import { parseAmount } from "@utils/index";
import { CURRENCY } from "@constants/constants";
export const Chip = ({ isDesktopView, statusDisplayName }: any) => {
return (
<StyledChip
variant="light"
color={chipColorsMap[statusDisplayName as TChipColors]}
label={capitalize(statusDisplayName)}
size="small"
isMobile={!isDesktopView}
/>
);
};
const chipColorsMap: Record<string, any> = {
Paid: "success",
Draft: "default",
Overdue: "error",
Failed: "error",
Sent: "primitiveblue10",
Canceled: "default",
};
const StyledChip = styled(GiveChip, {
shouldForwardProp: (prop) => prop !== "isMobile",
})<{ isMobile?: boolean }>(({ isMobile }) => ({
width: "94px",
minWidth: "94px",
height: "28px",
fontSize: "12px",
borderRadius: "40px",
}));
export const InvoiceAmount = ({
amount,
variant,
color,
}: {
amount: number;
variant?: TextProps["variant"];
color?: TextProps["color"];
}) => {
return (
<GiveText variant={variant ?? "bodyS"} color={color ?? "secondary"}>
{parseAmount(amount / 100)} {CURRENCY}
</GiveText>
);
};
|