All files / src/features/GiveRiskProfile/components RiskProfileHeader.tsx

100% Statements 6/6
100% Branches 0/0
100% Functions 3/3
100% Lines 5/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 45 46 47                        53x 7x   14x         7x           3x                                        
import GiveTabs from "@shared/Tabs/GiveTabs";
import { TransactionRiskProfileTabsType } from "../types";
import { useAppTheme } from "@theme/v2/Provider";
import { capitalize } from "lodash";
 
type Props = {
  currentTab: TransactionRiskProfileTabsType;
  setCurrentTab: React.Dispatch<
    React.SetStateAction<TransactionRiskProfileTabsType>
  >;
};
 
const RiskProfileHeader = ({ currentTab, setCurrentTab }: Props) => {
  const { breakpoints } = useAppTheme();
 
  const tabs = ["overview", "details"].map((item) => ({
    label: capitalize(item),
    value: item,
  }));
 
  return (
    <GiveTabs
      items={tabs}
      type="line"
      selected={currentTab?.toString()}
      variant="underline"
      onClick={(val) => setCurrentTab(val as TransactionRiskProfileTabsType)}
      containerSx={{
        display: "flex",
        overflow: "auto",
        scrollbarWidth: "none",
        [breakpoints.down("v2_sm")]: {
          width: "calc( 100vw - 40px )",
        },
        gap: "20px",
      }}
      tabSx={{
        "& p": {
          whiteSpace: "nowrap",
        },
      }}
    />
  );
};
 
export default RiskProfileHeader;