@gusto/embedded-react-sdk 0.24.1 → 0.26.0

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

@@ -0,0 +1,45 @@
+import { jsx as d } from "react/jsx-runtime";
+import { useContractorPaymentGroupsGetSuspense as p } from "@gusto/embedded-api/react-query/contractorPaymentGroupsGet";
+import { useContractorsListSuspense as f } from "@gusto/embedded-api/react-query/contractorsList";
+import { useBankAccountsGet as l } from "@gusto/embedded-api/react-query/bankAccountsGet";
+import { PaymentSummaryPresentation as y } from "./PaymentSummaryPresentation.js";
+import { useI18n as k } from "../../../../i18n/I18n.js";
+import { componentEvents as P } from "../../../../shared/constants.js";
+const b = (r = []) => {
+  const t = r.find((n) => n.status === "unresolved");
+  if (!t?.unblockOptions)
+    return;
+  const o = t.unblockOptions.find(
+    (n) => n.unblockType === "submit_wire"
+  );
+  if (o && "metadata" in o)
+    return o.metadata.wireInRequestUuid;
+}, T = ({ paymentGroupId: r, companyId: t, onEvent: o }) => {
+  k("Contractor.Payments.PaymentSummary");
+  const { data: n } = p({
+    contractorPaymentGroupUuid: r
+  }), e = n.contractorPaymentGroup, { data: a } = f({ companyUuid: t }), c = (a.contractorList || []).filter(
+    (s) => s.isActive && s.onboardingStatus === "onboarding_completed"
+  ), { data: i } = l({ companyId: t }), u = i?.companyBankAccounts?.[0];
+  if (!e)
+    return null;
+  const m = b(e.creditBlockers || []);
+  return /* @__PURE__ */ d(
+    y,
+    {
+      contractorPaymentGroup: e,
+      contractors: c,
+      bankAccount: u,
+      wireInRequestUuid: m,
+      onDone: () => {
+        o(P.CONTRACTOR_PAYMENT_EXIT);
+      },
+      onEvent: o,
+      companyId: t
+    }
+  );
+};
+export {
+  T as PaymentSummary
+};
+//# sourceMappingURL=PaymentSummary.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentSummary.js","sources":["../../../../../src/components/Contractor/Payments/PaymentSummary/PaymentSummary.tsx"],"sourcesContent":["import { useContractorPaymentGroupsGetSuspense } from '@gusto/embedded-api/react-query/contractorPaymentGroupsGet'\nimport { useContractorsListSuspense } from '@gusto/embedded-api/react-query/contractorsList'\nimport { useBankAccountsGet } from '@gusto/embedded-api/react-query/bankAccountsGet'\nimport type { PayrollCreditBlockerType } from '@gusto/embedded-api/models/components/payrollcreditblockertype'\nimport { PaymentSummaryPresentation } from './PaymentSummaryPresentation'\nimport { useI18n } from '@/i18n'\nimport { componentEvents, type EventType } from '@/shared/constants'\n\ninterface PaymentSummaryProps {\n  paymentGroupId: string\n  companyId: string\n  onEvent: (type: EventType, data?: unknown) => void\n}\n\nconst findWireInRequestUuid = (\n  creditBlockers: PayrollCreditBlockerType[] = [],\n): string | undefined => {\n  const unresolvedCreditBlocker = creditBlockers.find(blocker => blocker.status === 'unresolved')\n\n  if (!unresolvedCreditBlocker?.unblockOptions) {\n    return undefined\n  }\n\n  const wireUnblockOption = unresolvedCreditBlocker.unblockOptions.find(\n    option => option.unblockType === 'submit_wire',\n  )\n\n  if (wireUnblockOption && 'metadata' in wireUnblockOption) {\n    return wireUnblockOption.metadata.wireInRequestUuid\n  }\n\n  return undefined\n}\n\nexport const PaymentSummary = ({ paymentGroupId, companyId, onEvent }: PaymentSummaryProps) => {\n  useI18n('Contractor.Payments.PaymentSummary')\n\n  // Fetch payment group details\n  const { data: paymentGroupData } = useContractorPaymentGroupsGetSuspense({\n    contractorPaymentGroupUuid: paymentGroupId,\n  })\n  const contractorPaymentGroup = paymentGroupData.contractorPaymentGroup\n\n  // Fetch contractors and bank account\n  const { data: contractorList } = useContractorsListSuspense({ companyUuid: companyId })\n  const contractors = (contractorList.contractorList || []).filter(\n    contractor => contractor.isActive && contractor.onboardingStatus === 'onboarding_completed',\n  )\n\n  const { data: bankAccounts } = useBankAccountsGet({ companyId })\n  const bankAccount = bankAccounts?.companyBankAccounts?.[0]\n\n  if (!contractorPaymentGroup) {\n    return null\n  }\n\n  const wireInRequestUuid = findWireInRequestUuid(contractorPaymentGroup.creditBlockers || [])\n\n  const handleDone = () => {\n    onEvent(componentEvents.CONTRACTOR_PAYMENT_EXIT)\n  }\n\n  return (\n    <PaymentSummaryPresentation\n      contractorPaymentGroup={contractorPaymentGroup}\n      contractors={contractors}\n      bankAccount={bankAccount}\n      wireInRequestUuid={wireInRequestUuid}\n      onDone={handleDone}\n      onEvent={onEvent}\n      companyId={companyId}\n    />\n  )\n}\n"],"names":["findWireInRequestUuid","creditBlockers","unresolvedCreditBlocker","blocker","wireUnblockOption","option","PaymentSummary","paymentGroupId","companyId","onEvent","useI18n","paymentGroupData","useContractorPaymentGroupsGetSuspense","contractorPaymentGroup","contractorList","useContractorsListSuspense","contractors","contractor","bankAccounts","useBankAccountsGet","bankAccount","wireInRequestUuid","jsx","PaymentSummaryPresentation","componentEvents"],"mappings":";;;;;;;AAcA,MAAMA,IAAwB,CAC5BC,IAA6C,OACtB;AACvB,QAAMC,IAA0BD,EAAe,KAAK,CAAAE,MAAWA,EAAQ,WAAW,YAAY;AAE9F,MAAI,CAACD,GAAyB;AAC5B;AAGF,QAAME,IAAoBF,EAAwB,eAAe;AAAA,IAC/D,CAAAG,MAAUA,EAAO,gBAAgB;AAAA,EAAA;AAGnC,MAAID,KAAqB,cAAcA;AACrC,WAAOA,EAAkB,SAAS;AAItC,GAEaE,IAAiB,CAAC,EAAE,gBAAAC,GAAgB,WAAAC,GAAW,SAAAC,QAAmC;AAC7F,EAAAC,EAAQ,oCAAoC;AAG5C,QAAM,EAAE,MAAMC,EAAA,IAAqBC,EAAsC;AAAA,IACvE,4BAA4BL;AAAA,EAAA,CAC7B,GACKM,IAAyBF,EAAiB,wBAG1C,EAAE,MAAMG,EAAA,IAAmBC,EAA2B,EAAE,aAAaP,GAAW,GAChFQ,KAAeF,EAAe,kBAAkB,CAAA,GAAI;AAAA,IACxD,CAAAG,MAAcA,EAAW,YAAYA,EAAW,qBAAqB;AAAA,EAAA,GAGjE,EAAE,MAAMC,EAAA,IAAiBC,EAAmB,EAAE,WAAAX,GAAW,GACzDY,IAAcF,GAAc,sBAAsB,CAAC;AAEzD,MAAI,CAACL;AACH,WAAO;AAGT,QAAMQ,IAAoBrB,EAAsBa,EAAuB,kBAAkB,CAAA,CAAE;AAM3F,SACE,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,wBAAAV;AAAA,MACA,aAAAG;AAAA,MACA,aAAAI;AAAA,MACA,mBAAAC;AAAA,MACA,QAVe,MAAM;AACvB,QAAAZ,EAAQe,EAAgB,uBAAuB;AAAA,MACjD;AAAA,MASI,SAAAf;AAAA,MACA,WAAAD;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Contractor/Payments/PaymentSummary/PaymentSummaryPresentation.d.ts

