CustomBreadcrumbsPage BreadcrumbsProductItem.tsx

71.42% Statements 5/7

16.66% Branches 1/6

50% Functions 1/2

80% Lines 4/5

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  
 
 
 
 
 
 
 
19x
1x
 
1x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
19x
 
 
 
 
 
 
  import { SubPathNameType } from "@utils/routing";
import { Image } from "@common/StyledImage/Image";
import { TruncateText } from "@common/Text";
import { Stack, styled } from "@mui/material";
import { useBreadcrumbs } from "./hooks/useBreadcrumbs";
import placeholder from "assets/images/Placeholder.png";
import { isMobile } from "@utils/index";
 
const BreadcrumbsProductItem = (props: SubPathNameType) => {
  const { selectedProduct } = useBreadcrumbs();
 
  Eif (!selectedProduct.product_id) return null;
 
  return (
    <Stack direction="row" alignItems="center" gap={1}>
      {!isMobile && (
        <Image
          height={26}
          width={26}
          sx={{
            borderRadius: "3px",
          }}
          src={
            selectedProduct.imgSrc
              ? `${selectedProduct.imgSrc}/thumb`
              : placeholder
          }
        />
      )}
      <StyledText lineClamp={1}>{selectedProduct.title}</StyledText>
    </Stack>
  );
};
 
export default BreadcrumbsProductItem;
 
const StyledText = styled(TruncateText)(({ theme }) => ({
  marginTop: "2px",
  color: theme.palette.neutral["80"],
  [theme.breakpoints.down("sm")]: {
    fontSize: "12px",
  },
}));