All files / src/features/GiveConversation/components HeaderLeftSection.tsx

100% Statements 6/6
75% Branches 6/8
100% Functions 1/1
100% Lines 6/6

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              3x 40x 40x 40x     40x   40x                                                  
import GiveText from "@shared/Text/GiveText";
import { Stack } from "@mui/material";
import { useConversationContext } from "../ConversationProvider";
import { useAppTheme } from "@theme/v2/Provider";
import GiveThumbnail from "@shared/Thumbnail/GiveThumbnail";
import { useCustomThemeV2 } from "@theme/hooks/useCustomThemeV2";
 
const LeftHeaderSection = () => {
  const { merchantData } = useConversationContext();
  const { palette } = useAppTheme();
  const { isMobileView } = useCustomThemeV2();
 
  const thumbnailType =
    merchantData?.merchantType === "enterprise" ? "provider" : "merchant";
 
  return (
    <Stack direction="row" gap="8px" alignItems="center">
      <GiveThumbnail
        type={thumbnailType}
        size={isMobileView ? "extra_small" : "small"}
        sx={{
          borderRadius: "6.4px",
          pointerEvents: "none",
          ...(!merchantData?.imageURL && {
            border: `0.4px solid ${palette.border?.primary}`,
          }),
        }}
        imageUrl={
          merchantData?.imageURL ? `${merchantData.imageURL}/thumb` : ""
        }
        data-testid="give-conversation-merchant-logo"
      />
      <GiveText data-testid="give-conversation-merchant-name" variant="bodyS">
        {merchantData?.name}
      </GiveText>
    </Stack>
  );
};
 
export default LeftHeaderSection;