All files / src/sections/PayBuilder/Forms/About FundraiserAbout.tsx

100% Statements 7/7
100% Branches 2/2
100% Functions 3/3
100% Lines 7/7

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 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66                46x                 4x 4x   4x   4x                 4x                                         4x                          
import { Box, Stack } from "@mui/material";
import { usePayBuilderForm } from "@sections/PayBuilder/provider/PayBuilderFormProvider";
import GiveCheckbox from "@shared/GiveCheckbox/GiveCheckbox";
import HFGiveCustomAmount from "@shared/HFInputs/HFGiveCustomAmount/HFGiveCustomAmount";
import GiveText from "@shared/Text/GiveText";
import { Controller } from "react-hook-form";
import About from "./About";
 
const MAX_TARGET = 99999999999999;
 
function FundraiserAbout({
  isEdit,
  isFromADB,
}: {
  isEdit?: boolean;
  isFromADB?: boolean;
}) {
  const { methods } = usePayBuilderForm();
  const { watch, control } = methods;
 
  const isAddTargetEnabled = watch("About.addTarget");
 
  return (
    <Box pb="20px">
      <About isEdit={isEdit} isFromADB={isFromADB} />
      <Stack spacing={2} marginTop={2}>
        <Stack direction="row" spacing={1}>
          <Controller
            control={control}
            name="About.addTarget"
            render={({ field: { onChange, value } }) => {
              return <GiveCheckbox checked={value} onChange={onChange} />;
            }}
          />
          <GiveText color="secondary" variant="bodyS" alignItems="center">
            Add Fundraiser Goal
          </GiveText>
        </Stack>
        {isAddTargetEnabled && (
          <HFGiveCustomAmount
            label="Fundraiser Goal"
            name="About.targetValue"
            currency="usd"
            bounded
            max={MAX_TARGET}
          />
        )}
        <Stack direction="row" spacing={1}>
          <Controller
            control={control}
            name="About.showHistory"
            render={({ field: { onChange, value } }) => {
              return <GiveCheckbox checked={value} onChange={onChange} />;
            }}
          />
          <GiveText color="secondary" variant="bodyS" alignItems="center">
            Show Donation History
          </GiveText>
        </Stack>
      </Stack>
    </Box>
  );
}
 
export default FundraiserAbout;