All files / src/sections/PayBuilder/components/fundraiser-preview-email FundraiserPreviewEmail.tsx

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
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import { usePayBuilderForm } from "@sections/PayBuilder/provider/PayBuilderFormProvider";
import { CommonMetadata } from "@sections/PayBuilder/components/product-preview-email/ProductCommonMetadata";
import { ItemsDonationSection } from "@sections/PayBuilder/components/fundraiser-preview-email/ItemsDonationSection";
import usePreviewCart from "@sections/PayBuilder/components/EmailPreview/usePreviewCart";
import { EmailPreviewLayout } from "@sections/PayBuilder/components/EmailPreview/EmailPreviewLayout";
import { compact, uniq } from "lodash";
 
export function FundraiserEmailPreview() {
  const { subTotal, renewalDate } = usePreviewCart();
  const { methods, isPaymentFormInfosLoading } = usePayBuilderForm();
 
  const optionalAmounts = methods.watch("Donations.optionalAmounts");
  const items = uniq(compact(optionalAmounts || []));
 
  const content = (
    <>
      <CommonMetadata />
      <ItemsDonationSection
        formattedAmount={subTotal}
        cartItems={(items.filter((item) => parseFloat(item)) as any) || []}
        renewalDate={renewalDate}
        sectionTitle="Donation Summary"
        labels={["One-Time Donation", "Card Processing Fees"]}
      />
    </>
  );
 
  return (
    <EmailPreviewLayout
      isLoading={isPaymentFormInfosLoading}
      content={content}
    />
  );
}