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 | 84x 84x 84x 5x 79x 8x 79x 79x | import { CheckCircleIcon, CircleDashedIcon, XCircleIcon } from "@phosphor-icons/react";
import { TaskStatus } from "../types";
import { CustomPalette } from "@theme/v2/palette.interface";
import { useAppTheme } from "@theme/v2/Provider";
import { useGetFeatureFlagValues } from "FeatureFlags/useGetFeatureFlagValues";
import CardIcon from "@features/Merchants/MerchantSidePanel/ApprovalFlowPanel/components/TaskItemCard/components/CardIcon";
import { TTaskStatus } from "@features/Merchants/MerchantSidePanel/ApprovalFlowPanel/types";
interface Props {
status: TaskStatus | TTaskStatus;
}
export default function StatusIcon({ status }: Props) {
const { palette } = useAppTheme();
const { isNewApprovalFlowEnabled } = useGetFeatureFlagValues();
if (isNewApprovalFlowEnabled)
return <CardIcon status={status as TTaskStatus} />;
return getStatusIcons(status as TaskStatus, palette);
}
const getStatusIcons = (status: TaskStatus, palette: CustomPalette) => {
switch (status) {
case "closed":
return (
<CheckCircleIcon
size={24}
color={palette.primitive?.success[50]}
weight="fill"
/>
);
case "ready_for_verification":
return <CheckCircleIcon size={24} color={palette.primitive?.success[50]} />;
case "open":
return (
<CircleDashedIcon size={24} color={palette.icon?.["icon-secondary"]} />
);
case "rejected":
return (
<XCircleIcon
size={24}
color={palette.primitive?.error["50"]}
weight="fill"
/>
);
default:
return null;
}
};
|