UnderwritingCard ChallengeCategoryItem.tsx

0% Statements 0/4

0% Branches 0/2

0% Functions 0/1

0% Lines 0/4

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  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import { Stack } from "@mui/material";
import { useAppTheme } from "@theme/v2/Provider";
import { IconContainer, ModifiedGiveChip } from "./UnderwritingCard.style";
import GiveText from "@shared/Text/GiveText";
 
export type TChallengeCategoryItemProps = {
  label: string;
  total: number;
  completed: number;
  icon: React.ReactNode;
};
 
const ChallengeCategoryItem = ({
  label,
  total,
  completed,
  icon,
}: TChallengeCategoryItemProps) => {
  const { palette } = useAppTheme();
 
  const isCompleted = completed === total;
 
  return (
    <Stack direction="row" alignItems="center" gap={2}>
      <IconContainer backgroundColor={palette.surface?.secondary}>
        {icon}
      </IconContainer>
      <Stack direction="column" alignItems="flex-start" flex={1}>
        <GiveText variant="bodyS" color="primary">
          {label}
        </GiveText>
        <GiveText variant="bodyS" color={isCompleted ? "success" : "secondary"}>
          {`${completed}/${total} Completed`}
        </GiveText>
      </Stack>
      <ModifiedGiveChip
        label="Underwriting"
        color="blue"
        variant="light"
        size="small"
      />
    </Stack>
  );
};
 
export default ChallengeCategoryItem;