@@ -0,0 +1,15 @@
+import { ContractorPaymentGroup } from '@gusto/embedded-api/models/components/contractorpaymentgroup';
+import { Contractor } from '@gusto/embedded-api/models/components/contractor';
+import { CompanyBankAccount } from '@gusto/embedded-api/models/components/companybankaccount';
+import { EventType } from '../../../../shared/constants';
+interface PaymentSummaryPresentationProps {
+    contractorPaymentGroup: ContractorPaymentGroup;
+    contractors: Contractor[];
+    bankAccount?: CompanyBankAccount;
+    companyId: string;
+    wireInRequestUuid?: string;
+    onEvent: (type: EventType, data?: unknown) => void;
+    onDone: () => void;
+}
+export declare const PaymentSummaryPresentation: ({ contractorPaymentGroup, contractors, bankAccount, companyId, wireInRequestUuid, onEvent, onDone, }: PaymentSummaryPresentationProps) => import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1,125 @@
+import { jsxs as a, jsx as r } from "react/jsx-runtime";
+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 { 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 = ({
+  contractorPaymentGroup: o,
+  contractors: b,
+  bankAccount: c,
+  companyId: p,
+  wireInRequestUuid: d,
+  onEvent: y,
+  onDone: A
+}) => {
+  const { Button: g, Text: n, Heading: f, Alert: w } = x();
+  M("Contractor.Payments.PaymentSummary");
+  const { t } = N("Contractor.Payments.PaymentSummary"), m = v(), D = (e) => e.wageType === "Hourly" && e.hourlyRate ? `Hourly ${m(Number(e.hourlyRate))}/hr` : e.wageType, i = o.contractorPayments || [], u = T(() => i.length === 0 ? { wageAmount: 0, bonusAmount: 0, reimbursementAmount: 0, totalAmount: 0 } : i.reduce(
+    (e, l) => (e.wageAmount += Number(l.wage || "0"), e.bonusAmount += Number(l.bonus || "0"), e.reimbursementAmount += Number(l.reimbursement || "0"), e.totalAmount += Number(l.wageTotal || "0"), e),
+    { wageAmount: 0, bonusAmount: 0, reimbursementAmount: 0, totalAmount: 0 }
+  ), [i]);
+  return /* @__PURE__ */ a(s, { flexDirection: "column", gap: 32, children: [
+    /* @__PURE__ */ r(w, { status: "success", label: t("successTitle"), children: /* @__PURE__ */ r(n, { children: t("successMessage", {
+      count: i.length
+    }) }) }),
+    d && /* @__PURE__ */ r(H, { companyId: p, wireInId: d, onEvent: y }),
+    /* @__PURE__ */ a(s, { justifyContent: "space-between", alignItems: "flex-start", children: [
+      /* @__PURE__ */ a(s, { flexDirection: "column", gap: 2, children: [
+        /* @__PURE__ */ r(f, { as: "h2", children: t("summaryTitle") }),
+        /* @__PURE__ */ r(n, { variant: "supporting", children: t("summarySubtitle", { debitDate: o.debitDate }) })
+      ] }),
+      /* @__PURE__ */ r(g, { onClick: A, variant: "primary", children: t("doneCta") })
+    ] }),
+    /* @__PURE__ */ r(
+      h,
+      {
+        columns: [
+          {
+            title: t("totalAmount"),
+            render: () => /* @__PURE__ */ r(n, { children: m(Number(o.totals?.amount || "0")) })
+          },
+          {
+            title: t("debitAmount"),
+            render: () => /* @__PURE__ */ r(n, { children: m(Number(o.totals?.debitAmount || "0")) })
+          },
+          {
+            title: t("debitAccount"),
+            render: () => /* @__PURE__ */ r(n, { children: c?.hiddenAccountNumber ?? t("notAvailable") })
+          },
+          {
+            title: t("debitDate"),
+            render: () => /* @__PURE__ */ r(n, { children: o.debitDate || t("notAvailable") })
+          },
+          {
+            title: t("contractorPayDate"),
+            render: () => /* @__PURE__ */ r(n, { children: o.checkDate || t("notAvailable") })
+          }
+        ],
+        data: [o],
+        label: t("paymentSummaryTitle")
+      }
+    ),
+    i.length > 0 && /* @__PURE__ */ r(
+      h,
+      {
+        columns: [
+          {
+            title: t("contractor"),
+            render: (e) => /* @__PURE__ */ r(n, { children: C(
+              b.find(
+                (l) => l.uuid === e.contractorUuid
+              )
+            ) })
+          },
+          {
+            title: t("wageType"),
+            render: (e) => /* @__PURE__ */ r(n, { children: D(e) })
+          },
+          {
+            title: t("paymentMethod"),
+            render: (e) => /* @__PURE__ */ r(n, { children: e.paymentMethod === "Direct Deposit" ? t("paymentMethods.directDeposit") : e.paymentMethod === "Check" ? t("paymentMethods.check") : e.paymentMethod || t("notAvailable") })
+          },
+          {
+            title: t("hours"),
+            render: (e) => /* @__PURE__ */ r(n, { children: e.wageType === "Hourly" && e.hours ? S(parseFloat(e.hours)) : k })
+          },
+          {
+            title: t("wage"),
+            render: (e) => /* @__PURE__ */ r(n, { children: m(Number(e.wage || "0")) })
+          },
+          {
+            title: t("bonus"),
+            render: (e) => /* @__PURE__ */ r(n, { children: m(Number(e.bonus || "0")) })
+          },
+          {
+            title: t("reimbursement"),
+            render: (e) => /* @__PURE__ */ r(n, { children: m(Number(e.reimbursement || "0")) })
+          },
+          {
+            title: t("total"),
+            render: (e) => /* @__PURE__ */ r(n, { children: m(Number(e.wageTotal || "0")) })
+          }
+        ],
+        data: i,
+        footer: () => ({
+          "column-0": /* @__PURE__ */ r(n, { weight: "bold", children: t("totalsLabel") }),
+          "column-4": /* @__PURE__ */ r(n, { children: m(u.wageAmount || 0) }),
+          "column-5": /* @__PURE__ */ r(n, { children: m(u.bonusAmount || 0) }),
+          "column-6": /* @__PURE__ */ r(n, { children: m(u.reimbursementAmount || 0) }),
+          "column-7": /* @__PURE__ */ r(n, { children: m(u.totalAmount || 0) })
+        }),
+        label: t("contractorPaymentsTitle")
+      }
+    )
+  ] });
+};
+export {
+  U as PaymentSummaryPresentation
+};
+//# sourceMappingURL=PaymentSummaryPresentation.js.map

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

@@ -0,0 +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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"}

package/dist/components/Contractor/Payments/PaymentSummary/index.d.ts

@@ -0,0 +1,3 @@
+import "./types/i18next.d.ts"
+export { PaymentSummary } from './PaymentSummary';
+export { PaymentSummaryPresentation } from './PaymentSummaryPresentation';

package/dist/components/Contractor/Payments/PaymentsList/PaymentsList.js

@@ -1,49 +1,58 @@
-import { jsx as r } from "react/jsx-runtime";
-import { useState as C, useMemo as P } from "react";
-import { useContractorPaymentGroupsGetListSuspense as D } from "@gusto/embedded-api/react-query/contractorPaymentGroupsGetList";
-import { PaymentsListPresentation as g } from "./PaymentsListPresentation.js";
-import { useComponentDictionary as y } from "../../../../i18n/I18n.js";
-import { BaseComponent as f } from "../../../Base/Base.js";
+import { jsx as i } from "react/jsx-runtime";
+import { useState as D, useMemo as m } from "react";
+import { useContractorPaymentGroupsGetListSuspense as g } from "@gusto/embedded-api/react-query/contractorPaymentGroupsGetList";
+import { PaymentsListPresentation as y } from "./PaymentsListPresentation.js";
+import { useComponentDictionary as R } from "../../../../i18n/I18n.js";
+import { BaseComponent as O } from "../../../Base/Base.js";
 import "../../../Base/useBase.js";
-import { componentEvents as s } from "../../../../shared/constants.js";
-function G(t) {
-  return /* @__PURE__ */ r(f, { ...t, children: /* @__PURE__ */ r(R, { ...t, children: t.children }) });
+import { componentEvents as u } from "../../../../shared/constants.js";
+function V(t) {
+  return /* @__PURE__ */ i(O, { ...t, children: /* @__PURE__ */ i(M, { ...t, children: t.children }) });
 }
-const l = (t = 3) => {
+const T = (t = 3) => {
   const n = /* @__PURE__ */ new Date(), e = /* @__PURE__ */ new Date();
   return e.setMonth(e.getMonth() - t), n.setMonth(n.getMonth() + (12 - t)), {
     startDate: e.toISOString().split("T")[0] || "",
     endDate: n.toISOString().split("T")[0] || ""
   };
-}, R = ({ companyId: t, dictionary: n, onEvent: e, alerts: m }) => {
-  y("Contractor.Payments.PaymentsList", n);
-  const [o, c] = C(3), { startDate: i, endDate: p } = P(() => l(o), [o]), { data: h } = D({
+}, M = ({ companyId: t, dictionary: n, onEvent: e, alerts: d }) => {
+  R("Contractor.Payments.PaymentsList", n);
+  const [r, l] = D(3), { startDate: p, endDate: h } = m(() => T(r), [r]), { data: C } = g({
     companyId: t,
-    startDate: i,
-    endDate: p,
+    startDate: p,
+    endDate: h,
     page: 1,
     per: 10
-  }), u = h.contractorPaymentGroupWithBlockers || [];
-  return /* @__PURE__ */ r(
-    g,
+  }), a = C.contractorPaymentGroupWithBlockers || [], P = m(() => a.some((o) => (o.creditBlockers || []).some((c) => {
+    if (c.status !== "unresolved") return !1;
+    const s = c.unblockOptions?.find(
+      (f) => f.unblockType === "submit_wire"
+    );
+    return s && "metadata" in s && s.metadata.wireInRequestUuid;
+  })), [a]);
+  return /* @__PURE__ */ i(
+    y,
     {
-      contractorPayments: u,
-      numberOfMonths: o,
+      contractorPayments: a,
+      numberOfMonths: r,
       onCreatePayment: () => {
-        e(s.CONTRACTOR_PAYMENT_CREATE);
+        e(u.CONTRACTOR_PAYMENT_CREATE);
       },
-      onDateRangeChange: (a) => {
-        c(a);
+      onDateRangeChange: (o) => {
+        l(o);
       },
-      onViewPayment: (a) => {
-        e(s.CONTRACTOR_PAYMENT_VIEW, { paymentId: a });
+      onViewPayment: (o) => {
+        e(u.CONTRACTOR_PAYMENT_VIEW, { paymentId: o });
       },
-      alerts: m
+      alerts: d,
+      companyId: t,
+      hasUnresolvedWireInRequests: P,
+      onEvent: e
     }
   );
 };
 export {
-  G as PaymentsList,
-  R as Root
+  V as PaymentsList,
+  M as Root
 };
 //# sourceMappingURL=PaymentsList.js.map

package/dist/components/Contractor/Payments/PaymentsList/PaymentsList.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentsList.js","sources":["../../../../../src/components/Contractor/Payments/PaymentsList/PaymentsList.tsx"],"sourcesContent":["import { useState, useMemo } from 'react'\nimport { useContractorPaymentGroupsGetListSuspense } from '@gusto/embedded-api/react-query/contractorPaymentGroupsGetList'\nimport type { InternalAlert } from '../types'\nimport { PaymentsListPresentation } from './PaymentsListPresentation'\nimport { useComponentDictionary } from '@/i18n'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { componentEvents } from '@/shared/constants'\n\ninterface PaymentsListProps extends BaseComponentInterface<'Contractor.Payments.PaymentsList'> {\n  companyId: string\n  alerts?: InternalAlert[]\n}\n\nexport function PaymentsList(props: PaymentsListProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nconst calculateDateRange = (months: number = 3) => {\n  const endDate = new Date()\n  const startDate = new Date()\n\n  startDate.setMonth(startDate.getMonth() - months)\n  //Max range allowed by the API is 12 months\n  endDate.setMonth(endDate.getMonth() + (12 - months))\n\n  return {\n    startDate: startDate.toISOString().split('T')[0] || '',\n    endDate: endDate.toISOString().split('T')[0] || '',\n  }\n}\n\nexport const Root = ({ companyId, dictionary, onEvent, alerts }: PaymentsListProps) => {\n  useComponentDictionary('Contractor.Payments.PaymentsList', dictionary)\n\n  const [numberOfMonths, setNumberOfMonths] = useState(3)\n\n  const { startDate, endDate } = useMemo(() => calculateDateRange(numberOfMonths), [numberOfMonths])\n  //TODO: add pagination\n  const { data } = useContractorPaymentGroupsGetListSuspense({\n    companyId,\n    startDate,\n    endDate,\n    page: 1,\n    per: 10,\n  })\n  const contractorPayments = data.contractorPaymentGroupWithBlockers || []\n\n  const onCreatePayment = () => {\n    onEvent(componentEvents.CONTRACTOR_PAYMENT_CREATE)\n  }\n\n  const handleDateRangeChange = (numberOfMonths: number) => {\n    setNumberOfMonths(numberOfMonths)\n  }\n\n  const onViewPayment = (paymentId: string) => {\n    onEvent(componentEvents.CONTRACTOR_PAYMENT_VIEW, { paymentId })\n  }\n\n  return (\n    <PaymentsListPresentation\n      contractorPayments={contractorPayments}\n      numberOfMonths={numberOfMonths}\n      onCreatePayment={onCreatePayment}\n      onDateRangeChange={handleDateRangeChange}\n      onViewPayment={onViewPayment}\n      alerts={alerts}\n    />\n  )\n}\n"],"names":["PaymentsList","props","jsx","BaseComponent","Root","calculateDateRange","months","endDate","startDate","companyId","dictionary","onEvent","alerts","useComponentDictionary","numberOfMonths","setNumberOfMonths","useState","useMemo","data","useContractorPaymentGroupsGetListSuspense","contractorPayments","PaymentsListPresentation","componentEvents","paymentId"],"mappings":";;;;;;;;AAaO,SAASA,EAAaC,GAA0B;AACrD,SACE,gBAAAC,EAACC,GAAA,EAAe,GAAGF,GACjB,UAAA,gBAAAC,EAACE,KAAM,GAAGH,GAAQ,UAAAA,EAAM,SAAA,CAAS,EAAA,CACnC;AAEJ;AAEA,MAAMI,IAAqB,CAACC,IAAiB,MAAM;AACjD,QAAMC,wBAAc,KAAA,GACdC,wBAAgB,KAAA;AAEtB,SAAAA,EAAU,SAASA,EAAU,SAAA,IAAaF,CAAM,GAEhDC,EAAQ,SAASA,EAAQ,SAAA,KAAc,KAAKD,EAAO,GAE5C;AAAA,IACL,WAAWE,EAAU,YAAA,EAAc,MAAM,GAAG,EAAE,CAAC,KAAK;AAAA,IACpD,SAASD,EAAQ,YAAA,EAAc,MAAM,GAAG,EAAE,CAAC,KAAK;AAAA,EAAA;AAEpD,GAEaH,IAAO,CAAC,EAAE,WAAAK,GAAW,YAAAC,GAAY,SAAAC,GAAS,QAAAC,QAAgC;AACrF,EAAAC,EAAuB,oCAAoCH,CAAU;AAErE,QAAM,CAACI,GAAgBC,CAAiB,IAAIC,EAAS,CAAC,GAEhD,EAAE,WAAAR,GAAW,SAAAD,EAAA,IAAYU,EAAQ,MAAMZ,EAAmBS,CAAc,GAAG,CAACA,CAAc,CAAC,GAE3F,EAAE,MAAAI,EAAA,IAASC,EAA0C;AAAA,IACzD,WAAAV;AAAA,IACA,WAAAD;AAAA,IACA,SAAAD;AAAA,IACA,MAAM;AAAA,IACN,KAAK;AAAA,EAAA,CACN,GACKa,IAAqBF,EAAK,sCAAsC,CAAA;AActE,SACE,gBAAAhB;AAAA,IAACmB;AAAA,IAAA;AAAA,MACC,oBAAAD;AAAA,MACA,gBAAAN;AAAA,MACA,iBAhBoB,MAAM;AAC5B,QAAAH,EAAQW,EAAgB,yBAAyB;AAAA,MACnD;AAAA,MAeI,mBAb0B,CAACR,MAA2B;AACxD,QAAAC,EAAkBD,CAAc;AAAA,MAClC;AAAA,MAYI,eAVkB,CAACS,MAAsB;AAC3C,QAAAZ,EAAQW,EAAgB,yBAAyB,EAAE,WAAAC,EAAA,CAAW;AAAA,MAChE;AAAA,MASI,QAAAX;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"PaymentsList.js","sources":["../../../../../src/components/Contractor/Payments/PaymentsList/PaymentsList.tsx"],"sourcesContent":["import { useState, useMemo } from 'react'\nimport { useContractorPaymentGroupsGetListSuspense } from '@gusto/embedded-api/react-query/contractorPaymentGroupsGetList'\nimport type { InternalAlert } from '../types'\nimport { PaymentsListPresentation } from './PaymentsListPresentation'\nimport { useComponentDictionary } from '@/i18n'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { componentEvents } from '@/shared/constants'\n\ninterface PaymentsListProps extends BaseComponentInterface<'Contractor.Payments.PaymentsList'> {\n  companyId: string\n  alerts?: InternalAlert[]\n}\n\nexport function PaymentsList(props: PaymentsListProps) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nconst calculateDateRange = (months: number = 3) => {\n  const endDate = new Date()\n  const startDate = new Date()\n\n  startDate.setMonth(startDate.getMonth() - months)\n  //Max range allowed by the API is 12 months\n  endDate.setMonth(endDate.getMonth() + (12 - months))\n\n  return {\n    startDate: startDate.toISOString().split('T')[0] || '',\n    endDate: endDate.toISOString().split('T')[0] || '',\n  }\n}\n\nexport const Root = ({ companyId, dictionary, onEvent, alerts }: PaymentsListProps) => {\n  useComponentDictionary('Contractor.Payments.PaymentsList', dictionary)\n\n  const [numberOfMonths, setNumberOfMonths] = useState(3)\n\n  const { startDate, endDate } = useMemo(() => calculateDateRange(numberOfMonths), [numberOfMonths])\n  //TODO: add pagination\n  const { data } = useContractorPaymentGroupsGetListSuspense({\n    companyId,\n    startDate,\n    endDate,\n    page: 1,\n    per: 10,\n  })\n  const contractorPayments = data.contractorPaymentGroupWithBlockers || []\n\n  const hasUnresolvedWireInRequests = useMemo(() => {\n    return contractorPayments.some(payment => {\n      const creditBlockers = payment.creditBlockers || []\n      return creditBlockers.some(blocker => {\n        if (blocker.status !== 'unresolved') return false\n        const wireOption = blocker.unblockOptions?.find(\n          option => option.unblockType === 'submit_wire',\n        )\n        return wireOption && 'metadata' in wireOption && wireOption.metadata.wireInRequestUuid\n      })\n    })\n  }, [contractorPayments])\n\n  const onCreatePayment = () => {\n    onEvent(componentEvents.CONTRACTOR_PAYMENT_CREATE)\n  }\n\n  const handleDateRangeChange = (numberOfMonths: number) => {\n    setNumberOfMonths(numberOfMonths)\n  }\n\n  const onViewPayment = (paymentId: string) => {\n    onEvent(componentEvents.CONTRACTOR_PAYMENT_VIEW, { paymentId })\n  }\n\n  return (\n    <PaymentsListPresentation\n      contractorPayments={contractorPayments}\n      numberOfMonths={numberOfMonths}\n      onCreatePayment={onCreatePayment}\n      onDateRangeChange={handleDateRangeChange}\n      onViewPayment={onViewPayment}\n      alerts={alerts}\n      companyId={companyId}\n      hasUnresolvedWireInRequests={hasUnresolvedWireInRequests}\n      onEvent={onEvent}\n    />\n  )\n}\n"],"names":["PaymentsList","props","jsx","BaseComponent","Root","calculateDateRange","months","endDate","startDate","companyId","dictionary","onEvent","alerts","useComponentDictionary","numberOfMonths","setNumberOfMonths","useState","useMemo","data","useContractorPaymentGroupsGetListSuspense","contractorPayments","hasUnresolvedWireInRequests","payment","blocker","wireOption","option","PaymentsListPresentation","componentEvents","paymentId"],"mappings":";;;;;;;;AAaO,SAASA,EAAaC,GAA0B;AACrD,SACE,gBAAAC,EAACC,GAAA,EAAe,GAAGF,GACjB,UAAA,gBAAAC,EAACE,KAAM,GAAGH,GAAQ,UAAAA,EAAM,SAAA,CAAS,EAAA,CACnC;AAEJ;AAEA,MAAMI,IAAqB,CAACC,IAAiB,MAAM;AACjD,QAAMC,wBAAc,KAAA,GACdC,wBAAgB,KAAA;AAEtB,SAAAA,EAAU,SAASA,EAAU,SAAA,IAAaF,CAAM,GAEhDC,EAAQ,SAASA,EAAQ,SAAA,KAAc,KAAKD,EAAO,GAE5C;AAAA,IACL,WAAWE,EAAU,YAAA,EAAc,MAAM,GAAG,EAAE,CAAC,KAAK;AAAA,IACpD,SAASD,EAAQ,YAAA,EAAc,MAAM,GAAG,EAAE,CAAC,KAAK;AAAA,EAAA;AAEpD,GAEaH,IAAO,CAAC,EAAE,WAAAK,GAAW,YAAAC,GAAY,SAAAC,GAAS,QAAAC,QAAgC;AACrF,EAAAC,EAAuB,oCAAoCH,CAAU;AAErE,QAAM,CAACI,GAAgBC,CAAiB,IAAIC,EAAS,CAAC,GAEhD,EAAE,WAAAR,GAAW,SAAAD,EAAA,IAAYU,EAAQ,MAAMZ,EAAmBS,CAAc,GAAG,CAACA,CAAc,CAAC,GAE3F,EAAE,MAAAI,EAAA,IAASC,EAA0C;AAAA,IACzD,WAAAV;AAAA,IACA,WAAAD;AAAA,IACA,SAAAD;AAAA,IACA,MAAM;AAAA,IACN,KAAK;AAAA,EAAA,CACN,GACKa,IAAqBF,EAAK,sCAAsC,CAAA,GAEhEG,IAA8BJ,EAAQ,MACnCG,EAAmB,KAAK,CAAAE,OACNA,EAAQ,kBAAkB,CAAA,GAC3B,KAAK,CAAAC,MAAW;AACpC,QAAIA,EAAQ,WAAW,aAAc,QAAO;AAC5C,UAAMC,IAAaD,EAAQ,gBAAgB;AAAA,MACzC,CAAAE,MAAUA,EAAO,gBAAgB;AAAA,IAAA;AAEnC,WAAOD,KAAc,cAAcA,KAAcA,EAAW,SAAS;AAAA,EACvE,CAAC,CACF,GACA,CAACJ,CAAkB,CAAC;AAcvB,SACE,gBAAAlB;AAAA,IAACwB;AAAA,IAAA;AAAA,MACC,oBAAAN;AAAA,MACA,gBAAAN;AAAA,MACA,iBAhBoB,MAAM;AAC5B,QAAAH,EAAQgB,EAAgB,yBAAyB;AAAA,MACnD;AAAA,MAeI,mBAb0B,CAACb,MAA2B;AACxD,QAAAC,EAAkBD,CAAc;AAAA,MAClC;AAAA,MAYI,eAVkB,CAACc,MAAsB;AAC3C,QAAAjB,EAAQgB,EAAgB,yBAAyB,EAAE,WAAAC,EAAA,CAAW;AAAA,MAChE;AAAA,MASI,QAAAhB;AAAA,MACA,WAAAH;AAAA,MACA,6BAAAY;AAAA,MACA,SAAAV;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Contractor/Payments/PaymentsList/PaymentsListPresentation.d.ts

@@ -1,5 +1,6 @@
 import { ContractorPaymentGroupWithBlockers } from '@gusto/embedded-api/models/components/contractorpaymentgroupwithblockers';
 import { InternalAlert } from '../types';
+import { EventType } from '../../../../shared/constants';
 interface ContractorPaymentPaymentsListPresentationProps {
     numberOfMonths: number;
     contractorPayments: ContractorPaymentGroupWithBlockers[];
@@ -7,6 +8,9 @@ interface ContractorPaymentPaymentsListPresentationProps {
     onDateRangeChange: (numberOfMonths: number) => void;
     onViewPayment: (paymentId: string) => void;
     alerts?: InternalAlert[];
+    companyId: string;
+    hasUnresolvedWireInRequests: boolean;
+    onEvent: (type: EventType, data?: unknown) => void;
 }
-export declare const PaymentsListPresentation: ({ contractorPayments, numberOfMonths, onCreatePayment, onDateRangeChange, onViewPayment, alerts, }: ContractorPaymentPaymentsListPresentationProps) => import("react/jsx-runtime").JSX.Element;
+export declare const PaymentsListPresentation: ({ contractorPayments, numberOfMonths, onCreatePayment, onDateRangeChange, onViewPayment, alerts, companyId, hasUnresolvedWireInRequests, onEvent, }: ContractorPaymentPaymentsListPresentationProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Contractor/Payments/PaymentsList/PaymentsListPresentation.js

@@ -1,75 +1,76 @@
-import { jsx as n, jsxs as i } from "react/jsx-runtime";
-import { useTranslation as x } from "react-i18next";
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import { useTranslation as N } from "react-i18next";
 import u from "./PaymentsListPresentation.module.scss.js";
 import { Flex as r } from "../../../Common/Flex/Flex.js";
-import "classnames";
-import { EmptyData as w } from "../../../Common/EmptyData/EmptyData.js";
-import { ActionsLayout as L } from "../../../Common/ActionsLayout/ActionsLayout.js";
-import { useComponentContext as N } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { EmptyData as A } from "../../../Common/EmptyData/EmptyData.js";
+import { ActionsLayout as F } from "../../../Common/ActionsLayout/ActionsLayout.js";
+import { useComponentContext as R } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
 import "react";
-import { useI18n as A } from "../../../../i18n/I18n.js";
-import F from "../../../../hooks/useNumberFormatter.js";
-import R from "../../../../assets/icons/eye.svg.js";
-import { useDateFormatter as j } from "../../../../hooks/useDateFormatter.js";
-import { useDataView as S } from "../../../Common/DataView/useDataView.js";
-import { DataView as T } from "../../../Common/DataView/DataView.js";
-const K = ({
+import { useI18n as j } from "../../../../i18n/I18n.js";
+import M from "../../../../hooks/useNumberFormatter.js";
+import S from "../../../../assets/icons/eye.svg.js";
+import { useDateFormatter as T } from "../../../../hooks/useDateFormatter.js";
+import { ConfirmWireDetails as V } from "../../../Payroll/ConfirmWireDetails/ConfirmWireDetails.js";
+import { useDataView as $ } from "../../../Common/DataView/useDataView.js";
+import { DataView as k } from "../../../Common/DataView/DataView.js";
+const Z = ({
   contractorPayments: d,
   numberOfMonths: p,
   onCreatePayment: o,
   onDateRangeChange: h,
   onViewPayment: y,
-  alerts: l = []
+  alerts: s = [],
+  companyId: b,
+  hasUnresolvedWireInRequests: f,
+  onEvent: g
 }) => {
-  const { Button: s, Text: a, Heading: m, Select: b, ButtonIcon: f, Alert: g } = N();
-  A("Contractor.Payments.PaymentsList");
-  const { t } = x("Contractor.Payments.PaymentsList"), c = F("currency"), { formatLongWithYear: C } = j(), D = [
-    { value: "3", label: t("dateRanges.last3Months") },
-    { value: "6", label: t("dateRanges.last6Months") },
-    { value: "12", label: t("dateRanges.last12Months") }
-  ], { ...P } = S({
+  const { Button: l, Text: a, Heading: m, Select: C, ButtonIcon: D, Alert: P } = R();
+  j("Contractor.Payments.PaymentsList");
+  const { t: n } = N("Contractor.Payments.PaymentsList"), c = M("currency"), { formatLongWithYear: v } = T(), x = [
+    { value: "3", label: n("dateRanges.last3Months") },
+    { value: "6", label: n("dateRanges.last6Months") },
+    { value: "12", label: n("dateRanges.last12Months") }
+  ], { ...w } = $({
     data: d,
     columns: [
       {
-        title: t("paymentDateColumnLabel"),
-        render: ({ checkDate: e }) => /* @__PURE__ */ n(a, { weight: "semibold", variant: "supporting", children: C(e) || "N/A" })
+        title: n("paymentDateColumnLabel"),
+        render: ({ checkDate: t }) => /* @__PURE__ */ e(a, { weight: "semibold", variant: "supporting", children: v(t) || "N/A" })
       },
       {
-        title: t("reimbursementTotalColumnLabel"),
-        render: ({ totals: e }) => /* @__PURE__ */ n(a, { children: c(Number(e?.reimbursementAmount) || 0) })
+        title: n("wageTotalColumnLabel"),
+        render: ({ totals: t }) => /* @__PURE__ */ e(a, { children: c(Number(t?.wageAmount || 0)) })
       },
       {
-        title: t("wageTotalColumnLabel"),
-        render: ({ totals: e }) => /* @__PURE__ */ n(a, { children: c(Number(e?.wageAmount || 0)) })
-      },
-      {
-        title: t("actionColumnLabel"),
-        render: ({ uuid: e }) => /* @__PURE__ */ n(a, { children: /* @__PURE__ */ n(
-          f,
-          {
-            "aria-label": t("viewPaymentCta"),
-            variant: "tertiary",
-            onClick: () => {
-              y(e || "");
-            },
-            children: /* @__PURE__ */ n(R, { "aria-hidden": !0 })
-          }
-        ) })
+        title: n("reimbursementTotalColumnLabel"),
+        render: ({ totals: t }) => /* @__PURE__ */ e(a, { children: c(Number(t?.reimbursementAmount) || 0) })
       }
     ],
-    emptyState: () => /* @__PURE__ */ n(w, { title: t("noPaymentsFound"), description: t("noPaymentsDescription"), children: /* @__PURE__ */ n(L, { justifyContent: "center", children: /* @__PURE__ */ n(s, { variant: "primary", onClick: o, children: t("createPaymentCta") }) }) })
+    itemMenu: ({ uuid: t }) => /* @__PURE__ */ e(
+      D,
+      {
+        "aria-label": n("viewPaymentCta"),
+        variant: "tertiary",
+        onClick: () => {
+          y(t || "");
+        },
+        children: /* @__PURE__ */ e(S, { "aria-hidden": !0 })
+      }
+    ),
+    emptyState: () => /* @__PURE__ */ e(A, { title: n("noPaymentsFound"), description: n("noPaymentsDescription"), children: /* @__PURE__ */ e(F, { justifyContent: "center", children: /* @__PURE__ */ e(l, { variant: "primary", onClick: o, children: n("createPaymentCta") }) }) })
   });
   return /* @__PURE__ */ i(r, { flexDirection: "column", gap: 24, children: [
-    /* @__PURE__ */ n(r, { flexDirection: "column", gap: 16, children: /* @__PURE__ */ n(m, { as: "h1", children: t("title") }) }),
-    l.length > 0 && /* @__PURE__ */ n(r, { flexDirection: "column", gap: 16, children: l.map((e, v) => /* @__PURE__ */ n(
-      g,
+    /* @__PURE__ */ e(r, { flexDirection: "column", gap: 16, children: /* @__PURE__ */ e(m, { as: "h1", children: n("title") }) }),
+    f && /* @__PURE__ */ e(V, { companyId: b, onEvent: g }),
+    s.length > 0 && /* @__PURE__ */ e(r, { flexDirection: "column", gap: 16, children: s.map((t, L) => /* @__PURE__ */ e(
+      P,
       {
-        label: t(`alerts.${e.title}`, e.translationParams),
-        status: e.type,
-        onDismiss: e.onDismiss,
-        children: e.content ?? null
+        label: n(`alerts.${t.title}`, t.translationParams),
+        status: t.type,
+        onDismiss: t.onDismiss,
+        children: t.content ?? null
       },
-      `${e.type}-${e.title}-${v}`
+      `${t.type}-${t.title}-${L}`
     )) }),
     /* @__PURE__ */ i(
       r,
@@ -85,31 +86,31 @@ const K = ({
         },
         justifyContent: "space-between",
         children: [
-          /* @__PURE__ */ n(m, { as: "h2", children: t("subtitle") }),
+          /* @__PURE__ */ e(m, { as: "h2", children: n("subtitle") }),
           /* @__PURE__ */ i("div", { className: u.actionsContainer, children: [
-            /* @__PURE__ */ n(
-              b,
+            /* @__PURE__ */ e(
+              C,
               {
                 id: "date-range-select",
                 value: p.toString(),
-                onChange: (e) => {
-                  h(Number(e));
+                onChange: (t) => {
+                  h(Number(t));
                 },
-                options: D,
+                options: x,
                 isRequired: !0,
-                label: t("startDate"),
+                label: n("startDate"),
                 shouldVisuallyHideLabel: !0
               }
             ),
-            /* @__PURE__ */ n(s, { onClick: o, variant: "secondary", className: u.nowrap, children: t("createPaymentCta") })
+            /* @__PURE__ */ e(l, { onClick: o, variant: "secondary", className: u.nowrap, children: n("createPaymentCta") })
           ] })
         ]
       }
     ),
-    /* @__PURE__ */ n(T, { label: t("subtitle"), ...P })
+    /* @__PURE__ */ e(k, { label: n("subtitle"), ...w })
   ] });
 };
 export {
-  K as PaymentsListPresentation
+  Z as PaymentsListPresentation
 };
 //# sourceMappingURL=PaymentsListPresentation.js.map

package/dist/components/Contractor/Payments/PaymentsList/PaymentsListPresentation.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentsListPresentation.js","sources":["../../../../../src/components/Contractor/Payments/PaymentsList/PaymentsListPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { ContractorPaymentGroupWithBlockers } from '@gusto/embedded-api/models/components/contractorpaymentgroupwithblockers'\nimport type { InternalAlert } from '../types'\nimport styles from './PaymentsListPresentation.module.scss'\nimport { DataView, Flex, EmptyData, ActionsLayout, useDataView } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport EyeIcon from '@/assets/icons/eye.svg?react'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\n\ninterface ContractorPaymentPaymentsListPresentationProps {\n  numberOfMonths: number\n  contractorPayments: ContractorPaymentGroupWithBlockers[]\n  onCreatePayment: () => void\n  onDateRangeChange: (numberOfMonths: number) => void\n  onViewPayment: (paymentId: string) => void\n  alerts?: InternalAlert[]\n}\n\nexport const PaymentsListPresentation = ({\n  contractorPayments,\n  numberOfMonths,\n  onCreatePayment,\n  onDateRangeChange,\n  onViewPayment,\n  alerts = [],\n}: ContractorPaymentPaymentsListPresentationProps) => {\n  const { Button, Text, Heading, Select, ButtonIcon, Alert } = useComponentContext()\n  useI18n('Contractor.Payments.PaymentsList')\n  const { t } = useTranslation('Contractor.Payments.PaymentsList')\n  const currencyFormatter = useNumberFormatter('currency')\n  const { formatLongWithYear } = useDateFormatter()\n\n  const dateRangeOptions = [\n    { value: '3', label: t('dateRanges.last3Months') },\n    { value: '6', label: t('dateRanges.last6Months') },\n    { value: '12', label: t('dateRanges.last12Months') },\n  ]\n  const { ...dataViewProps } = useDataView({\n    data: contractorPayments,\n    columns: [\n      {\n        title: t('paymentDateColumnLabel'),\n        render: ({ checkDate }) => (\n          <Text weight=\"semibold\" variant=\"supporting\">\n            {formatLongWithYear(checkDate) || 'N/A'}\n          </Text>\n        ),\n      },\n      {\n        title: t('reimbursementTotalColumnLabel'),\n        render: ({ totals }) => (\n          <Text>{currencyFormatter(Number(totals?.reimbursementAmount) || 0)}</Text>\n        ),\n      },\n      {\n        title: t('wageTotalColumnLabel'),\n        render: ({ totals }) => <Text>{currencyFormatter(Number(totals?.wageAmount || 0))}</Text>,\n      },\n      {\n        title: t('actionColumnLabel'),\n        render: ({ uuid }) => (\n          <Text>\n            <ButtonIcon\n              aria-label={t('viewPaymentCta')}\n              variant=\"tertiary\"\n              onClick={() => {\n                onViewPayment(uuid || '')\n              }}\n            >\n              <EyeIcon aria-hidden />\n            </ButtonIcon>\n          </Text>\n        ),\n      },\n    ],\n    emptyState: () => (\n      <EmptyData title={t('noPaymentsFound')} description={t('noPaymentsDescription')}>\n        <ActionsLayout justifyContent=\"center\">\n          <Button variant=\"primary\" onClick={onCreatePayment}>\n            {t('createPaymentCta')}\n          </Button>\n        </ActionsLayout>\n      </EmptyData>\n    ),\n  })\n\n  return (\n    <Flex flexDirection=\"column\" gap={24}>\n      <Flex flexDirection=\"column\" gap={16}>\n        <Heading as=\"h1\">{t('title')}</Heading>\n      </Flex>\n\n      {alerts.length > 0 && (\n        <Flex flexDirection=\"column\" gap={16}>\n          {alerts.map((alert, index) => (\n            <Alert\n              key={`${alert.type}-${alert.title}-${index}`}\n              label={t(`alerts.${alert.title}` as never, alert.translationParams)}\n              status={alert.type}\n              onDismiss={alert.onDismiss}\n            >\n              {alert.content ?? null}\n            </Alert>\n          ))}\n        </Flex>\n      )}\n\n      <Flex\n        flexDirection={{\n          base: 'column',\n          small: 'row',\n        }}\n        gap={16}\n        alignItems={{\n          base: 'stretch',\n          small: 'flex-end',\n        }}\n        justifyContent=\"space-between\"\n      >\n        <Heading as=\"h2\">{t('subtitle')}</Heading>\n        <div className={styles.actionsContainer}>\n          <Select\n            id=\"date-range-select\"\n            value={numberOfMonths.toString()}\n            onChange={value => {\n              onDateRangeChange(Number(value))\n            }}\n            options={dateRangeOptions}\n            isRequired\n            label={t('startDate')}\n            shouldVisuallyHideLabel\n          />\n          <Button onClick={onCreatePayment} variant=\"secondary\" className={styles.nowrap}>\n            {t('createPaymentCta')}\n          </Button>\n        </div>\n      </Flex>\n\n      <DataView label={t('subtitle')} {...dataViewProps} />\n    </Flex>\n  )\n}\n"],"names":["PaymentsListPresentation","contractorPayments","numberOfMonths","onCreatePayment","onDateRangeChange","onViewPayment","alerts","Button","Text","Heading","Select","ButtonIcon","Alert","useComponentContext","useI18n","useTranslation","currencyFormatter","useNumberFormatter","formatLongWithYear","useDateFormatter","dateRangeOptions","dataViewProps","useDataView","checkDate","jsx","totals","uuid","EyeIcon","EmptyData","ActionsLayout","jsxs","Flex","alert","index","styles","value","DataView"],"mappings":"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"}
+{"version":3,"file":"PaymentsListPresentation.js","sources":["../../../../../src/components/Contractor/Payments/PaymentsList/PaymentsListPresentation.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { ContractorPaymentGroupWithBlockers } from '@gusto/embedded-api/models/components/contractorpaymentgroupwithblockers'\nimport type { InternalAlert } from '../types'\nimport styles from './PaymentsListPresentation.module.scss'\nimport { DataView, Flex, EmptyData, ActionsLayout, useDataView } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport EyeIcon from '@/assets/icons/eye.svg?react'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport { ConfirmWireDetails } from '@/components/Payroll/ConfirmWireDetails'\nimport type { EventType } from '@/shared/constants'\n\ninterface ContractorPaymentPaymentsListPresentationProps {\n  numberOfMonths: number\n  contractorPayments: ContractorPaymentGroupWithBlockers[]\n  onCreatePayment: () => void\n  onDateRangeChange: (numberOfMonths: number) => void\n  onViewPayment: (paymentId: string) => void\n  alerts?: InternalAlert[]\n  companyId: string\n  hasUnresolvedWireInRequests: boolean\n  onEvent: (type: EventType, data?: unknown) => void\n}\n\nexport const PaymentsListPresentation = ({\n  contractorPayments,\n  numberOfMonths,\n  onCreatePayment,\n  onDateRangeChange,\n  onViewPayment,\n  alerts = [],\n  companyId,\n  hasUnresolvedWireInRequests,\n  onEvent,\n}: ContractorPaymentPaymentsListPresentationProps) => {\n  const { Button, Text, Heading, Select, ButtonIcon, Alert } = useComponentContext()\n  useI18n('Contractor.Payments.PaymentsList')\n  const { t } = useTranslation('Contractor.Payments.PaymentsList')\n  const currencyFormatter = useNumberFormatter('currency')\n  const { formatLongWithYear } = useDateFormatter()\n\n  const dateRangeOptions = [\n    { value: '3', label: t('dateRanges.last3Months') },\n    { value: '6', label: t('dateRanges.last6Months') },\n    { value: '12', label: t('dateRanges.last12Months') },\n  ]\n  const { ...dataViewProps } = useDataView({\n    data: contractorPayments,\n    columns: [\n      {\n        title: t('paymentDateColumnLabel'),\n        render: ({ checkDate }) => (\n          <Text weight=\"semibold\" variant=\"supporting\">\n            {formatLongWithYear(checkDate) || 'N/A'}\n          </Text>\n        ),\n      },\n      {\n        title: t('wageTotalColumnLabel'),\n        render: ({ totals }) => <Text>{currencyFormatter(Number(totals?.wageAmount || 0))}</Text>,\n      },\n      {\n        title: t('reimbursementTotalColumnLabel'),\n        render: ({ totals }) => (\n          <Text>{currencyFormatter(Number(totals?.reimbursementAmount) || 0)}</Text>\n        ),\n      },\n    ],\n    itemMenu: ({ uuid }) => (\n      <ButtonIcon\n        aria-label={t('viewPaymentCta')}\n        variant=\"tertiary\"\n        onClick={() => {\n          onViewPayment(uuid || '')\n        }}\n      >\n        <EyeIcon aria-hidden />\n      </ButtonIcon>\n    ),\n    emptyState: () => (\n      <EmptyData title={t('noPaymentsFound')} description={t('noPaymentsDescription')}>\n        <ActionsLayout justifyContent=\"center\">\n          <Button variant=\"primary\" onClick={onCreatePayment}>\n            {t('createPaymentCta')}\n          </Button>\n        </ActionsLayout>\n      </EmptyData>\n    ),\n  })\n\n  return (\n    <Flex flexDirection=\"column\" gap={24}>\n      <Flex flexDirection=\"column\" gap={16}>\n        <Heading as=\"h1\">{t('title')}</Heading>\n      </Flex>\n\n      {hasUnresolvedWireInRequests && (\n        <ConfirmWireDetails companyId={companyId} onEvent={onEvent} />\n      )}\n\n      {alerts.length > 0 && (\n        <Flex flexDirection=\"column\" gap={16}>\n          {alerts.map((alert, index) => (\n            <Alert\n              key={`${alert.type}-${alert.title}-${index}`}\n              label={t(`alerts.${alert.title}` as never, alert.translationParams)}\n              status={alert.type}\n              onDismiss={alert.onDismiss}\n            >\n              {alert.content ?? null}\n            </Alert>\n          ))}\n        </Flex>\n      )}\n\n      <Flex\n        flexDirection={{\n          base: 'column',\n          small: 'row',\n        }}\n        gap={16}\n        alignItems={{\n          base: 'stretch',\n          small: 'flex-end',\n        }}\n        justifyContent=\"space-between\"\n      >\n        <Heading as=\"h2\">{t('subtitle')}</Heading>\n        <div className={styles.actionsContainer}>\n          <Select\n            id=\"date-range-select\"\n            value={numberOfMonths.toString()}\n            onChange={value => {\n              onDateRangeChange(Number(value))\n            }}\n            options={dateRangeOptions}\n            isRequired\n            label={t('startDate')}\n            shouldVisuallyHideLabel\n          />\n          <Button onClick={onCreatePayment} variant=\"secondary\" className={styles.nowrap}>\n            {t('createPaymentCta')}\n          </Button>\n        </div>\n      </Flex>\n\n      <DataView label={t('subtitle')} {...dataViewProps} />\n    </Flex>\n  )\n}\n"],"names":["PaymentsListPresentation","contractorPayments","numberOfMonths","onCreatePayment","onDateRangeChange","onViewPayment","alerts","companyId","hasUnresolvedWireInRequests","onEvent","Button","Text","Heading","Select","ButtonIcon","Alert","useComponentContext","useI18n","t","useTranslation","currencyFormatter","useNumberFormatter","formatLongWithYear","useDateFormatter","dateRangeOptions","dataViewProps","useDataView","checkDate","jsx","totals","uuid","EyeIcon","EmptyData","ActionsLayout","jsxs","Flex","ConfirmWireDetails","alert","index","styles","value","DataView"],"mappings":"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"}

package/dist/components/Contractor/Profile/useContractorProfile.js

@@ -13,8 +13,8 @@ import "@gusto/embedded-api/models/errors/sdkvalidationerror";
 import "@tanstack/react-query";
 import { useBase as Q } from "../../Base/useBase.js";
 import { ContractorSelfOnboardingStatuses as Y, componentEvents as b, ContractorOnboardingStatus as x } from "../../../shared/constants.js";
-import "classnames";
 import "../../../contexts/ComponentAdapter/useComponentContext.js";
+import "../../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
 import { removeNonDigits as ee } from "../../../helpers/formattedStrings.js";
 import { useI18n as oe } from "../../../i18n/I18n.js";
 import { SSN_REGEX as se, NAME_REGEX as N } from "../../../helpers/validations.js";