All files / src/features/Merchants/MerchantSidePanel/UnderwritingTasks/components PahComponent.tsx

85.71% Statements 6/7
65% Branches 13/20
100% Functions 1/1
85.71% Lines 6/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 67 68 69 70 71 72 73 74 75 76 77 78                                  5x   5x                                                           5x 5x   5x       5x                                          
import { TPrimaryAccountHolder } from "@components/Merchants/MerchantPreview/data.types";
import { betterPhoneNumber } from "@components/Merchants/MerchantPreview/hooks/useGetSectionItems";
import { getCountryNameFromCode } from "@utils/country_dial_codes";
import { formatInUTCMoment, isEmptyPhone } from "@utils/date.helpers";
import { CustomGrid } from "./Sections";
import { FieldConfig } from "../types";
import { ApprovalBanner, TaskEmptyState } from "./Sections.atoms";
import { HideOrShow } from "./Accordion.atom";
import { useMerchantDateFormatter } from "@components/Merchants/MerchantPreview/helpers/parsers";
 
function PahComponent({
  PAH,
  merchantName,
}: {
  merchantName?: string;
  PAH: TPrimaryAccountHolder;
}) {
  const { merchantDateFormatter } = useMerchantDateFormatter();
 
  const itemsList: FieldConfig[] = [
    {
      label: "Full Name",
      value: [PAH?.firstName, PAH?.lastName].filter(Boolean).join(" ") || "-",
    },
    {
      label: "Email",
      value: PAH?.email || "-",
    },
    {
      label: "Date of Birth",
      value: PAH?.dateOfBirth ? formatInUTCMoment(PAH.dateOfBirth) : "-",
    },
    {
      label: "Mobile Phone",
      value: isEmptyPhone(PAH?.phoneNumber)
        ? "-"
        : betterPhoneNumber(PAH?.phoneNumber),
      isPhoneNumber: true,
    },
    {
      label: "Country of Citizenship",
      value: getCountryNameFromCode(PAH?.citizenship || "US"),
    },
    {
      label: "Country of Residence",
      value: getCountryNameFromCode(PAH?.countryOfResidence || "US"),
    },
  ];
 
  const approvedAt = PAH?.owner?.approvedAt;
  const approvedBy = PAH?.owner?.approvedByName;
 
  Iif (!PAH?.email) {
    return <TaskEmptyState section="pah" />;
  }
 
  return (
    <>
      <HideOrShow
        component={
          <ApprovalBanner
            text={`<span> This primary account holder was</span> <span> approved on</span> ${
              approvedAt
                ? merchantDateFormatter("MM/dd/yyyy", approvedAt) || ""
                : ""
            } by ${approvedBy}.`}
          />
        }
        hidden={!approvedAt || !approvedBy}
      />
 
      <CustomGrid itemsList={itemsList} />
    </>
  );
}
 
export default PahComponent;