@gusto/embedded-react-sdk 0.31.1-rc.1 → 0.32.0

package/dist/components/Contractor/Payments/CreatePayment/PreviewPresentation.js

@@ -1,17 +1,18 @@
 import { jsxs as m, jsx as t } from "react/jsx-runtime";
-import { useTranslation as x } from "react-i18next";
-import { useMemo as C } from "react";
-import { getContractorDisplayName as v } from "./helpers.js";
-import { FastAchSubmissionBlockerBanner as R } from "./FastAchSubmissionBlockerBanner.js";
-import { GenericBlocker as L } from "./GenericBlocker.js";
+import { useTranslation as C } from "react-i18next";
+import { useMemo as v } from "react";
+import { getContractorDisplayName as R } from "./helpers.js";
+import { FastAchSubmissionBlockerBanner as L } from "./FastAchSubmissionBlockerBanner.js";
+import { GenericBlocker as P } from "./GenericBlocker.js";
 import { Flex as u } from "../../../Common/Flex/Flex.js";
-import { useComponentContext as P } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useI18n as _ } from "../../../../i18n/I18n.js";
-import { formatHoursDisplay as E } from "../../../Payroll/helpers.js";
-import F from "../../../../hooks/useNumberFormatter.js";
+import "classnames";
 import { PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES as T } from "../../../../shared/constants.js";
+import { useComponentContext as _ } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as E } from "../../../../i18n/I18n.js";
+import { formatHoursDisplay as F } from "../../../Payroll/helpers.js";
+import j from "../../../../hooks/useNumberFormatter.js";
 import { DataView as p } from "../../../Common/DataView/DataView.js";
-const j = "0.000", Q = ({
+const I = "0.000", G = ({
   contractorPaymentGroup: i,
   contractors: f,
   onBackToEdit: A,
@@ -19,25 +20,26 @@ const j = "0.000", Q = ({
   isLoading: d,
   bankAccount: w,
   selectedUnblockOptions: c = {},
-  onUnblockOptionChange: b
+  onUnblockOptionChange: b,
+  paymentSpeed: D
 }) => {
-  const { Button: h, Text: n, Heading: y, Alert: D } = P();
-  _("Contractor.Payments.CreatePayment");
-  const { t: r } = x("Contractor.Payments.CreatePayment", {
+  const { Button: h, Text: n, Heading: y, Alert: H } = _();
+  E("Contractor.Payments.CreatePayment");
+  const { t: r } = C("Contractor.Payments.CreatePayment", {
     keyPrefix: "previewPresentation"
-  }), o = F(), H = (e) => e.wageType === "Hourly" && e.hourlyRate ? `${r("wageTypes.hourly")} ${o(Number(e.hourlyRate || "0"))}${r("perHour")}` : e.wageType, s = C(
+  }), o = j(), N = (e) => e.wageType === "Hourly" && e.hourlyRate ? `${r("wageTypes.hourly")} ${o(Number(e.hourlyRate || "0"))}${r("perHour")}` : e.wageType, s = v(
     () => i.contractorPayments?.reduce(
       (e, a) => (e.wageAmount += Number(a.wage || "0"), e.bonusAmount += Number(a.bonus || "0"), e.reimbursementAmount += Number(a.reimbursement || "0"), e.totalAmount += Number(a.wageTotal || "0"), e),
       { wageAmount: 0, bonusAmount: 0, reimbursementAmount: 0, totalAmount: 0 }
     ),
     [i.contractorPayments]
-  ), N = i.contractorPayments || [], l = (i.submissionBlockers || []).filter(
+  ), B = i.contractorPayments || [], l = (i.submissionBlockers || []).filter(
     (e) => e.status === "unresolved"
-  ), B = l.some(
-    (e) => !T.includes(e.blockerType || "")
   ), S = l.some(
+    (e) => !T.includes(e.blockerType || "")
+  ), k = l.some(
     (e) => !c[e.blockerType || ""]
-  ), k = d || l.length > 0 && (B || S);
+  ), x = d || l.length > 0 && (S || k);
   return /* @__PURE__ */ m(u, { flexDirection: "column", gap: 32, children: [
     /* @__PURE__ */ m(u, { justifyContent: "flex-end", gap: 16, children: [
       /* @__PURE__ */ m(u, { flexDirection: "column", gap: 2, children: [
@@ -52,14 +54,14 @@ const j = "0.000", Q = ({
             onClick: g,
             variant: "primary",
             isLoading: d,
-            isDisabled: k,
+            isDisabled: x,
             children: r("submitButton")
           }
         )
       ] })
     ] }),
     /* @__PURE__ */ t(
-      D,
+      H,
       {
         status: "info",
         label: r("alerts.submitPaymentsDeadline", {
@@ -71,14 +73,15 @@ const j = "0.000", Q = ({
     l.length > 0 && b && l.map((e) => {
       const a = e.blockerType || "";
       return T.includes(a) ? /* @__PURE__ */ t(
-        R,
+        L,
         {
           blocker: e,
           selectedValue: c[a],
-          onUnblockOptionChange: b
+          onUnblockOptionChange: b,
+          paymentSpeed: D
         },
         a
-      ) : /* @__PURE__ */ t(L, { blocker: e }, a);
+      ) : /* @__PURE__ */ t(P, { blocker: e }, a);
     }),
     /* @__PURE__ */ t(y, { as: "h3", children: r("paymentSummaryTitle") }),
     /* @__PURE__ */ t(
@@ -116,7 +119,7 @@ const j = "0.000", Q = ({
         columns: [
           {
             title: r("contractorTableHeaders.contractor"),
-            render: (e) => /* @__PURE__ */ t(n, { children: v(
+            render: (e) => /* @__PURE__ */ t(n, { children: R(
               f.find(
                 (a) => a.uuid === e.contractorUuid
               )
@@ -124,7 +127,7 @@ const j = "0.000", Q = ({
           },
           {
             title: r("contractorTableHeaders.wageType"),
-            render: (e) => /* @__PURE__ */ t(n, { children: H(e) })
+            render: (e) => /* @__PURE__ */ t(n, { children: N(e) })
           },
           {
             title: r("contractorTableHeaders.paymentMethod"),
@@ -134,7 +137,7 @@ const j = "0.000", Q = ({
             title: r("contractorTableHeaders.hours"),
             render: (e) => {
               const a = Number(e.hours || "0");
-              return /* @__PURE__ */ t(n, { children: e.wageType === "Hourly" && a ? E(a) : j });
+              return /* @__PURE__ */ t(n, { children: e.wageType === "Hourly" && a ? F(a) : I });
             }
           },
           {
@@ -154,7 +157,7 @@ const j = "0.000", Q = ({
             render: (e) => /* @__PURE__ */ t(n, { children: o(Number(e.wageTotal || "0")) })
           }
         ],
-        data: N,
+        data: B,
         footer: () => ({
           "column-0": /* @__PURE__ */ t(n, { weight: "bold", children: r("totalsLabel") }),
           "column-4": /* @__PURE__ */ t(n, { children: o(s?.wageAmount ?? 0) }),
@@ -168,6 +171,6 @@ const j = "0.000", Q = ({
   ] });
 };
 export {
-  Q as PreviewPresentation
+  G as PreviewPresentation
 };
 //# sourceMappingURL=PreviewPresentation.js.map

package/dist/components/Contractor/Payments/CreatePayment/PreviewPresentation.js.map

@@ -1 +1 @@
-{"version":3,"file":"PreviewPresentation.js","sources":["../../../../../src/components/Contractor/Payments/CreatePayment/PreviewPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { ContractorPaymentGroupPreview } from '@gusto/embedded-api/models/components/contractorpaymentgrouppreview'\nimport type { ContractorPaymentForGroupPreview } from '@gusto/embedded-api/models/components/contractorpaymentforgrouppreview'\nimport { useMemo } from 'react'\nimport type { Contractor } from '@gusto/embedded-api/models/components/contractor'\nimport type { CompanyBankAccount } from '@gusto/embedded-api/models/components/companybankaccount'\nimport { getContractorDisplayName } from './helpers'\nimport { FastAchSubmissionBlockerBanner } from './FastAchSubmissionBlockerBanner'\nimport { GenericBlocker } from './GenericBlocker'\nimport { DataView, Flex } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { formatHoursDisplay } from '@/components/Payroll/helpers'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES } from '@/shared/constants'\n\nconst ZERO_HOURS_DISPLAY = '0.000'\n\ninterface PreviewPresentationProps {\n  contractorPaymentGroup: ContractorPaymentGroupPreview\n  contractors: Contractor[]\n  onBackToEdit: () => void\n  onSubmit: () => void\n  isLoading: boolean\n  bankAccount?: CompanyBankAccount\n  selectedUnblockOptions?: Record<string, string>\n  onUnblockOptionChange?: (blockerType: string, value: string) => void\n}\n\nexport const PreviewPresentation = ({\n  contractorPaymentGroup,\n  contractors,\n  onBackToEdit,\n  onSubmit,\n  isLoading,\n  bankAccount,\n  selectedUnblockOptions = {},\n  onUnblockOptionChange,\n}: PreviewPresentationProps) => {\n  const { Button, Text, Heading, Alert } = useComponentContext()\n  useI18n('Contractor.Payments.CreatePayment')\n  const { t } = useTranslation('Contractor.Payments.CreatePayment', {\n    keyPrefix: 'previewPresentation',\n  })\n  const currencyFormatter = useNumberFormatter()\n\n  const formatWageType = (contractor: ContractorPaymentForGroupPreview) => {\n    if (contractor.wageType === 'Hourly' && contractor.hourlyRate) {\n      return `${t('wageTypes.hourly')} ${currencyFormatter(Number(contractor.hourlyRate || '0'))}${t('perHour')}`\n    }\n    return contractor.wageType\n  }\n\n  const totals = useMemo(\n    () =>\n      contractorPaymentGroup.contractorPayments?.reduce(\n        (acc, contractor) => {\n          acc.wageAmount += Number(contractor.wage || '0')\n          acc.bonusAmount += Number(contractor.bonus || '0')\n          acc.reimbursementAmount += Number(contractor.reimbursement || '0')\n          acc.totalAmount += Number(contractor.wageTotal || '0')\n          return acc\n        },\n        { wageAmount: 0, bonusAmount: 0, reimbursementAmount: 0, totalAmount: 0 },\n      ),\n    [contractorPaymentGroup.contractorPayments],\n  )\n\n  const contractorPayments = contractorPaymentGroup.contractorPayments || []\n\n  const submissionBlockers = (contractorPaymentGroup.submissionBlockers || []).filter(\n    blocker => blocker.status === 'unresolved',\n  )\n\n  const hasUnresolvableBlockers = submissionBlockers.some(\n    blocker => !PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES.includes(blocker.blockerType || ''),\n  )\n\n  const hasUnselectedBlockers = submissionBlockers.some(\n    blocker => !selectedUnblockOptions[blocker.blockerType || ''],\n  )\n\n  const isSubmitDisabled =\n    isLoading ||\n    (submissionBlockers.length > 0 && (hasUnresolvableBlockers || hasUnselectedBlockers))\n\n  return (\n    <Flex flexDirection=\"column\" gap={32}>\n      <Flex justifyContent=\"flex-end\" gap={16}>\n        <Flex flexDirection=\"column\" gap={2}>\n          <Heading as=\"h2\">{t('reviewAndSubmitTitle')}</Heading>\n          <Text variant=\"supporting\">\n            {t('reviewSubtitle', { debitDate: contractorPaymentGroup.debitDate })}\n          </Text>\n        </Flex>\n        <Flex justifyContent=\"flex-end\" gap={16}>\n          <Button onClick={onBackToEdit} variant=\"secondary\">\n            {t('editButton')}\n          </Button>\n          <Button\n            onClick={onSubmit}\n            variant=\"primary\"\n            isLoading={isLoading}\n            isDisabled={isSubmitDisabled}\n          >\n            {t('submitButton')}\n          </Button>\n        </Flex>\n      </Flex>\n\n      <Alert\n        status=\"info\"\n        label={t('alerts.submitPaymentsDeadline', {\n          checkDate: contractorPaymentGroup.checkDate,\n          debitDate: contractorPaymentGroup.debitDate,\n        })}\n      />\n\n      {submissionBlockers.length > 0 &&\n        onUnblockOptionChange &&\n        submissionBlockers.map(blocker => {\n          const blockerType = blocker.blockerType || ''\n\n          if (PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES.includes(blockerType)) {\n            return (\n              <FastAchSubmissionBlockerBanner\n                key={blockerType}\n                blocker={blocker}\n                selectedValue={selectedUnblockOptions[blockerType]}\n                onUnblockOptionChange={onUnblockOptionChange}\n              />\n            )\n          }\n\n          return <GenericBlocker key={blockerType} blocker={blocker} />\n        })}\n\n      {/* Payment Summary */}\n      <Heading as=\"h3\">{t('paymentSummaryTitle')}</Heading>\n      <DataView\n        columns={[\n          {\n            title: t('summaryTableHeaders.totalAmount'),\n            render: () => (\n              <Text>{currencyFormatter(Number(contractorPaymentGroup.totals?.amount || '0'))}</Text>\n            ),\n          },\n          {\n            title: t('summaryTableHeaders.debitAmount'),\n            render: () => (\n              <Text>\n                {currencyFormatter(Number(contractorPaymentGroup.totals?.debitAmount || '0'))}\n              </Text>\n            ),\n          },\n          {\n            title: t('summaryTableHeaders.debitAccount'),\n            render: () => <Text>{bankAccount?.hiddenAccountNumber ?? t('naDebitAccount')}</Text>,\n          },\n          {\n            title: t('summaryTableHeaders.debitDate'),\n            render: () => <Text>{contractorPaymentGroup.debitDate || 'debitDate'}</Text>,\n          },\n          {\n            title: t('summaryTableHeaders.contractorPayDate'),\n            render: () => <Text>{contractorPaymentGroup.checkDate || 'contractorPayDate'}</Text>,\n          },\n        ]}\n        data={[contractorPaymentGroup]}\n        label=\"Payment Summary\"\n      />\n\n      {/* Contractor Payments Table */}\n      <DataView\n        columns={[\n          {\n            title: t('contractorTableHeaders.contractor'),\n            render: contractorPayment => (\n              <Text>\n                {getContractorDisplayName(\n                  contractors.find(\n                    contractor => contractor.uuid === contractorPayment.contractorUuid,\n                  ),\n                )}\n              </Text>\n            ),\n          },\n          {\n            title: t('contractorTableHeaders.wageType'),\n            render: contractorPayment => <Text>{formatWageType(contractorPayment)}</Text>,\n          },\n          {\n            title: t('contractorTableHeaders.paymentMethod'),\n            render: contractorPayment => <Text>{contractorPayment.paymentMethod || 'N/A'}</Text>,\n          },\n          {\n            title: t('contractorTableHeaders.hours'),\n            render: contractorPayment => {\n              const hours = Number(contractorPayment.hours || '0')\n              return (\n                <Text>\n                  {contractorPayment.wageType === 'Hourly' && hours\n                    ? formatHoursDisplay(hours)\n                    : ZERO_HOURS_DISPLAY}\n                </Text>\n              )\n            },\n          },\n          {\n            title: t('contractorTableHeaders.wage'),\n            render: contractorPayment => (\n              <Text>\n                {contractorPayment.wageType === 'Fixed' && contractorPayment.wage\n                  ? currencyFormatter(Number(contractorPayment.wage || '0'))\n                  : currencyFormatter(0)}\n              </Text>\n            ),\n          },\n          {\n            title: t('contractorTableHeaders.bonus'),\n            render: contractorPayment => (\n              <Text>{currencyFormatter(Number(contractorPayment.bonus || '0'))}</Text>\n            ),\n          },\n          {\n            title: t('contractorTableHeaders.reimbursement'),\n            render: contractorPayment => (\n              <Text>{currencyFormatter(Number(contractorPayment.reimbursement || '0'))}</Text>\n            ),\n          },\n          {\n            title: t('contractorTableHeaders.total'),\n            render: contractorPayment => (\n              <Text>{currencyFormatter(Number(contractorPayment.wageTotal || '0'))}</Text>\n            ),\n          },\n        ]}\n        data={contractorPayments}\n        footer={() => ({\n          'column-0': <Text weight=\"bold\">{t('totalsLabel')}</Text>,\n          'column-4': <Text>{currencyFormatter(totals?.wageAmount ?? 0)}</Text>,\n          'column-5': <Text>{currencyFormatter(totals?.bonusAmount ?? 0)}</Text>,\n          'column-6': <Text>{currencyFormatter(totals?.reimbursementAmount ?? 0)}</Text>,\n          'column-7': <Text>{currencyFormatter(totals?.totalAmount ?? 0)}</Text>,\n        })}\n        label={t('whatYourCompanyPays')}\n      />\n    </Flex>\n  )\n}\n"],"names":["ZERO_HOURS_DISPLAY","PreviewPresentation","contractorPaymentGroup","contractors","onBackToEdit","onSubmit","isLoading","bankAccount","selectedUnblockOptions","onUnblockOptionChange","Button","Text","Heading","Alert","useComponentContext","useI18n","t","useTranslation","currencyFormatter","useNumberFormatter","formatWageType","contractor","totals","useMemo","acc","contractorPayments","submissionBlockers","blocker","hasUnresolvableBlockers","PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES","hasUnselectedBlockers","isSubmitDisabled","jsxs","Flex","jsx","blockerType","FastAchSubmissionBlockerBanner","GenericBlocker","DataView","contractorPayment","getContractorDisplayName","hours","formatHoursDisplay"],"mappings":"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"}
+{"version":3,"file":"PreviewPresentation.js","sources":["../../../../../src/components/Contractor/Payments/CreatePayment/PreviewPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { ContractorPaymentGroupPreview } from '@gusto/embedded-api/models/components/contractorpaymentgrouppreview'\nimport type { ContractorPaymentForGroupPreview } from '@gusto/embedded-api/models/components/contractorpaymentforgrouppreview'\nimport { useMemo } from 'react'\nimport type { Contractor } from '@gusto/embedded-api/models/components/contractor'\nimport type { CompanyBankAccount } from '@gusto/embedded-api/models/components/companybankaccount'\nimport { getContractorDisplayName } from './helpers'\nimport { FastAchSubmissionBlockerBanner } from './FastAchSubmissionBlockerBanner'\nimport { GenericBlocker } from './GenericBlocker'\nimport { DataView, Flex } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { formatHoursDisplay } from '@/components/Payroll/helpers'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES } from '@/shared/constants'\n\nconst ZERO_HOURS_DISPLAY = '0.000'\n\ninterface PreviewPresentationProps {\n  contractorPaymentGroup: ContractorPaymentGroupPreview\n  contractors: Contractor[]\n  onBackToEdit: () => void\n  onSubmit: () => void\n  isLoading: boolean\n  bankAccount?: CompanyBankAccount\n  selectedUnblockOptions?: Record<string, string>\n  onUnblockOptionChange?: (blockerType: string, value: string) => void\n  paymentSpeed?: string\n}\n\nexport const PreviewPresentation = ({\n  contractorPaymentGroup,\n  contractors,\n  onBackToEdit,\n  onSubmit,\n  isLoading,\n  bankAccount,\n  selectedUnblockOptions = {},\n  onUnblockOptionChange,\n  paymentSpeed,\n}: PreviewPresentationProps) => {\n  const { Button, Text, Heading, Alert } = useComponentContext()\n  useI18n('Contractor.Payments.CreatePayment')\n  const { t } = useTranslation('Contractor.Payments.CreatePayment', {\n    keyPrefix: 'previewPresentation',\n  })\n  const currencyFormatter = useNumberFormatter()\n\n  const formatWageType = (contractor: ContractorPaymentForGroupPreview) => {\n    if (contractor.wageType === 'Hourly' && contractor.hourlyRate) {\n      return `${t('wageTypes.hourly')} ${currencyFormatter(Number(contractor.hourlyRate || '0'))}${t('perHour')}`\n    }\n    return contractor.wageType\n  }\n\n  const totals = useMemo(\n    () =>\n      contractorPaymentGroup.contractorPayments?.reduce(\n        (acc, contractor) => {\n          acc.wageAmount += Number(contractor.wage || '0')\n          acc.bonusAmount += Number(contractor.bonus || '0')\n          acc.reimbursementAmount += Number(contractor.reimbursement || '0')\n          acc.totalAmount += Number(contractor.wageTotal || '0')\n          return acc\n        },\n        { wageAmount: 0, bonusAmount: 0, reimbursementAmount: 0, totalAmount: 0 },\n      ),\n    [contractorPaymentGroup.contractorPayments],\n  )\n\n  const contractorPayments = contractorPaymentGroup.contractorPayments || []\n\n  const submissionBlockers = (contractorPaymentGroup.submissionBlockers || []).filter(\n    blocker => blocker.status === 'unresolved',\n  )\n\n  const hasUnresolvableBlockers = submissionBlockers.some(\n    blocker => !PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES.includes(blocker.blockerType || ''),\n  )\n\n  const hasUnselectedBlockers = submissionBlockers.some(\n    blocker => !selectedUnblockOptions[blocker.blockerType || ''],\n  )\n\n  const isSubmitDisabled =\n    isLoading ||\n    (submissionBlockers.length > 0 && (hasUnresolvableBlockers || hasUnselectedBlockers))\n\n  return (\n    <Flex flexDirection=\"column\" gap={32}>\n      <Flex justifyContent=\"flex-end\" gap={16}>\n        <Flex flexDirection=\"column\" gap={2}>\n          <Heading as=\"h2\">{t('reviewAndSubmitTitle')}</Heading>\n          <Text variant=\"supporting\">\n            {t('reviewSubtitle', { debitDate: contractorPaymentGroup.debitDate })}\n          </Text>\n        </Flex>\n        <Flex justifyContent=\"flex-end\" gap={16}>\n          <Button onClick={onBackToEdit} variant=\"secondary\">\n            {t('editButton')}\n          </Button>\n          <Button\n            onClick={onSubmit}\n            variant=\"primary\"\n            isLoading={isLoading}\n            isDisabled={isSubmitDisabled}\n          >\n            {t('submitButton')}\n          </Button>\n        </Flex>\n      </Flex>\n\n      <Alert\n        status=\"info\"\n        label={t('alerts.submitPaymentsDeadline', {\n          checkDate: contractorPaymentGroup.checkDate,\n          debitDate: contractorPaymentGroup.debitDate,\n        })}\n      />\n\n      {submissionBlockers.length > 0 &&\n        onUnblockOptionChange &&\n        submissionBlockers.map(blocker => {\n          const blockerType = blocker.blockerType || ''\n\n          if (PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES.includes(blockerType)) {\n            return (\n              <FastAchSubmissionBlockerBanner\n                key={blockerType}\n                blocker={blocker}\n                selectedValue={selectedUnblockOptions[blockerType]}\n                onUnblockOptionChange={onUnblockOptionChange}\n                paymentSpeed={paymentSpeed}\n              />\n            )\n          }\n\n          return <GenericBlocker key={blockerType} blocker={blocker} />\n        })}\n\n      {/* Payment Summary */}\n      <Heading as=\"h3\">{t('paymentSummaryTitle')}</Heading>\n      <DataView\n        columns={[\n          {\n            title: t('summaryTableHeaders.totalAmount'),\n            render: () => (\n              <Text>{currencyFormatter(Number(contractorPaymentGroup.totals?.amount || '0'))}</Text>\n            ),\n          },\n          {\n            title: t('summaryTableHeaders.debitAmount'),\n            render: () => (\n              <Text>\n                {currencyFormatter(Number(contractorPaymentGroup.totals?.debitAmount || '0'))}\n              </Text>\n            ),\n          },\n          {\n            title: t('summaryTableHeaders.debitAccount'),\n            render: () => <Text>{bankAccount?.hiddenAccountNumber ?? t('naDebitAccount')}</Text>,\n          },\n          {\n            title: t('summaryTableHeaders.debitDate'),\n            render: () => <Text>{contractorPaymentGroup.debitDate || 'debitDate'}</Text>,\n          },\n          {\n            title: t('summaryTableHeaders.contractorPayDate'),\n            render: () => <Text>{contractorPaymentGroup.checkDate || 'contractorPayDate'}</Text>,\n          },\n        ]}\n        data={[contractorPaymentGroup]}\n        label=\"Payment Summary\"\n      />\n\n      {/* Contractor Payments Table */}\n      <DataView\n        columns={[\n          {\n            title: t('contractorTableHeaders.contractor'),\n            render: contractorPayment => (\n              <Text>\n                {getContractorDisplayName(\n                  contractors.find(\n                    contractor => contractor.uuid === contractorPayment.contractorUuid,\n                  ),\n                )}\n              </Text>\n            ),\n          },\n          {\n            title: t('contractorTableHeaders.wageType'),\n            render: contractorPayment => <Text>{formatWageType(contractorPayment)}</Text>,\n          },\n          {\n            title: t('contractorTableHeaders.paymentMethod'),\n            render: contractorPayment => <Text>{contractorPayment.paymentMethod || 'N/A'}</Text>,\n          },\n          {\n            title: t('contractorTableHeaders.hours'),\n            render: contractorPayment => {\n              const hours = Number(contractorPayment.hours || '0')\n              return (\n                <Text>\n                  {contractorPayment.wageType === 'Hourly' && hours\n                    ? formatHoursDisplay(hours)\n                    : ZERO_HOURS_DISPLAY}\n                </Text>\n              )\n            },\n          },\n          {\n            title: t('contractorTableHeaders.wage'),\n            render: contractorPayment => (\n              <Text>\n                {contractorPayment.wageType === 'Fixed' && contractorPayment.wage\n                  ? currencyFormatter(Number(contractorPayment.wage || '0'))\n                  : currencyFormatter(0)}\n              </Text>\n            ),\n          },\n          {\n            title: t('contractorTableHeaders.bonus'),\n            render: contractorPayment => (\n              <Text>{currencyFormatter(Number(contractorPayment.bonus || '0'))}</Text>\n            ),\n          },\n          {\n            title: t('contractorTableHeaders.reimbursement'),\n            render: contractorPayment => (\n              <Text>{currencyFormatter(Number(contractorPayment.reimbursement || '0'))}</Text>\n            ),\n          },\n          {\n            title: t('contractorTableHeaders.total'),\n            render: contractorPayment => (\n              <Text>{currencyFormatter(Number(contractorPayment.wageTotal || '0'))}</Text>\n            ),\n          },\n        ]}\n        data={contractorPayments}\n        footer={() => ({\n          'column-0': <Text weight=\"bold\">{t('totalsLabel')}</Text>,\n          'column-4': <Text>{currencyFormatter(totals?.wageAmount ?? 0)}</Text>,\n          'column-5': <Text>{currencyFormatter(totals?.bonusAmount ?? 0)}</Text>,\n          'column-6': <Text>{currencyFormatter(totals?.reimbursementAmount ?? 0)}</Text>,\n          'column-7': <Text>{currencyFormatter(totals?.totalAmount ?? 0)}</Text>,\n        })}\n        label={t('whatYourCompanyPays')}\n      />\n    </Flex>\n  )\n}\n"],"names":["ZERO_HOURS_DISPLAY","PreviewPresentation","contractorPaymentGroup","contractors","onBackToEdit","onSubmit","isLoading","bankAccount","selectedUnblockOptions","onUnblockOptionChange","paymentSpeed","Button","Text","Heading","Alert","useComponentContext","useI18n","t","useTranslation","currencyFormatter","useNumberFormatter","formatWageType","contractor","totals","useMemo","acc","contractorPayments","submissionBlockers","blocker","hasUnresolvableBlockers","PAYROLL_RESOLVABLE_SUBMISSION_BLOCKER_TYPES","hasUnselectedBlockers","isSubmitDisabled","jsxs","Flex","jsx","blockerType","FastAchSubmissionBlockerBanner","GenericBlocker","DataView","contractorPayment","getContractorDisplayName","hours","formatHoursDisplay"],"mappings":"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"}

package/dist/components/Contractor/Payments/PaymentHistory/PaymentHistoryPresentation.js

@@ -3,6 +3,8 @@ import { useTranslation as N, Trans as D } from "react-i18next";
 import { getContractorDisplayName as x } from "../CreatePayment/helpers.js";
 import u from "./PaymentHistoryPresentation.module.scss.js";
 import { Flex as l } from "../../../Common/Flex/Flex.js";
+import "classnames";
+import "../../../../shared/constants.js";
 import { EmptyData as P } from "../../../Common/EmptyData/EmptyData.js";
 import { HamburgerMenu as C } from "../../../Common/HamburgerMenu/HamburgerMenu.js";
 import { useComponentContext as F } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
@@ -13,7 +15,7 @@ import { useDateFormatter as L } from "../../../../hooks/useDateFormatter.js";
 import M from "../../../../assets/icons/eye.svg.js";
 import T from "../../../../assets/icons/slash-circle.svg.js";
 import { DataView as j } from "../../../Common/DataView/DataView.js";
-const U = ({
+const Z = ({
   paymentGroup: s,
   contractors: h,
   onViewPayment: b,
@@ -114,6 +116,6 @@ const U = ({
   ] });
 };
 export {
-  U as PaymentHistoryPresentation
+  Z as PaymentHistoryPresentation
 };
 //# sourceMappingURL=PaymentHistoryPresentation.js.map

package/dist/components/Contractor/Payments/PaymentHistory/PaymentHistoryPresentation.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentHistoryPresentation.js","sources":["../../../../../src/components/Contractor/Payments/PaymentHistory/PaymentHistoryPresentation.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport type { ContractorPaymentGroup } from '@gusto/embedded-api/models/components/contractorpaymentgroup'\nimport type { Contractor } from '@gusto/embedded-api/models/components/contractor'\nimport { getContractorDisplayName } from '../CreatePayment/helpers'\nimport styles from './PaymentHistoryPresentation.module.scss'\nimport { DataView, Flex, EmptyData } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport { useI18n } from '@/i18n'\nimport { formatHoursDisplay } from '@/components/Payroll/helpers'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport EyeIcon from '@/assets/icons/eye.svg?react'\nimport CancelIcon from '@/assets/icons/slash-circle.svg?react'\n\ninterface PaymentHistoryPresentationProps {\n  paymentGroup: ContractorPaymentGroup\n  contractors: Contractor[]\n  onViewPayment: (paymentId: string) => void\n  onCancelPayment: (paymentId: string) => void\n  isCancelling: boolean\n}\n\nexport const PaymentHistoryPresentation = ({\n  paymentGroup,\n  contractors,\n  onViewPayment,\n  onCancelPayment,\n  isCancelling,\n}: PaymentHistoryPresentationProps) => {\n  const { Text, Heading } = useComponentContext()\n  useI18n('Contractor.Payments.PaymentHistory')\n  const { t } = useTranslation('Contractor.Payments.PaymentHistory')\n  const currencyFormatter = useNumberFormatter('currency')\n  const { formatLongWithYear } = useDateFormatter()\n\n  const payments = paymentGroup.contractorPayments || []\n\n  return (\n    <Flex flexDirection=\"column\" gap={32}>\n      <Flex flexDirection=\"column\" gap={8}>\n        <Heading as=\"h2\">{t('title')}</Heading>\n        <Text>\n          <Trans\n            i18nKey={'subtitle'}\n            t={t}\n            values={{ date: formatLongWithYear(paymentGroup.debitDate) }}\n            components={{\n              strong: <Text weight=\"bold\" as=\"span\" />,\n            }}\n          />\n        </Text>\n      </Flex>\n\n      <Flex flexDirection=\"column\" gap={16}>\n        <Heading as=\"h2\">{t('paymentsSection')}</Heading>\n\n        {payments.length === 0 ? (\n          <EmptyData title={t('noPaymentsFound')} description={t('noPaymentsDescription')} />\n        ) : (\n          <>\n            <DataView\n              columns={[\n                {\n                  title: t('tableHeaders.contractor'),\n                  render: ({ contractorUuid }) =>\n                    getContractorDisplayName(\n                      contractors.find(contractor => contractor.uuid === contractorUuid),\n                    ),\n                },\n                {\n                  title: t('tableHeaders.wageType'),\n                  render: ({ wageType }) => <Text>{wageType}</Text>,\n                },\n                {\n                  title: t('tableHeaders.paymentMethod'),\n                  render: ({ paymentMethod }) => <Text>{paymentMethod}</Text>,\n                },\n                {\n                  title: t('tableHeaders.hours'),\n                  render: ({ hours }) => (\n                    <Text>{hours ? formatHoursDisplay(Number(hours)) : '–'}</Text>\n                  ),\n                },\n                {\n                  title: t('tableHeaders.wage'),\n                  render: ({ wage }) => <Text>{wage ? currencyFormatter(Number(wage)) : '–'}</Text>,\n                },\n                {\n                  title: t('tableHeaders.bonus'),\n                  render: ({ bonus }) => (\n                    <Text>{bonus ? currencyFormatter(Number(bonus)) : '–'}</Text>\n                  ),\n                },\n                {\n                  title: t('tableHeaders.reimbursements'),\n                  render: ({ reimbursement }) => (\n                    <Text>{reimbursement ? currencyFormatter(Number(reimbursement)) : '–'}</Text>\n                  ),\n                },\n                {\n                  title: t('tableHeaders.total'),\n                  render: ({ wageTotal, reimbursement, bonus }) => (\n                    <Text>\n                      {wageTotal\n                        ? currencyFormatter(\n                            Number(wageTotal) + Number(reimbursement) + Number(bonus),\n                          )\n                        : '–'}\n                    </Text>\n                  ),\n                },\n              ]}\n              itemMenu={({ contractorUuid, mayCancel, uuid }) => {\n                const items = [\n                  {\n                    label: t('actions.view'),\n                    onClick: () => {\n                      onViewPayment(contractorUuid!)\n                    },\n                    icon: (\n                      <span className={styles.icon}>\n                        <EyeIcon aria-hidden />\n                      </span>\n                    ),\n                  },\n                ]\n                if (mayCancel) {\n                  items.push({\n                    label: t('actions.cancel'),\n                    onClick: () => {\n                      onCancelPayment(uuid!)\n                    },\n                    icon: (\n                      <span className={styles.icon}>\n                        <CancelIcon aria-hidden />\n                      </span>\n                    ),\n                  })\n                }\n                return (\n                  <HamburgerMenu\n                    items={items}\n                    triggerLabel={t('tableHeaders.action')}\n                    isLoading={isCancelling}\n                  />\n                )\n              }}\n              data={payments}\n              label={t('title')}\n            />\n          </>\n        )}\n      </Flex>\n    </Flex>\n  )\n}\n"],"names":["PaymentHistoryPresentation","paymentGroup","contractors","onViewPayment","onCancelPayment","isCancelling","Text","Heading","useComponentContext","useI18n","useTranslation","currencyFormatter","useNumberFormatter","formatLongWithYear","useDateFormatter","payments","jsxs","Flex","jsx","Trans","EmptyData","Fragment","DataView","contractorUuid","getContractorDisplayName","contractor","wageType","paymentMethod","hours","formatHoursDisplay","wage","bonus","reimbursement","wageTotal","mayCancel","uuid","items","styles","EyeIcon","CancelIcon","HamburgerMenu"],"mappings":"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"}
+{"version":3,"file":"PaymentHistoryPresentation.js","sources":["../../../../../src/components/Contractor/Payments/PaymentHistory/PaymentHistoryPresentation.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport type { ContractorPaymentGroup } from '@gusto/embedded-api/models/components/contractorpaymentgroup'\nimport type { Contractor } from '@gusto/embedded-api/models/components/contractor'\nimport { getContractorDisplayName } from '../CreatePayment/helpers'\nimport styles from './PaymentHistoryPresentation.module.scss'\nimport { DataView, Flex, EmptyData } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport { useI18n } from '@/i18n'\nimport { formatHoursDisplay } from '@/components/Payroll/helpers'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport EyeIcon from '@/assets/icons/eye.svg?react'\nimport CancelIcon from '@/assets/icons/slash-circle.svg?react'\n\ninterface PaymentHistoryPresentationProps {\n  paymentGroup: ContractorPaymentGroup\n  contractors: Contractor[]\n  onViewPayment: (paymentId: string) => void\n  onCancelPayment: (paymentId: string) => void\n  isCancelling: boolean\n}\n\nexport const PaymentHistoryPresentation = ({\n  paymentGroup,\n  contractors,\n  onViewPayment,\n  onCancelPayment,\n  isCancelling,\n}: PaymentHistoryPresentationProps) => {\n  const { Text, Heading } = useComponentContext()\n  useI18n('Contractor.Payments.PaymentHistory')\n  const { t } = useTranslation('Contractor.Payments.PaymentHistory')\n  const currencyFormatter = useNumberFormatter('currency')\n  const { formatLongWithYear } = useDateFormatter()\n\n  const payments = paymentGroup.contractorPayments || []\n\n  return (\n    <Flex flexDirection=\"column\" gap={32}>\n      <Flex flexDirection=\"column\" gap={8}>\n        <Heading as=\"h2\">{t('title')}</Heading>\n        <Text>\n          <Trans\n            i18nKey={'subtitle'}\n            t={t}\n            values={{ date: formatLongWithYear(paymentGroup.debitDate) }}\n            components={{\n              strong: <Text weight=\"bold\" as=\"span\" />,\n            }}\n          />\n        </Text>\n      </Flex>\n\n      <Flex flexDirection=\"column\" gap={16}>\n        <Heading as=\"h2\">{t('paymentsSection')}</Heading>\n\n        {payments.length === 0 ? (\n          <EmptyData title={t('noPaymentsFound')} description={t('noPaymentsDescription')} />\n        ) : (\n          <>\n            <DataView\n              columns={[\n                {\n                  title: t('tableHeaders.contractor'),\n                  render: ({ contractorUuid }) =>\n                    getContractorDisplayName(\n                      contractors.find(contractor => contractor.uuid === contractorUuid),\n                    ),\n                },\n                {\n                  title: t('tableHeaders.wageType'),\n                  render: ({ wageType }) => <Text>{wageType}</Text>,\n                },\n                {\n                  title: t('tableHeaders.paymentMethod'),\n                  render: ({ paymentMethod }) => <Text>{paymentMethod}</Text>,\n                },\n                {\n                  title: t('tableHeaders.hours'),\n                  render: ({ hours }) => (\n                    <Text>{hours ? formatHoursDisplay(Number(hours)) : '–'}</Text>\n                  ),\n                },\n                {\n                  title: t('tableHeaders.wage'),\n                  render: ({ wage }) => <Text>{wage ? currencyFormatter(Number(wage)) : '–'}</Text>,\n                },\n                {\n                  title: t('tableHeaders.bonus'),\n                  render: ({ bonus }) => (\n                    <Text>{bonus ? currencyFormatter(Number(bonus)) : '–'}</Text>\n                  ),\n                },\n                {\n                  title: t('tableHeaders.reimbursements'),\n                  render: ({ reimbursement }) => (\n                    <Text>{reimbursement ? currencyFormatter(Number(reimbursement)) : '–'}</Text>\n                  ),\n                },\n                {\n                  title: t('tableHeaders.total'),\n                  render: ({ wageTotal, reimbursement, bonus }) => (\n                    <Text>\n                      {wageTotal\n                        ? currencyFormatter(\n                            Number(wageTotal) + Number(reimbursement) + Number(bonus),\n                          )\n                        : '–'}\n                    </Text>\n                  ),\n                },\n              ]}\n              itemMenu={({ contractorUuid, mayCancel, uuid }) => {\n                const items = [\n                  {\n                    label: t('actions.view'),\n                    onClick: () => {\n                      onViewPayment(contractorUuid!)\n                    },\n                    icon: (\n                      <span className={styles.icon}>\n                        <EyeIcon aria-hidden />\n                      </span>\n                    ),\n                  },\n                ]\n                if (mayCancel) {\n                  items.push({\n                    label: t('actions.cancel'),\n                    onClick: () => {\n                      onCancelPayment(uuid!)\n                    },\n                    icon: (\n                      <span className={styles.icon}>\n                        <CancelIcon aria-hidden />\n                      </span>\n                    ),\n                  })\n                }\n                return (\n                  <HamburgerMenu\n                    items={items}\n                    triggerLabel={t('tableHeaders.action')}\n                    isLoading={isCancelling}\n                  />\n                )\n              }}\n              data={payments}\n              label={t('title')}\n            />\n          </>\n        )}\n      </Flex>\n    </Flex>\n  )\n}\n"],"names":["PaymentHistoryPresentation","paymentGroup","contractors","onViewPayment","onCancelPayment","isCancelling","Text","Heading","useComponentContext","useI18n","useTranslation","currencyFormatter","useNumberFormatter","formatLongWithYear","useDateFormatter","payments","jsxs","Flex","jsx","Trans","EmptyData","Fragment","DataView","contractorUuid","getContractorDisplayName","contractor","wageType","paymentMethod","hours","formatHoursDisplay","wage","bonus","reimbursement","wageTotal","mayCancel","uuid","items","styles","EyeIcon","CancelIcon","HamburgerMenu"],"mappings":"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"}

package/dist/components/Contractor/Payments/PaymentStatement/PaymentStatementPresentation.js

@@ -4,6 +4,8 @@ import { useMemo as v } from "react";
 import { getContractorDisplayName as x } from "../CreatePayment/helpers.js";
 import i from "./PaymentStatementPresentation.module.scss.js";
 import { Flex as m } from "../../../Common/Flex/Flex.js";
+import "classnames";
+import "../../../../shared/constants.js";
 import { useComponentContext as C } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
 import { useI18n as A } from "../../../../i18n/I18n.js";
 import { formatHoursDisplay as H } from "../../../Payroll/helpers.js";
@@ -12,7 +14,7 @@ import { useDateFormatter as j } from "../../../../hooks/useDateFormatter.js";
 import { addressInline as B, formatPhoneNumber as K } from "../../../../helpers/formattedStrings.js";
 import O from "../../../../assets/icons/receipt-check.svg.js";
 import { DataView as w } from "../../../Common/DataView/DataView.js";
-const R = ({
+const re = ({
   payment: s,
   contractor: c,
   checkDate: k,
@@ -20,7 +22,7 @@ const R = ({
 }) => {
   const { Text: n, Heading: h } = C();
   A("Contractor.Payments.PaymentStatement");
-  const { t: r } = S("Contractor.Payments.PaymentStatement"), l = M("currency"), { formatLongWithYear: u } = j(), { Link: I } = C(), b = x(c), f = s.wageType === "Hourly", d = Number(s.hours || 0), g = Number(s.hourlyRate || 0), p = Number(s.bonus || 0), N = Number(s.reimbursement || 0), D = Number(s.wageTotal || 0), T = !!(t && s.status === "Funded" && s.paymentMethod === "Direct Deposit"), z = t?.totals?.companyDebit || "0", L = v(() => t ? [
+  const { t: r } = S("Contractor.Payments.PaymentStatement"), l = M("currency"), { formatLongWithYear: u } = j(), { Link: I } = C(), b = x(c), f = s.wageType === "Hourly", d = Number(s.hours || 0), p = Number(s.hourlyRate || 0), g = Number(s.bonus || 0), N = Number(s.reimbursement || 0), D = Number(s.wageTotal || 0), T = !!(t && s.status === "Funded" && s.paymentMethod === "Direct Deposit"), z = t?.totals?.companyDebit || "0", L = v(() => t ? [
     {
       label: r("receipt.from"),
       value: t.nameOfSender || ""
@@ -44,14 +46,14 @@ const R = ({
       label: r("hoursLabel"),
       amount: r("hoursAmount", {
         hours: H(d),
-        rate: l(g)
+        rate: l(p)
       })
     }) : o.push({
       label: r("wageLabel"),
       amount: l(Number(s.wage || 0))
     }), o.push({
       label: r("bonus"),
-      amount: l(p)
+      amount: l(g)
     }), o.push({
       label: r("reimbursement"),
       amount: l(N)
@@ -61,8 +63,8 @@ const R = ({
     D,
     f,
     d,
-    g,
     p,
+    g,
     N,
     r,
     l,
@@ -150,6 +152,6 @@ const R = ({
   ] });
 };
 export {
-  R as PaymentStatementPresentation
+  re as PaymentStatementPresentation
 };
 //# sourceMappingURL=PaymentStatementPresentation.js.map

package/dist/components/Contractor/Payments/PaymentStatement/PaymentStatementPresentation.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentStatementPresentation.js","sources":["../../../../../src/components/Contractor/Payments/PaymentStatement/PaymentStatementPresentation.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport type { ContractorPaymentForGroup } from '@gusto/embedded-api/models/components/contractorpaymentforgroup'\nimport type { Contractor } from '@gusto/embedded-api/models/components/contractor'\nimport { useMemo } from 'react'\nimport type { ContractorPaymentReceipt } from '@gusto/embedded-api/models/components/contractorpaymentreceipt'\nimport { getContractorDisplayName } from '../CreatePayment/helpers'\nimport styles from './PaymentStatementPresentation.module.scss'\nimport { DataView, Flex } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { formatHoursDisplay } from '@/components/Payroll/helpers'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport { addressInline, formatPhoneNumber } from '@/helpers/formattedStrings'\nimport ReceiptCheck from '@/assets/icons/receipt-check.svg?react'\n\ninterface PaymentStatementPresentationProps {\n  payment: ContractorPaymentForGroup\n  contractor: Contractor\n  paymentReceipt?: ContractorPaymentReceipt\n  checkDate: string\n}\n\ntype PaymentStatementRow = {\n  label: string\n  amount: string | null\n}\n\nexport const PaymentStatementPresentation = ({\n  payment,\n  contractor,\n  checkDate,\n  paymentReceipt,\n}: PaymentStatementPresentationProps) => {\n  const { Text, Heading } = useComponentContext()\n  useI18n('Contractor.Payments.PaymentStatement')\n  const { t } = useTranslation('Contractor.Payments.PaymentStatement')\n  const currencyFormatter = useNumberFormatter('currency')\n  const { formatLongWithYear } = useDateFormatter()\n  const { Link } = useComponentContext()\n\n  const contractorName = getContractorDisplayName(contractor)\n  const isHourly = payment.wageType === 'Hourly'\n  const hours = Number(payment.hours || 0)\n  const hourlyRate = Number(payment.hourlyRate || 0)\n  const bonus = Number(payment.bonus || 0)\n  const reimbursement = Number(payment.reimbursement || 0)\n  const wageTotal = Number(payment.wageTotal || 0)\n\n  const shouldShowReceipt = Boolean(\n    paymentReceipt && payment.status === 'Funded' && payment.paymentMethod === 'Direct Deposit',\n  )\n\n  const receiptTotal = paymentReceipt?.totals?.companyDebit || '0'\n\n  const receiptDetailsConfig = useMemo(() => {\n    if (!paymentReceipt) return []\n\n    return [\n      {\n        label: t('receipt.from'),\n        value: paymentReceipt.nameOfSender || '',\n      },\n      {\n        label: t('receipt.to'),\n        value: getContractorDisplayName(contractor),\n      },\n      {\n        label: t('receipt.debitDate'),\n        value: paymentReceipt.debitDate ? formatLongWithYear(String(paymentReceipt.debitDate)) : '',\n      },\n    ]\n  }, [paymentReceipt, contractor, t, formatLongWithYear])\n\n  const statementRows = useMemo<PaymentStatementRow[]>(() => {\n    const rows: PaymentStatementRow[] = [\n      {\n        label: payment.paymentMethod || '',\n        amount: currencyFormatter(wageTotal),\n      },\n    ]\n\n    if (isHourly && hours > 0) {\n      rows.push({\n        label: t('hoursLabel'),\n        amount: t('hoursAmount', {\n          hours: formatHoursDisplay(hours),\n          rate: currencyFormatter(hourlyRate),\n        }),\n      })\n    } else {\n      rows.push({\n        label: t('wageLabel'),\n        amount: currencyFormatter(Number(payment.wage || 0)),\n      })\n    }\n\n    rows.push({\n      label: t('bonus'),\n      amount: currencyFormatter(bonus),\n    })\n\n    rows.push({\n      label: t('reimbursement'),\n      amount: currencyFormatter(reimbursement),\n    })\n\n    return rows\n  }, [\n    payment.paymentMethod,\n    wageTotal,\n    isHourly,\n    hours,\n    hourlyRate,\n    bonus,\n    reimbursement,\n    t,\n    currencyFormatter,\n    payment.wage,\n  ])\n\n  return (\n    <Flex flexDirection=\"column\" gap={32}>\n      <Flex flexDirection=\"column\" gap={16}>\n        <Flex flexDirection=\"column\" gap={8}>\n          <Heading as=\"h2\">{t('title', { contractorName })}</Heading>\n          <Text>{formatLongWithYear(checkDate)}</Text>\n        </Flex>\n      </Flex>\n\n      {shouldShowReceipt && (\n        <div className={styles.receiptCard}>\n          <Flex flexDirection=\"column\" gap={24}>\n            <Flex flexDirection=\"column\" alignItems=\"center\" gap={16}>\n              <div className={styles.receiptIcon} aria-hidden>\n                <ReceiptCheck className={styles.checkmarkIcon} />\n              </div>\n\n              <Flex flexDirection=\"column\" alignItems=\"center\" gap={8}>\n                <Text size=\"sm\" variant=\"supporting\">\n                  {t('receipt.totalLabel')}\n                </Text>\n                <Heading as=\"h1\" styledAs=\"h2\" className={styles.totalAmount}>\n                  {currencyFormatter(Number(receiptTotal))}\n                </Heading>\n              </Flex>\n            </Flex>\n\n            <div className={styles.receiptDetailsTable}>\n              <DataView\n                label={t('receipt.detailsLabel')}\n                variant=\"minimal\"\n                breakAt=\"small\"\n                breakpoints={{\n                  base: '0rem',\n                  small: '22rem',\n                }}\n                columns={[\n                  {\n                    title: '',\n                    render: (item: { label: string; value: string }) => (\n                      <Text size=\"sm\" variant=\"supporting\">\n                        {item.label}\n                      </Text>\n                    ),\n                  },\n                  {\n                    title: '',\n                    render: (item: { label: string; value: string }) => (\n                      <Text size=\"sm\">{item.value}</Text>\n                    ),\n                  },\n                ]}\n                data={receiptDetailsConfig}\n              />\n            </div>\n            <hr />\n            <Flex flexDirection=\"column\" alignItems=\"center\" gap={12}>\n              <Text size=\"sm\" variant=\"supporting\" className={styles.disclaimer}>\n                <Trans\n                  i18nKey=\"receipt.disclaimer\"\n                  t={t}\n                  components={{\n                    licensesLink: <Link href={paymentReceipt?.licenseUri || ''} target=\"_blank\" />,\n                  }}\n                />\n              </Text>\n              <hr />\n\n              <Text size=\"sm\" variant=\"supporting\" className={styles.companyInfo}>\n                {paymentReceipt?.licensee?.name || ''}\n              </Text>\n              <Text size=\"sm\" variant=\"supporting\" className={styles.address}>\n                {addressInline({\n                  street1: paymentReceipt?.licensee?.address || '',\n                  city: paymentReceipt?.licensee?.city || '',\n                  state: paymentReceipt?.licensee?.state || '',\n                  zip: paymentReceipt?.licensee?.postalCode || '',\n                  country: '',\n                  uuid: '',\n                })}\n                {' | '}\n                {formatPhoneNumber(paymentReceipt?.licensee?.phoneNumber)}\n              </Text>\n            </Flex>\n          </Flex>\n        </div>\n      )}\n\n      <DataView\n        columns={[\n          {\n            title: t('debitedColumn'),\n            render: ({ label }) => <Text>{label}</Text>,\n          },\n          {\n            title: t('amountColumn'),\n            render: ({ amount }) => <Text>{amount || ''}</Text>,\n          },\n        ]}\n        data={statementRows}\n        label={t('title', { contractorName })}\n      />\n    </Flex>\n  )\n}\n"],"names":["PaymentStatementPresentation","payment","contractor","checkDate","paymentReceipt","Text","Heading","useComponentContext","useI18n","t","useTranslation","currencyFormatter","useNumberFormatter","formatLongWithYear","useDateFormatter","Link","contractorName","getContractorDisplayName","isHourly","hours","hourlyRate","bonus","reimbursement","wageTotal","shouldShowReceipt","receiptTotal","receiptDetailsConfig","useMemo","statementRows","rows","formatHoursDisplay","jsxs","Flex","jsx","styles","ReceiptCheck","DataView","item","Trans","addressInline","formatPhoneNumber","label","amount"],"mappings":"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"}
+{"version":3,"file":"PaymentStatementPresentation.js","sources":["../../../../../src/components/Contractor/Payments/PaymentStatement/PaymentStatementPresentation.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport type { ContractorPaymentForGroup } from '@gusto/embedded-api/models/components/contractorpaymentforgroup'\nimport type { Contractor } from '@gusto/embedded-api/models/components/contractor'\nimport { useMemo } from 'react'\nimport type { ContractorPaymentReceipt } from '@gusto/embedded-api/models/components/contractorpaymentreceipt'\nimport { getContractorDisplayName } from '../CreatePayment/helpers'\nimport styles from './PaymentStatementPresentation.module.scss'\nimport { DataView, Flex } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { formatHoursDisplay } from '@/components/Payroll/helpers'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport { addressInline, formatPhoneNumber } from '@/helpers/formattedStrings'\nimport ReceiptCheck from '@/assets/icons/receipt-check.svg?react'\n\ninterface PaymentStatementPresentationProps {\n  payment: ContractorPaymentForGroup\n  contractor: Contractor\n  paymentReceipt?: ContractorPaymentReceipt\n  checkDate: string\n}\n\ntype PaymentStatementRow = {\n  label: string\n  amount: string | null\n}\n\nexport const PaymentStatementPresentation = ({\n  payment,\n  contractor,\n  checkDate,\n  paymentReceipt,\n}: PaymentStatementPresentationProps) => {\n  const { Text, Heading } = useComponentContext()\n  useI18n('Contractor.Payments.PaymentStatement')\n  const { t } = useTranslation('Contractor.Payments.PaymentStatement')\n  const currencyFormatter = useNumberFormatter('currency')\n  const { formatLongWithYear } = useDateFormatter()\n  const { Link } = useComponentContext()\n\n  const contractorName = getContractorDisplayName(contractor)\n  const isHourly = payment.wageType === 'Hourly'\n  const hours = Number(payment.hours || 0)\n  const hourlyRate = Number(payment.hourlyRate || 0)\n  const bonus = Number(payment.bonus || 0)\n  const reimbursement = Number(payment.reimbursement || 0)\n  const wageTotal = Number(payment.wageTotal || 0)\n\n  const shouldShowReceipt = Boolean(\n    paymentReceipt && payment.status === 'Funded' && payment.paymentMethod === 'Direct Deposit',\n  )\n\n  const receiptTotal = paymentReceipt?.totals?.companyDebit || '0'\n\n  const receiptDetailsConfig = useMemo(() => {\n    if (!paymentReceipt) return []\n\n    return [\n      {\n        label: t('receipt.from'),\n        value: paymentReceipt.nameOfSender || '',\n      },\n      {\n        label: t('receipt.to'),\n        value: getContractorDisplayName(contractor),\n      },\n      {\n        label: t('receipt.debitDate'),\n        value: paymentReceipt.debitDate ? formatLongWithYear(String(paymentReceipt.debitDate)) : '',\n      },\n    ]\n  }, [paymentReceipt, contractor, t, formatLongWithYear])\n\n  const statementRows = useMemo<PaymentStatementRow[]>(() => {\n    const rows: PaymentStatementRow[] = [\n      {\n        label: payment.paymentMethod || '',\n        amount: currencyFormatter(wageTotal),\n      },\n    ]\n\n    if (isHourly && hours > 0) {\n      rows.push({\n        label: t('hoursLabel'),\n        amount: t('hoursAmount', {\n          hours: formatHoursDisplay(hours),\n          rate: currencyFormatter(hourlyRate),\n        }),\n      })\n    } else {\n      rows.push({\n        label: t('wageLabel'),\n        amount: currencyFormatter(Number(payment.wage || 0)),\n      })\n    }\n\n    rows.push({\n      label: t('bonus'),\n      amount: currencyFormatter(bonus),\n    })\n\n    rows.push({\n      label: t('reimbursement'),\n      amount: currencyFormatter(reimbursement),\n    })\n\n    return rows\n  }, [\n    payment.paymentMethod,\n    wageTotal,\n    isHourly,\n    hours,\n    hourlyRate,\n    bonus,\n    reimbursement,\n    t,\n    currencyFormatter,\n    payment.wage,\n  ])\n\n  return (\n    <Flex flexDirection=\"column\" gap={32}>\n      <Flex flexDirection=\"column\" gap={16}>\n        <Flex flexDirection=\"column\" gap={8}>\n          <Heading as=\"h2\">{t('title', { contractorName })}</Heading>\n          <Text>{formatLongWithYear(checkDate)}</Text>\n        </Flex>\n      </Flex>\n\n      {shouldShowReceipt && (\n        <div className={styles.receiptCard}>\n          <Flex flexDirection=\"column\" gap={24}>\n            <Flex flexDirection=\"column\" alignItems=\"center\" gap={16}>\n              <div className={styles.receiptIcon} aria-hidden>\n                <ReceiptCheck className={styles.checkmarkIcon} />\n              </div>\n\n              <Flex flexDirection=\"column\" alignItems=\"center\" gap={8}>\n                <Text size=\"sm\" variant=\"supporting\">\n                  {t('receipt.totalLabel')}\n                </Text>\n                <Heading as=\"h1\" styledAs=\"h2\" className={styles.totalAmount}>\n                  {currencyFormatter(Number(receiptTotal))}\n                </Heading>\n              </Flex>\n            </Flex>\n\n            <div className={styles.receiptDetailsTable}>\n              <DataView\n                label={t('receipt.detailsLabel')}\n                variant=\"minimal\"\n                breakAt=\"small\"\n                breakpoints={{\n                  base: '0rem',\n                  small: '22rem',\n                }}\n                columns={[\n                  {\n                    title: '',\n                    render: (item: { label: string; value: string }) => (\n                      <Text size=\"sm\" variant=\"supporting\">\n                        {item.label}\n                      </Text>\n                    ),\n                  },\n                  {\n                    title: '',\n                    render: (item: { label: string; value: string }) => (\n                      <Text size=\"sm\">{item.value}</Text>\n                    ),\n                  },\n                ]}\n                data={receiptDetailsConfig}\n              />\n            </div>\n            <hr />\n            <Flex flexDirection=\"column\" alignItems=\"center\" gap={12}>\n              <Text size=\"sm\" variant=\"supporting\" className={styles.disclaimer}>\n                <Trans\n                  i18nKey=\"receipt.disclaimer\"\n                  t={t}\n                  components={{\n                    licensesLink: <Link href={paymentReceipt?.licenseUri || ''} target=\"_blank\" />,\n                  }}\n                />\n              </Text>\n              <hr />\n\n              <Text size=\"sm\" variant=\"supporting\" className={styles.companyInfo}>\n                {paymentReceipt?.licensee?.name || ''}\n              </Text>\n              <Text size=\"sm\" variant=\"supporting\" className={styles.address}>\n                {addressInline({\n                  street1: paymentReceipt?.licensee?.address || '',\n                  city: paymentReceipt?.licensee?.city || '',\n                  state: paymentReceipt?.licensee?.state || '',\n                  zip: paymentReceipt?.licensee?.postalCode || '',\n                  country: '',\n                  uuid: '',\n                })}\n                {' | '}\n                {formatPhoneNumber(paymentReceipt?.licensee?.phoneNumber)}\n              </Text>\n            </Flex>\n          </Flex>\n        </div>\n      )}\n\n      <DataView\n        columns={[\n          {\n            title: t('debitedColumn'),\n            render: ({ label }) => <Text>{label}</Text>,\n          },\n          {\n            title: t('amountColumn'),\n            render: ({ amount }) => <Text>{amount || ''}</Text>,\n          },\n        ]}\n        data={statementRows}\n        label={t('title', { contractorName })}\n      />\n    </Flex>\n  )\n}\n"],"names":["PaymentStatementPresentation","payment","contractor","checkDate","paymentReceipt","Text","Heading","useComponentContext","useI18n","t","useTranslation","currencyFormatter","useNumberFormatter","formatLongWithYear","useDateFormatter","Link","contractorName","getContractorDisplayName","isHourly","hours","hourlyRate","bonus","reimbursement","wageTotal","shouldShowReceipt","receiptTotal","receiptDetailsConfig","useMemo","statementRows","rows","formatHoursDisplay","jsxs","Flex","jsx","styles","ReceiptCheck","DataView","item","Trans","addressInline","formatPhoneNumber","label","amount"],"mappings":"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"}

package/dist/components/Contractor/Payments/PaymentSummary/PaymentSummaryPresentation.js

@@ -3,13 +3,15 @@ import { useTranslation as N } from "react-i18next";
 import { useMemo as T } from "react";
 import { getContractorDisplayName as C } from "../CreatePayment/helpers.js";
 import { Flex as s } from "../../../Common/Flex/Flex.js";
+import "classnames";
+import "../../../../shared/constants.js";
 import { useComponentContext as x } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
 import { useI18n as M } from "../../../../i18n/I18n.js";
 import { formatHoursDisplay as S } from "../../../Payroll/helpers.js";
 import v from "../../../../hooks/useNumberFormatter.js";
 import { ConfirmWireDetails as H } from "../../../Payroll/ConfirmWireDetails/ConfirmWireDetails.js";
 import { DataView as h } from "../../../Common/DataView/DataView.js";
-const k = "0.000", U = ({
+const k = "0.000", Y = ({
   contractorPaymentGroup: o,
   contractors: b,
   bankAccount: c,
@@ -120,6 +122,6 @@ const k = "0.000", U = ({
   ] });
 };
 export {
-  U as PaymentSummaryPresentation
+  Y as PaymentSummaryPresentation
 };
 //# sourceMappingURL=PaymentSummaryPresentation.js.map

package/dist/components/Contractor/Payments/PaymentSummary/PaymentSummaryPresentation.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentSummaryPresentation.js","sources":["../../../../../src/components/Contractor/Payments/PaymentSummary/PaymentSummaryPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { ContractorPaymentGroup } from '@gusto/embedded-api/models/components/contractorpaymentgroup'\nimport type { ContractorPaymentForGroup } from '@gusto/embedded-api/models/components/contractorpaymentforgroup'\nimport { useMemo } from 'react'\nimport type { Contractor } from '@gusto/embedded-api/models/components/contractor'\nimport type { CompanyBankAccount } from '@gusto/embedded-api/models/components/companybankaccount'\nimport { getContractorDisplayName } from '../CreatePayment/helpers'\nimport { DataView, Flex } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { formatHoursDisplay } from '@/components/Payroll/helpers'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { ConfirmWireDetails } from '@/components/Payroll/ConfirmWireDetails'\nimport type { EventType } from '@/shared/constants'\n\nconst ZERO_HOURS_DISPLAY = '0.000'\n\ninterface PaymentSummaryPresentationProps {\n  contractorPaymentGroup: ContractorPaymentGroup\n  contractors: Contractor[]\n  bankAccount?: CompanyBankAccount\n  companyId: string\n  wireInRequestUuid?: string\n  onEvent: (type: EventType, data?: unknown) => void\n  onDone: () => void\n}\n\nexport const PaymentSummaryPresentation = ({\n  contractorPaymentGroup,\n  contractors,\n  bankAccount,\n  companyId,\n  wireInRequestUuid,\n  onEvent,\n  onDone,\n}: PaymentSummaryPresentationProps) => {\n  const { Button, Text, Heading, Alert } = useComponentContext()\n  useI18n('Contractor.Payments.PaymentSummary')\n  const { t } = useTranslation('Contractor.Payments.PaymentSummary')\n  const currencyFormatter = useNumberFormatter()\n\n  const formatWageType = (contractor: ContractorPaymentForGroup) => {\n    if (contractor.wageType === 'Hourly' && contractor.hourlyRate) {\n      return `Hourly ${currencyFormatter(Number(contractor.hourlyRate))}/hr`\n    }\n    return contractor.wageType\n  }\n\n  const contractorPayments = contractorPaymentGroup.contractorPayments || []\n\n  const totals = useMemo(() => {\n    if (contractorPayments.length === 0) {\n      return { wageAmount: 0, bonusAmount: 0, reimbursementAmount: 0, totalAmount: 0 }\n    }\n    return contractorPayments.reduce(\n      (acc, contractor) => {\n        acc.wageAmount += Number(contractor.wage || '0')\n        acc.bonusAmount += Number(contractor.bonus || '0')\n        acc.reimbursementAmount += Number(contractor.reimbursement || '0')\n        acc.totalAmount += Number(contractor.wageTotal || '0')\n        return acc\n      },\n      { wageAmount: 0, bonusAmount: 0, reimbursementAmount: 0, totalAmount: 0 },\n    )\n  }, [contractorPayments])\n\n  return (\n    <Flex flexDirection=\"column\" gap={32}>\n      <Alert status=\"success\" label={t('successTitle')}>\n        <Text>\n          {t('successMessage', {\n            count: contractorPayments.length,\n          })}\n        </Text>\n      </Alert>\n\n      {wireInRequestUuid && (\n        <ConfirmWireDetails companyId={companyId} wireInId={wireInRequestUuid} onEvent={onEvent} />\n      )}\n\n      <Flex justifyContent=\"space-between\" alignItems=\"flex-start\">\n        <Flex flexDirection=\"column\" gap={2}>\n          <Heading as=\"h2\">{t('summaryTitle')}</Heading>\n          <Text variant=\"supporting\">\n            {t('summarySubtitle', { debitDate: contractorPaymentGroup.debitDate })}\n          </Text>\n        </Flex>\n        <Button onClick={onDone} variant=\"primary\">\n          {t('doneCta')}\n        </Button>\n      </Flex>\n\n      {/* Payment Summary Table */}\n      <DataView\n        columns={[\n          {\n            title: t('totalAmount'),\n            render: () => (\n              <Text>{currencyFormatter(Number(contractorPaymentGroup.totals?.amount || '0'))}</Text>\n            ),\n          },\n          {\n            title: t('debitAmount'),\n            render: () => (\n              <Text>\n                {currencyFormatter(Number(contractorPaymentGroup.totals?.debitAmount || '0'))}\n              </Text>\n            ),\n          },\n          {\n            title: t('debitAccount'),\n            render: () => <Text>{bankAccount?.hiddenAccountNumber ?? t('notAvailable')}</Text>,\n          },\n          {\n            title: t('debitDate'),\n            render: () => <Text>{contractorPaymentGroup.debitDate || t('notAvailable')}</Text>,\n          },\n          {\n            title: t('contractorPayDate'),\n            render: () => <Text>{contractorPaymentGroup.checkDate || t('notAvailable')}</Text>,\n          },\n        ]}\n        data={[contractorPaymentGroup]}\n        label={t('paymentSummaryTitle')}\n      />\n\n      {/* Contractor Payments Table */}\n      {contractorPayments.length > 0 && (\n        <DataView\n          columns={[\n            {\n              title: t('contractor'),\n              render: contractorPayment => (\n                <Text>\n                  {getContractorDisplayName(\n                    contractors.find(\n                      contractor => contractor.uuid === contractorPayment.contractorUuid,\n                    ),\n                  )}\n                </Text>\n              ),\n            },\n            {\n              title: t('wageType'),\n              render: contractorPayment => <Text>{formatWageType(contractorPayment)}</Text>,\n            },\n            {\n              title: t('paymentMethod'),\n              render: contractorPayment => (\n                <Text>\n                  {contractorPayment.paymentMethod === 'Direct Deposit'\n                    ? t('paymentMethods.directDeposit')\n                    : contractorPayment.paymentMethod === 'Check'\n                      ? t('paymentMethods.check')\n                      : contractorPayment.paymentMethod || t('notAvailable')}\n                </Text>\n              ),\n            },\n            {\n              title: t('hours'),\n              render: contractorPayment => (\n                <Text>\n                  {contractorPayment.wageType === 'Hourly' && contractorPayment.hours\n                    ? formatHoursDisplay(parseFloat(contractorPayment.hours))\n                    : ZERO_HOURS_DISPLAY}\n                </Text>\n              ),\n            },\n            {\n              title: t('wage'),\n              render: contractorPayment => (\n                <Text>{currencyFormatter(Number(contractorPayment.wage || '0'))}</Text>\n              ),\n            },\n            {\n              title: t('bonus'),\n              render: contractorPayment => (\n                <Text>{currencyFormatter(Number(contractorPayment.bonus || '0'))}</Text>\n              ),\n            },\n            {\n              title: t('reimbursement'),\n              render: contractorPayment => (\n                <Text>{currencyFormatter(Number(contractorPayment.reimbursement || '0'))}</Text>\n              ),\n            },\n            {\n              title: t('total'),\n              render: contractorPayment => (\n                <Text>{currencyFormatter(Number(contractorPayment.wageTotal || '0'))}</Text>\n              ),\n            },\n          ]}\n          data={contractorPayments}\n          footer={() => ({\n            'column-0': <Text weight=\"bold\">{t('totalsLabel')}</Text>,\n            'column-4': <Text>{currencyFormatter(totals.wageAmount || 0)}</Text>,\n            'column-5': <Text>{currencyFormatter(totals.bonusAmount || 0)}</Text>,\n            'column-6': <Text>{currencyFormatter(totals.reimbursementAmount || 0)}</Text>,\n            'column-7': <Text>{currencyFormatter(totals.totalAmount || 0)}</Text>,\n          })}\n          label={t('contractorPaymentsTitle')}\n        />\n      )}\n    </Flex>\n  )\n}\n"],"names":["ZERO_HOURS_DISPLAY","PaymentSummaryPresentation","contractorPaymentGroup","contractors","bankAccount","companyId","wireInRequestUuid","onEvent","onDone","Button","Text","Heading","Alert","useComponentContext","useI18n","useTranslation","currencyFormatter","useNumberFormatter","formatWageType","contractor","contractorPayments","totals","useMemo","acc","jsxs","Flex","jsx","ConfirmWireDetails","DataView","contractorPayment","getContractorDisplayName","formatHoursDisplay"],"mappings":"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"}
+{"version":3,"file":"PaymentSummaryPresentation.js","sources":["../../../../../src/components/Contractor/Payments/PaymentSummary/PaymentSummaryPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { ContractorPaymentGroup } from '@gusto/embedded-api/models/components/contractorpaymentgroup'\nimport type { ContractorPaymentForGroup } from '@gusto/embedded-api/models/components/contractorpaymentforgroup'\nimport { useMemo } from 'react'\nimport type { Contractor } from '@gusto/embedded-api/models/components/contractor'\nimport type { CompanyBankAccount } from '@gusto/embedded-api/models/components/companybankaccount'\nimport { getContractorDisplayName } from '../CreatePayment/helpers'\nimport { DataView, Flex } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport { formatHoursDisplay } from '@/components/Payroll/helpers'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { ConfirmWireDetails } from '@/components/Payroll/ConfirmWireDetails'\nimport type { EventType } from '@/shared/constants'\n\nconst ZERO_HOURS_DISPLAY = '0.000'\n\ninterface PaymentSummaryPresentationProps {\n  contractorPaymentGroup: ContractorPaymentGroup\n  contractors: Contractor[]\n  bankAccount?: CompanyBankAccount\n  companyId: string\n  wireInRequestUuid?: string\n  onEvent: (type: EventType, data?: unknown) => void\n  onDone: () => void\n}\n\nexport const PaymentSummaryPresentation = ({\n  contractorPaymentGroup,\n  contractors,\n  bankAccount,\n  companyId,\n  wireInRequestUuid,\n  onEvent,\n  onDone,\n}: PaymentSummaryPresentationProps) => {\n  const { Button, Text, Heading, Alert } = useComponentContext()\n  useI18n('Contractor.Payments.PaymentSummary')\n  const { t } = useTranslation('Contractor.Payments.PaymentSummary')\n  const currencyFormatter = useNumberFormatter()\n\n  const formatWageType = (contractor: ContractorPaymentForGroup) => {\n    if (contractor.wageType === 'Hourly' && contractor.hourlyRate) {\n      return `Hourly ${currencyFormatter(Number(contractor.hourlyRate))}/hr`\n    }\n    return contractor.wageType\n  }\n\n  const contractorPayments = contractorPaymentGroup.contractorPayments || []\n\n  const totals = useMemo(() => {\n    if (contractorPayments.length === 0) {\n      return { wageAmount: 0, bonusAmount: 0, reimbursementAmount: 0, totalAmount: 0 }\n    }\n    return contractorPayments.reduce(\n      (acc, contractor) => {\n        acc.wageAmount += Number(contractor.wage || '0')\n        acc.bonusAmount += Number(contractor.bonus || '0')\n        acc.reimbursementAmount += Number(contractor.reimbursement || '0')\n        acc.totalAmount += Number(contractor.wageTotal || '0')\n        return acc\n      },\n      { wageAmount: 0, bonusAmount: 0, reimbursementAmount: 0, totalAmount: 0 },\n    )\n  }, [contractorPayments])\n\n  return (\n    <Flex flexDirection=\"column\" gap={32}>\n      <Alert status=\"success\" label={t('successTitle')}>\n        <Text>\n          {t('successMessage', {\n            count: contractorPayments.length,\n          })}\n        </Text>\n      </Alert>\n\n      {wireInRequestUuid && (\n        <ConfirmWireDetails companyId={companyId} wireInId={wireInRequestUuid} onEvent={onEvent} />\n      )}\n\n      <Flex justifyContent=\"space-between\" alignItems=\"flex-start\">\n        <Flex flexDirection=\"column\" gap={2}>\n          <Heading as=\"h2\">{t('summaryTitle')}</Heading>\n          <Text variant=\"supporting\">\n            {t('summarySubtitle', { debitDate: contractorPaymentGroup.debitDate })}\n          </Text>\n        </Flex>\n        <Button onClick={onDone} variant=\"primary\">\n          {t('doneCta')}\n        </Button>\n      </Flex>\n\n      {/* Payment Summary Table */}\n      <DataView\n        columns={[\n          {\n            title: t('totalAmount'),\n            render: () => (\n              <Text>{currencyFormatter(Number(contractorPaymentGroup.totals?.amount || '0'))}</Text>\n            ),\n          },\n          {\n            title: t('debitAmount'),\n            render: () => (\n              <Text>\n                {currencyFormatter(Number(contractorPaymentGroup.totals?.debitAmount || '0'))}\n              </Text>\n            ),\n          },\n          {\n            title: t('debitAccount'),\n            render: () => <Text>{bankAccount?.hiddenAccountNumber ?? t('notAvailable')}</Text>,\n          },\n          {\n            title: t('debitDate'),\n            render: () => <Text>{contractorPaymentGroup.debitDate || t('notAvailable')}</Text>,\n          },\n          {\n            title: t('contractorPayDate'),\n            render: () => <Text>{contractorPaymentGroup.checkDate || t('notAvailable')}</Text>,\n          },\n        ]}\n        data={[contractorPaymentGroup]}\n        label={t('paymentSummaryTitle')}\n      />\n\n      {/* Contractor Payments Table */}\n      {contractorPayments.length > 0 && (\n        <DataView\n          columns={[\n            {\n              title: t('contractor'),\n              render: contractorPayment => (\n                <Text>\n                  {getContractorDisplayName(\n                    contractors.find(\n                      contractor => contractor.uuid === contractorPayment.contractorUuid,\n                    ),\n                  )}\n                </Text>\n              ),\n            },\n            {\n              title: t('wageType'),\n              render: contractorPayment => <Text>{formatWageType(contractorPayment)}</Text>,\n            },\n            {\n              title: t('paymentMethod'),\n              render: contractorPayment => (\n                <Text>\n                  {contractorPayment.paymentMethod === 'Direct Deposit'\n                    ? t('paymentMethods.directDeposit')\n                    : contractorPayment.paymentMethod === 'Check'\n                      ? t('paymentMethods.check')\n                      : contractorPayment.paymentMethod || t('notAvailable')}\n                </Text>\n              ),\n            },\n            {\n              title: t('hours'),\n              render: contractorPayment => (\n                <Text>\n                  {contractorPayment.wageType === 'Hourly' && contractorPayment.hours\n                    ? formatHoursDisplay(parseFloat(contractorPayment.hours))\n                    : ZERO_HOURS_DISPLAY}\n                </Text>\n              ),\n            },\n            {\n              title: t('wage'),\n              render: contractorPayment => (\n                <Text>{currencyFormatter(Number(contractorPayment.wage || '0'))}</Text>\n              ),\n            },\n            {\n              title: t('bonus'),\n              render: contractorPayment => (\n                <Text>{currencyFormatter(Number(contractorPayment.bonus || '0'))}</Text>\n              ),\n            },\n            {\n              title: t('reimbursement'),\n              render: contractorPayment => (\n                <Text>{currencyFormatter(Number(contractorPayment.reimbursement || '0'))}</Text>\n              ),\n            },\n            {\n              title: t('total'),\n              render: contractorPayment => (\n                <Text>{currencyFormatter(Number(contractorPayment.wageTotal || '0'))}</Text>\n              ),\n            },\n          ]}\n          data={contractorPayments}\n          footer={() => ({\n            'column-0': <Text weight=\"bold\">{t('totalsLabel')}</Text>,\n            'column-4': <Text>{currencyFormatter(totals.wageAmount || 0)}</Text>,\n            'column-5': <Text>{currencyFormatter(totals.bonusAmount || 0)}</Text>,\n            'column-6': <Text>{currencyFormatter(totals.reimbursementAmount || 0)}</Text>,\n            'column-7': <Text>{currencyFormatter(totals.totalAmount || 0)}</Text>,\n          })}\n          label={t('contractorPaymentsTitle')}\n        />\n      )}\n    </Flex>\n  )\n}\n"],"names":["ZERO_HOURS_DISPLAY","PaymentSummaryPresentation","contractorPaymentGroup","contractors","bankAccount","companyId","wireInRequestUuid","onEvent","onDone","Button","Text","Heading","Alert","useComponentContext","useI18n","useTranslation","currencyFormatter","useNumberFormatter","formatWageType","contractor","contractorPayments","totals","useMemo","acc","jsxs","Flex","jsx","ConfirmWireDetails","DataView","contractorPayment","getContractorDisplayName","formatHoursDisplay"],"mappings":"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"}