@gusto/embedded-react-sdk 0.44.0 → 0.44.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +21 -0
- package/dist/components/Base/useBaseSubmit.js +6 -6
- package/dist/components/Base/useBaseSubmit.js.map +1 -1
- package/dist/components/Company/AssignSignatory/AssignSignatorySelection.js +1 -1
- package/dist/components/Company/AssignSignatory/CreateSignatory/Actions.js +1 -1
- package/dist/components/Company/AssignSignatory/CreateSignatory/useCreateSignatory.js +1 -1
- package/dist/components/Company/AssignSignatory/InviteSignatory/Actions.js +1 -1
- package/dist/components/Company/AssignSignatory/InviteSignatory/useInviteSignatory.js +1 -1
- package/dist/components/Company/AssignSignatory/TitleSelect.js +1 -1
- package/dist/components/Company/AssignSignatory/useAssignSignatory.js +1 -1
- package/dist/components/Company/BankAccount/BankAccountForm/Actions.js +1 -1
- package/dist/components/Company/BankAccount/BankAccountForm/context.js +1 -1
- package/dist/components/Company/BankAccount/BankAccountList/Actions.js +1 -1
- package/dist/components/Company/BankAccount/BankAccountVerify/Actions.js +1 -1
- package/dist/components/Company/DocumentSigner/DocumentList/Actions.js +1 -1
- package/dist/components/Company/DocumentSigner/DocumentList/DocumentList.js +9 -9
- package/dist/components/Company/DocumentSigner/DocumentList/DocumentList.js.map +1 -1
- package/dist/components/Company/DocumentSigner/DocumentList/useDocumentList.js +1 -1
- package/dist/components/Company/FederalTaxes/Actions.js +1 -1
- package/dist/components/Company/FederalTaxes/useFederalTaxes.js +1 -1
- package/dist/components/Company/Industry/Actions.js +1 -1
- package/dist/components/Company/Industry/Context.js +1 -1
- package/dist/components/Company/Industry/Edit.js +1 -1
- package/dist/components/Company/Locations/LocationForm/Actions.js +1 -1
- package/dist/components/Company/Locations/LocationForm/useLocationForm.js +1 -1
- package/dist/components/Company/Locations/LocationsList/Actions.js +1 -1
- package/dist/components/Company/Locations/LocationsList/List.js +1 -1
- package/dist/components/Company/Locations/LocationsList/useLocationsList.js +1 -1
- package/dist/components/Company/OnboardingOverview/context.js +1 -1
- package/dist/components/Company/PaySchedule/PaySchedule.d.ts +2 -2
- package/dist/components/Company/PaySchedule/PaySchedule.js +6 -6
- package/dist/components/Company/PaySchedule/PaySchedule.js.map +1 -1
- package/dist/components/Company/PaySchedule/PayScheduleList.js +8 -8
- package/dist/components/Company/PaySchedule/PayScheduleList.js.map +1 -1
- package/dist/components/Company/PaySchedule/shared/usePayScheduleForm/usePayScheduleForm.d.ts +3 -3
- package/dist/components/Company/PaySchedule/shared/usePayScheduleForm/usePayScheduleForm.js +12 -12
- package/dist/components/Company/PaySchedule/shared/usePayScheduleForm/usePayScheduleForm.js.map +1 -1
- package/dist/components/Company/StateTaxes/StateTaxesForm/Actions.js +1 -1
- package/dist/components/Company/StateTaxes/StateTaxesForm/context.js +1 -1
- package/dist/components/Company/StateTaxes/StateTaxesList/Actions.js +1 -1
- package/dist/components/Company/StateTaxes/StateTaxesList/context.js +1 -1
- package/dist/components/Contractor/Address/Address.js +16 -16
- package/dist/components/Contractor/Address/Address.js.map +1 -1
- package/dist/components/Contractor/Address/Form.js +4 -4
- package/dist/components/Contractor/Address/useAddress.js +1 -1
- package/dist/components/Contractor/PaymentMethod/PaymentMethod.js +8 -8
- package/dist/components/Contractor/PaymentMethod/PaymentMethod.js.map +1 -1
- package/dist/components/Contractor/PaymentMethod/PaymentTypeForm.js +1 -1
- package/dist/components/Contractor/Payments/PaymentsList/PaymentsList.js +5 -5
- package/dist/components/Contractor/Payments/PaymentsList/PaymentsList.js.map +1 -1
- package/dist/components/Contractor/Profile/useContractorProfile.js +1 -1
- package/dist/components/Contractor/Submit/Submit.js +22 -20
- package/dist/components/Contractor/Submit/Submit.js.map +1 -1
- package/dist/components/Employee/Dashboard/hooks/useEmployeeCompensation.d.ts +1 -1
- package/dist/components/Employee/Dashboard/hooks/useEmployeeCompensation.js +6 -6
- package/dist/components/Employee/Dashboard/hooks/useEmployeeCompensation.js.map +1 -1
- package/dist/components/Employee/Dashboard/hooks/useEmployeeForms.js +3 -3
- package/dist/components/Employee/Dashboard/hooks/useEmployeeForms.js.map +1 -1
- package/dist/components/Employee/Deductions/Deductions.js +7 -7
- package/dist/components/Employee/Deductions/Deductions.js.map +1 -1
- package/dist/components/Employee/Deductions/DeductionsForm/ChildSupportForm.js +24 -24
- package/dist/components/Employee/Deductions/DeductionsForm/ChildSupportForm.js.map +1 -1
- package/dist/components/Employee/Deductions/DeductionsForm/CustomDeductionForm.js +13 -9
- package/dist/components/Employee/Deductions/DeductionsForm/CustomDeductionForm.js.map +1 -1
- package/dist/components/Employee/Deductions/DeductionsForm/DeductionsForm.js +2 -2
- package/dist/components/Employee/Deductions/DeductionsForm/DeductionsForm.js.map +1 -1
- package/dist/components/Employee/Deductions/DeductionsForm/GarnishmentForm.d.ts +1 -2
- package/dist/components/Employee/Deductions/DeductionsForm/GarnishmentForm.js +17 -17
- package/dist/components/Employee/Deductions/DeductionsForm/GarnishmentForm.js.map +1 -1
- package/dist/components/Employee/Deductions/DeductionsList/DeductionsList.js +30 -30
- package/dist/components/Employee/Deductions/DeductionsList/DeductionsList.js.map +1 -1
- package/dist/components/Employee/DocumentSigner/DocumentList/Actions.js +1 -1
- package/dist/components/Employee/DocumentSigner/DocumentList/DocumentList.js +8 -8
- package/dist/components/Employee/DocumentSigner/DocumentList/DocumentList.js.map +1 -1
- package/dist/components/Employee/DocumentSigner/DocumentList/useDocumentList.js +1 -1
- package/dist/components/Employee/DocumentSigner/DocumentSigner.js +1 -1
- package/dist/components/Employee/DocumentSigner/DocumentSigner.js.map +1 -1
- package/dist/components/Employee/DocumentSigner/EmploymentEligibility/EmploymentEligibilityPresentation.js +12 -12
- package/dist/components/Employee/DocumentSigner/EmploymentEligibility/EmploymentEligibilityPresentation.js.map +1 -1
- package/dist/components/Employee/DocumentSigner/EmploymentEligibility/EmploymentEligibilitySchema.js +1 -1
- package/dist/components/Employee/DocumentSigner/EmploymentEligibility/EmploymentEligibilitySchema.js.map +1 -1
- package/dist/components/Employee/FederalTaxes/management/FederalTaxes.js +1 -1
- package/dist/components/Employee/FederalTaxes/onboarding/FederalTaxes.js +1 -1
- package/dist/components/Employee/PaymentMethod/Actions.js +1 -1
- package/dist/components/Employee/PaymentMethod/BankAccountEdit.js +1 -1
- package/dist/components/Employee/PaymentMethod/BankAccountsList.js +1 -1
- package/dist/components/Employee/PaymentMethod/PaymentMethod.js +14 -14
- package/dist/components/Employee/PaymentMethod/PaymentMethod.js.map +1 -1
- package/dist/components/Employee/PaymentMethod/PaymentTypeForm.js +1 -1
- package/dist/components/Employee/PaymentMethod/Split.js +1 -1
- package/dist/components/Employee/PaymentMethod/usePaymentMethod.js +1 -1
- package/dist/components/Employee/Profile/management/Profile.js +1 -1
- package/dist/components/Employee/Profile/onboarding/AdminProfile.js +1 -1
- package/dist/components/Employee/Profile/onboarding/EmployeeProfile.js +1 -1
- package/dist/components/Employee/StateTaxes/management/StateTaxes.js +1 -1
- package/dist/components/Employee/StateTaxes/onboarding/StateTaxes.js +1 -1
- package/dist/components/Employee/StateTaxes/shared/EmployeeStateTaxesView.js +19 -17
- package/dist/components/Employee/StateTaxes/shared/EmployeeStateTaxesView.js.map +1 -1
- package/dist/components/Employee/StateTaxes/shared/EmployeeStateTaxesView.module.scss.js +8 -0
- package/dist/components/Employee/StateTaxes/shared/EmployeeStateTaxesView.module.scss.js.map +1 -0
- package/dist/components/Employee/Taxes/Actions.js +1 -1
- package/dist/components/Employee/Taxes/FederalForm.js +1 -1
- package/dist/components/Employee/Taxes/useTaxes.js +1 -1
- package/dist/components/Employee/Terminations/TerminateEmployee/TerminateEmployee.js +11 -11
- package/dist/components/Employee/Terminations/TerminateEmployee/TerminateEmployee.js.map +1 -1
- package/dist/components/Employee/Terminations/TerminationSummary/TerminationSummary.js +3 -3
- package/dist/components/Employee/Terminations/TerminationSummary/TerminationSummary.js.map +1 -1
- package/dist/components/InformationRequests/InformationRequestForm/InformationRequestForm.js +40 -45
- package/dist/components/InformationRequests/InformationRequestForm/InformationRequestForm.js.map +1 -1
- package/dist/components/InformationRequests/InformationRequestList/InformationRequestList.js +1 -1
- package/dist/components/InformationRequests/InformationRequestList/InformationRequestList.js.map +1 -1
- package/dist/components/Payroll/ConfirmWireDetails/ConfirmWireDetailsForm/ConfirmWireDetailsForm.js +17 -17
- package/dist/components/Payroll/ConfirmWireDetails/ConfirmWireDetailsForm/ConfirmWireDetailsForm.js.map +1 -1
- package/dist/components/Payroll/Dismissal/DismissalPayPeriodSelection/DismissalPayPeriodSelection.js +7 -7
- package/dist/components/Payroll/Dismissal/DismissalPayPeriodSelection/DismissalPayPeriodSelection.js.map +1 -1
- package/dist/components/Payroll/GrossUpModal/GrossUpModal.js +1 -1
- package/dist/components/Payroll/OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation.js +1 -1
- package/dist/components/Payroll/OffCycleReasonSelection/OffCycleReasonSelectionPresentation.js +1 -1
- package/dist/components/Payroll/OffCycleTaxWithholdingModal/OffCycleTaxWithholdingModal.js +1 -1
- package/dist/components/Payroll/PayrollBlocker/components/PayrollBlockerList.js +10 -10
- package/dist/components/Payroll/PayrollBlocker/components/PayrollBlockerList.js.map +1 -1
- package/dist/components/Payroll/PayrollBlocker/payrollHelpers.d.ts +2 -2
- package/dist/components/Payroll/PayrollBlocker/payrollHelpers.js +21 -25
- package/dist/components/Payroll/PayrollBlocker/payrollHelpers.js.map +1 -1
- package/dist/components/Payroll/PayrollConfiguration/PayrollConfigurationPresentation.d.ts +1 -1
- package/dist/components/Payroll/PayrollConfiguration/PayrollConfigurationPresentation.js.map +1 -1
- package/dist/components/Payroll/PayrollConfiguration/usePayrollConfigurationData.d.ts +2 -2
- package/dist/components/Payroll/PayrollConfiguration/usePayrollConfigurationData.js +1 -1
- package/dist/components/Payroll/PayrollConfiguration/usePayrollConfigurationData.js.map +1 -1
- package/dist/components/Payroll/PayrollEditEmployee/PayrollEditEmployee.js +4 -4
- package/dist/components/Payroll/PayrollEditEmployee/PayrollEditEmployee.js.map +1 -1
- package/dist/components/Payroll/PayrollEditEmployee/PayrollEditEmployeePresentation.d.ts +1 -1
- package/dist/components/Payroll/PayrollEditEmployee/PayrollEditEmployeePresentation.js.map +1 -1
- package/dist/components/Payroll/PayrollList/PayrollList.js +4 -4
- package/dist/components/Payroll/PayrollList/PayrollList.js.map +1 -1
- package/dist/components/Payroll/PayrollList/PayrollListPresentation.d.ts +2 -2
- package/dist/components/Payroll/PayrollList/PayrollListPresentation.js.map +1 -1
- package/dist/components/Payroll/RecoveryCases/RecoveryCasesList/RecoveryCasesList.js +5 -5
- package/dist/components/Payroll/RecoveryCases/RecoveryCasesList/RecoveryCasesList.js.map +1 -1
- package/dist/components/Payroll/RecoveryCases/RecoveryCasesResubmit/RecoveryCasesResubmit.js +1 -1
- package/dist/components/Payroll/RecoveryCases/RecoveryCasesResubmit/RecoveryCasesResubmit.js.map +1 -1
- package/dist/components/Payroll/TransitionCreation/TransitionCreation.js +7 -7
- package/dist/components/Payroll/TransitionCreation/TransitionCreation.js.map +1 -1
- package/dist/components/Payroll/TransitionPayrollAlert/TransitionPayrollAlert.d.ts +1 -1
- package/dist/components/Payroll/TransitionPayrollAlert/TransitionPayrollAlert.js +70 -53
- package/dist/components/Payroll/TransitionPayrollAlert/TransitionPayrollAlert.js.map +1 -1
- package/dist/components/Payroll/TransitionPayrollAlert/TransitionPayrollAlertPresentation.d.ts +1 -1
- package/dist/components/Payroll/TransitionPayrollAlert/TransitionPayrollAlertPresentation.js.map +1 -1
- package/dist/components/Payroll/helpers.d.ts +1 -1
- package/dist/components/Payroll/helpers.js.map +1 -1
- package/dist/components/Payroll/usePreparedPayrollData.d.ts +2 -2
- package/dist/components/Payroll/usePreparedPayrollData.js +10 -10
- package/dist/components/Payroll/usePreparedPayrollData.js.map +1 -1
- package/dist/components/TimeOff/HolidayPolicyDetail/HolidayPolicyDetailPresentation.js +1 -1
- package/dist/components/TimeOff/TimeOffManagement/SelectEmployees/SelectEmployeesTimeOff.js +41 -41
- package/dist/components/TimeOff/TimeOffManagement/SelectEmployees/SelectEmployeesTimeOff.js.map +1 -1
- package/dist/components/TimeOff/shared/EmployeeTable/EmployeeTable.js +1 -1
- package/dist/components/TimeOff/shared/PolicyDetailLayout/PolicyDetailLayout.js +1 -1
- package/dist/contexts/GustoProvider/GustoProviderCustomUIAdapter.js +1 -1
- package/dist/helpers/dateFormatting.js +52 -56
- package/dist/helpers/dateFormatting.js.map +1 -1
- package/dist/partner-hook-utils/form/fields/CheckboxHookField.js +1 -1
- package/dist/partner-hook-utils/form/fields/NumberInputHookField.js +1 -1
- package/dist/partner-hook-utils/form/fields/RadioGroupHookField.js +1 -1
- package/dist/partner-hook-utils/form/fields/SelectHookField.js +1 -1
- package/dist/partner-hook-utils/form/fields/SwitchHookField.js +1 -1
- package/dist/partner-hook-utils/form/fields/TextInputHookField.js +1 -1
- package/dist/style.css +1 -1
- package/dist/test-utils/assertions.d.ts +4 -0
- package/package.json +13 -10
package/dist/components/InformationRequests/InformationRequestForm/InformationRequestForm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InformationRequestForm.js","sources":["../../../../src/components/InformationRequests/InformationRequestForm/InformationRequestForm.tsx"],"sourcesContent":["import DOMPurify from 'dompurify'\nimport { useTranslation } from 'react-i18next'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { z } from 'zod'\nimport { useIsMutating } from '@tanstack/react-query'\nimport { useInformationRequestsGetInformationRequestsSuspense } from '@gusto/embedded-api/react-query/informationRequestsGetInformationRequests'\nimport {\n useInformationRequestsSubmitMutation,\n mutationKeyInformationRequestsSubmit,\n} from '@gusto/embedded-api/react-query/informationRequestsSubmit'\nimport type { RequiredQuestions } from '@gusto/embedded-api/models/components/informationrequest'\nimport { ResponseType } from '@gusto/embedded-api/models/components/informationrequest'\nimport { ResponseType as SubmitResponseType } from '@gusto/embedded-api/models/operations/submitinformationrequest'\nimport type { InformationRequestsContextInterface } from '../InformationRequestsComponents'\nimport styles from './InformationRequestForm.module.scss'\nimport { BaseComponent, useBase, type BaseComponentInterface } from '@/components/Base'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport { Flex, TextInputField } from '@/components/Common'\nimport { FileInputField } from '@/components/Common/Fields/FileInputField'\nimport { Form } from '@/components/Common/Form'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { informationRequestEvents, type EventType } from '@/shared/constants'\nimport { useFlow } from '@/components/Flow/useFlow'\n\nconst INFORMATION_REQUEST_FORM_ID = 'gusto-sdk-information-request-form'\nconst ACCEPTED_FILE_TYPES = ['image/jpeg', 'image/png', 'application/pdf']\nconst dompurifyConfig = {\n ALLOWED_TAGS: ['a', 'b', 'strong'],\n ALLOWED_ATTR: ['target', 'href', 'rel'],\n}\n\n/* API does not enforce an upper limit, so set a reasonable character max for a single-line input. */\nconst MAX_TEXT_RESPONSE = 5000\n\nconst InformationRequestFormSchema = z.record(\n z.string(),\n z.union([z.string().min(1), z.instanceof(File)]),\n)\n\ntype InformationRequestFormValues = z.infer<typeof InformationRequestFormSchema>\n\ninterface InformationRequestFormProps extends BaseComponentInterface<'InformationRequests.InformationRequestForm'> {\n companyId: string\n requestId: string\n onEvent: OnEventType<EventType, unknown>\n}\n\nexport function InformationRequestForm(props: InformationRequestFormProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\nconst convertFileToDataUrl = (file: File) => {\n return new Promise<string>((resolve, reject) => {\n const reader = new FileReader()\n reader.onload = () => {\n resolve(reader.result as string)\n }\n reader.onerror = reject\n reader.readAsDataURL(file)\n })\n}\n\nconst SUPPORTED_RESPONSE_TYPES: ResponseType[] = [ResponseType.Text, ResponseType.Document]\n\nfunction hasUnsupportedQuestionTypes(questions: RequiredQuestions[]) {\n return questions.some(\n question => question.responseType && !SUPPORTED_RESPONSE_TYPES.includes(question.responseType),\n )\n}\n\nfunction hasPersonaQuestionType(questions: RequiredQuestions[]) {\n return questions.some(question => question.responseType === ResponseType.Persona)\n}\n\nfunction Root({ companyId, requestId, dictionary }: InformationRequestFormProps) {\n useComponentDictionary('InformationRequests.InformationRequestForm', dictionary)\n useI18n('InformationRequests.InformationRequestForm')\n const { t } = useTranslation('InformationRequests.InformationRequestForm')\n const { Alert, Heading, Text } = useComponentContext()\n const { onEvent, baseSubmitHandler } = useBase()\n\n const { data } = useInformationRequestsGetInformationRequestsSuspense({\n companyUuid: companyId,\n })\n\n const informationRequest = data.informationRequestList?.find(req => req.uuid === requestId)\n const requiredQuestions = informationRequest?.requiredQuestions ?? []\n const isBlockingPayroll = informationRequest?.blockingPayroll ?? false\n const hasUnsupportedTypes = hasUnsupportedQuestionTypes(requiredQuestions)\n const hasPersonaType = hasPersonaQuestionType(requiredQuestions)\n\n const { mutateAsync: submitInformationRequest } = useInformationRequestsSubmitMutation()\n\n const defaultValues: Record<string, string | File | undefined> = {}\n const questionUuids: string[] = []\n\n requiredQuestions.forEach(question => {\n if (!question.questionUuid || !question.responseType) return\n\n if (question.responseType === ResponseType.Text) {\n questionUuids.push(question.questionUuid)\n defaultValues[question.questionUuid] = ''\n } else if (question.responseType === ResponseType.Document) {\n questionUuids.push(question.questionUuid)\n defaultValues[question.questionUuid] = undefined\n }\n })\n\n const formMethods = useForm<InformationRequestFormValues>({\n resolver: zodResolver(InformationRequestFormSchema),\n defaultValues,\n })\n\n const onSubmit = async (formData: InformationRequestFormValues) => {\n await baseSubmitHandler(formData, async () => {\n const questionResponses = await Promise.all(\n questionUuids.map(async uuid => {\n const value = formData[uuid]\n\n if (typeof value === 'string') {\n return {\n questionUuid: uuid,\n responseType: SubmitResponseType.Text,\n textResponse: value,\n }\n }\n\n if (value instanceof File) {\n const fileResponse = await convertFileToDataUrl(value)\n return {\n questionUuid: uuid,\n responseType: SubmitResponseType.Document,\n fileResponse,\n fileName: value.name,\n }\n }\n\n return null\n }),\n )\n\n const validResponses = questionResponses.filter(response => response !== null)\n\n const response = await submitInformationRequest({\n request: {\n informationRequestUuid: requestId,\n requestBody: {\n requiredQuestions: validResponses,\n },\n },\n })\n\n onEvent(informationRequestEvents.INFORMATION_REQUEST_FORM_DONE, response.informationRequest)\n })\n }\n\n const renderQuestion = (question: RequiredQuestions) => {\n if (!question.questionUuid || !question.responseType) return null\n\n const fieldName = question.questionUuid\n const isDocumentType = question.responseType === ResponseType.Document\n const isTextType = question.responseType === ResponseType.Text\n\n return (\n <div key={fieldName} className={styles.questionCard}>\n <div className={styles.questionDescription}>\n <Text size=\"sm\" weight=\"medium\">\n {isDocumentType ? t('questionTypes.document') : t('questionTypes.answer')}\n </Text>\n <Text size=\"sm\" variant=\"supporting\">\n {/* SECURITY: XSS mitigated via DOMPurify with strict allowlist. Pattern matches TaxInputs.tsx */}\n <span\n dangerouslySetInnerHTML={{\n __html: DOMPurify.sanitize(question.questionText ?? '', dompurifyConfig),\n }}\n />\n </Text>\n </div>\n\n <hr className={styles.divider} />\n\n {isTextType && (\n <div className={styles.textInputWrapper}>\n <TextInputField\n name={fieldName}\n label={t('fields.textAnswer.label')}\n placeholder={t('fields.textAnswer.placeholder')}\n maxLength={MAX_TEXT_RESPONSE}\n isRequired\n errorMessage={t('validation.required')}\n />\n </div>\n )}\n\n {isDocumentType && (\n <div className={styles.fileInputWrapper}>\n <FileInputField\n name={fieldName}\n label={t('fields.fileUpload.label')}\n accept={ACCEPTED_FILE_TYPES}\n isRequired\n errorMessage={t('validation.required')}\n />\n </div>\n )}\n </div>\n )\n }\n\n const unsupportedPlaceholder = (\n <div className={styles.questionCard}>\n <div className={styles.questionDescription}>\n <Text weight=\"medium\">\n {t(hasPersonaType ? 'unsupported.persona.title' : 'unsupported.generic.title')}\n </Text>\n <Text>\n {t(\n hasPersonaType ? 'unsupported.persona.description' : 'unsupported.generic.description',\n )}\n </Text>\n </div>\n\n <hr className={styles.divider} />\n\n <div className={styles.contactSupport}>\n <Text variant=\"supporting\">{t('unsupported.contactSupport')}</Text>\n </div>\n </div>\n )\n\n return (\n <div className={styles.root}>\n <Flex flexDirection=\"column\" gap={16}>\n <Heading as=\"h2\">{t('title')}</Heading>\n\n {isBlockingPayroll && (\n <Alert status=\"error\" label={t('blockingAlert.title')} disableScrollIntoView>\n {t('blockingAlert.description')}\n </Alert>\n )}\n\n {hasUnsupportedTypes ? (\n unsupportedPlaceholder\n ) : (\n <FormProvider {...formMethods}>\n <Form id={INFORMATION_REQUEST_FORM_ID} onSubmit={formMethods.handleSubmit(onSubmit)}>\n <Flex flexDirection=\"column\" gap={16}>\n {requiredQuestions.map(renderQuestion)}\n </Flex>\n </Form>\n </FormProvider>\n )}\n </Flex>\n </div>\n )\n}\n\nconst Footer = ({ onEvent }: { onEvent: OnEventType<EventType, unknown> }) => {\n useI18n('InformationRequests.InformationRequestForm')\n const { t } = useTranslation('InformationRequests.InformationRequestForm')\n const { Button } = useComponentContext()\n const { companyId, selectedRequestId } = useFlow<InformationRequestsContextInterface>()\n\n const { data } = useInformationRequestsGetInformationRequestsSuspense({\n companyUuid: companyId,\n })\n\n const informationRequest = data.informationRequestList?.find(\n req => req.uuid === selectedRequestId,\n )\n const requiredQuestions = informationRequest?.requiredQuestions ?? []\n const hasUnsupportedTypes = hasUnsupportedQuestionTypes(requiredQuestions)\n\n const isMutating = useIsMutating({\n mutationKey: mutationKeyInformationRequestsSubmit(),\n })\n const isPending = isMutating > 0\n\n const handleCancel = () => {\n onEvent(informationRequestEvents.INFORMATION_REQUEST_FORM_CANCEL)\n }\n\n if (hasUnsupportedTypes) {\n return (\n <Flex justifyContent=\"flex-end\" gap={12}>\n <Button variant=\"secondary\" onClick={handleCancel}>\n {t('cta.close')}\n </Button>\n </Flex>\n )\n }\n\n return (\n <Flex justifyContent=\"flex-end\" gap={12}>\n <Button variant=\"secondary\" onClick={handleCancel} isDisabled={isPending}>\n {t('cta.cancel')}\n </Button>\n <Button\n variant=\"primary\"\n type=\"submit\"\n form={INFORMATION_REQUEST_FORM_ID}\n isLoading={isPending}\n >\n {t('cta.submit')}\n </Button>\n </Flex>\n )\n}\n\nInformationRequestForm.Footer = Footer\n"],"names":["INFORMATION_REQUEST_FORM_ID","ACCEPTED_FILE_TYPES","dompurifyConfig","MAX_TEXT_RESPONSE","InformationRequestFormSchema","z","InformationRequestForm","props","jsx","BaseComponent","Root","convertFileToDataUrl","file","resolve","reject","reader","SUPPORTED_RESPONSE_TYPES","ResponseType","hasUnsupportedQuestionTypes","questions","question","hasPersonaQuestionType","companyId","requestId","dictionary","useComponentDictionary","useI18n","t","useTranslation","Alert","Heading","Text","useComponentContext","onEvent","baseSubmitHandler","useBase","data","useInformationRequestsGetInformationRequestsSuspense","informationRequest","req","requiredQuestions","isBlockingPayroll","hasUnsupportedTypes","hasPersonaType","submitInformationRequest","useInformationRequestsSubmitMutation","defaultValues","questionUuids","formMethods","useForm","zodResolver","onSubmit","formData","validResponses","uuid","value","SubmitResponseType","fileResponse","response","informationRequestEvents","renderQuestion","fieldName","isDocumentType","isTextType","jsxs","styles","DOMPurify","TextInputField","FileInputField","unsupportedPlaceholder","Flex","FormProvider","Form","Footer","Button","selectedRequestId","useFlow","isPending","useIsMutating","mutationKeyInformationRequestsSubmit","handleCancel"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"InformationRequestForm.js","sources":["../../../../src/components/InformationRequests/InformationRequestForm/InformationRequestForm.tsx"],"sourcesContent":["import DOMPurify from 'dompurify'\nimport { useTranslation } from 'react-i18next'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { z } from 'zod'\nimport { useIsMutating } from '@tanstack/react-query'\nimport { useInformationRequestsGetInformationRequestsSuspense } from '@gusto/embedded-api/react-query/informationRequestsGetInformationRequests'\nimport {\n useInformationRequestsSubmitMutation,\n mutationKeyInformationRequestsSubmit,\n} from '@gusto/embedded-api/react-query/informationRequestsSubmit'\nimport type { RequiredQuestions } from '@gusto/embedded-api/models/components/informationrequest'\nimport { ResponseType } from '@gusto/embedded-api/models/components/informationrequest'\nimport { ResponseType as SubmitResponseType } from '@gusto/embedded-api/models/operations/submitinformationrequest'\nimport type { InformationRequestsContextInterface } from '../InformationRequestsComponents'\nimport styles from './InformationRequestForm.module.scss'\nimport { BaseComponent, useBase, type BaseComponentInterface } from '@/components/Base'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport { Flex, TextInputField } from '@/components/Common'\nimport { FileInputField } from '@/components/Common/Fields/FileInputField'\nimport { Form } from '@/components/Common/Form'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { informationRequestEvents, type EventType } from '@/shared/constants'\nimport { useFlow } from '@/components/Flow/useFlow'\n\nconst INFORMATION_REQUEST_FORM_ID = 'gusto-sdk-information-request-form'\nconst ACCEPTED_FILE_TYPES = ['image/jpeg', 'image/png', 'application/pdf']\nconst dompurifyConfig = {\n ALLOWED_TAGS: ['a', 'b', 'strong'],\n ALLOWED_ATTR: ['target', 'href', 'rel'],\n}\n\n/* API does not enforce an upper limit, so set a reasonable character max for a single-line input. */\nconst MAX_TEXT_RESPONSE = 5000\n\nconst InformationRequestFormSchema = z.record(\n z.string(),\n z.union([z.string().min(1), z.instanceof(File)]),\n)\n\ntype InformationRequestFormValues = z.infer<typeof InformationRequestFormSchema>\n\ninterface InformationRequestFormProps extends BaseComponentInterface<'InformationRequests.InformationRequestForm'> {\n companyId: string\n requestId: string\n onEvent: OnEventType<EventType, unknown>\n}\n\nexport function InformationRequestForm(props: InformationRequestFormProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\nconst convertFileToDataUrl = (file: File) => {\n return new Promise<string>((resolve, reject) => {\n const reader = new FileReader()\n reader.onload = () => {\n resolve(reader.result as string)\n }\n reader.onerror = reject\n reader.readAsDataURL(file)\n })\n}\n\nconst SUPPORTED_RESPONSE_TYPES: ResponseType[] = [ResponseType.Text, ResponseType.Document]\n\nfunction hasUnsupportedQuestionTypes(questions: RequiredQuestions[]) {\n return questions.some(question => !SUPPORTED_RESPONSE_TYPES.includes(question.responseType))\n}\n\nfunction hasPersonaQuestionType(questions: RequiredQuestions[]) {\n return questions.some(question => question.responseType === ResponseType.Persona)\n}\n\nfunction Root({ companyId, requestId, dictionary }: InformationRequestFormProps) {\n useComponentDictionary('InformationRequests.InformationRequestForm', dictionary)\n useI18n('InformationRequests.InformationRequestForm')\n const { t } = useTranslation('InformationRequests.InformationRequestForm')\n const { Alert, Heading, Text } = useComponentContext()\n const { onEvent, baseSubmitHandler } = useBase()\n\n const { data } = useInformationRequestsGetInformationRequestsSuspense({\n companyUuid: companyId,\n })\n\n const informationRequest = data.informationRequests?.find(req => req.uuid === requestId)\n const requiredQuestions = informationRequest?.requiredQuestions ?? []\n const isBlockingPayroll = informationRequest?.blockingPayroll ?? false\n const hasUnsupportedTypes = hasUnsupportedQuestionTypes(requiredQuestions)\n const hasPersonaType = hasPersonaQuestionType(requiredQuestions)\n\n const { mutateAsync: submitInformationRequest } = useInformationRequestsSubmitMutation()\n\n const defaultValues: Record<string, string | File | undefined> = {}\n const questionUuids: string[] = []\n\n requiredQuestions.forEach(question => {\n if (question.responseType === ResponseType.Text) {\n questionUuids.push(question.questionUuid)\n defaultValues[question.questionUuid] = ''\n } else if (question.responseType === ResponseType.Document) {\n questionUuids.push(question.questionUuid)\n defaultValues[question.questionUuid] = undefined\n }\n })\n\n const formMethods = useForm<InformationRequestFormValues>({\n resolver: zodResolver(InformationRequestFormSchema),\n defaultValues,\n })\n\n const onSubmit = async (formData: InformationRequestFormValues) => {\n await baseSubmitHandler(formData, async () => {\n const questionResponses = await Promise.all(\n questionUuids.map(async uuid => {\n const value = formData[uuid]\n\n if (typeof value === 'string') {\n return {\n questionUuid: uuid,\n responseType: SubmitResponseType.Text,\n textResponse: value,\n }\n }\n\n if (value instanceof File) {\n const fileResponse = await convertFileToDataUrl(value)\n return {\n questionUuid: uuid,\n responseType: SubmitResponseType.Document,\n fileResponse,\n fileName: value.name,\n }\n }\n\n return null\n }),\n )\n\n const validResponses = questionResponses.filter(response => response !== null)\n\n const response = await submitInformationRequest({\n request: {\n informationRequestUuid: requestId,\n requestBody: {\n requiredQuestions: validResponses,\n },\n },\n })\n\n onEvent(informationRequestEvents.INFORMATION_REQUEST_FORM_DONE, response.informationRequest)\n })\n }\n\n const renderQuestion = (question: RequiredQuestions) => {\n const fieldName = question.questionUuid\n const isDocumentType = question.responseType === ResponseType.Document\n const isTextType = question.responseType === ResponseType.Text\n\n return (\n <div key={fieldName} className={styles.questionCard}>\n <div className={styles.questionDescription}>\n <Text size=\"sm\" weight=\"medium\">\n {isDocumentType ? t('questionTypes.document') : t('questionTypes.answer')}\n </Text>\n <Text size=\"sm\" variant=\"supporting\">\n {/* SECURITY: XSS mitigated via DOMPurify with strict allowlist. Pattern matches TaxInputs.tsx */}\n <span\n dangerouslySetInnerHTML={{\n __html: DOMPurify.sanitize(question.questionText, dompurifyConfig),\n }}\n />\n </Text>\n </div>\n\n <hr className={styles.divider} />\n\n {isTextType && (\n <div className={styles.textInputWrapper}>\n <TextInputField\n name={fieldName}\n label={t('fields.textAnswer.label')}\n placeholder={t('fields.textAnswer.placeholder')}\n maxLength={MAX_TEXT_RESPONSE}\n isRequired\n errorMessage={t('validation.required')}\n />\n </div>\n )}\n\n {isDocumentType && (\n <div className={styles.fileInputWrapper}>\n <FileInputField\n name={fieldName}\n label={t('fields.fileUpload.label')}\n accept={ACCEPTED_FILE_TYPES}\n isRequired\n errorMessage={t('validation.required')}\n />\n </div>\n )}\n </div>\n )\n }\n\n const unsupportedPlaceholder = (\n <div className={styles.questionCard}>\n <div className={styles.questionDescription}>\n <Text weight=\"medium\">\n {t(hasPersonaType ? 'unsupported.persona.title' : 'unsupported.generic.title')}\n </Text>\n <Text>\n {t(\n hasPersonaType ? 'unsupported.persona.description' : 'unsupported.generic.description',\n )}\n </Text>\n </div>\n\n <hr className={styles.divider} />\n\n <div className={styles.contactSupport}>\n <Text variant=\"supporting\">{t('unsupported.contactSupport')}</Text>\n </div>\n </div>\n )\n\n return (\n <div className={styles.root}>\n <Flex flexDirection=\"column\" gap={16}>\n <Heading as=\"h2\">{t('title')}</Heading>\n\n {isBlockingPayroll && (\n <Alert status=\"error\" label={t('blockingAlert.title')} disableScrollIntoView>\n {t('blockingAlert.description')}\n </Alert>\n )}\n\n {hasUnsupportedTypes ? (\n unsupportedPlaceholder\n ) : (\n <FormProvider {...formMethods}>\n <Form id={INFORMATION_REQUEST_FORM_ID} onSubmit={formMethods.handleSubmit(onSubmit)}>\n <Flex flexDirection=\"column\" gap={16}>\n {requiredQuestions.map(renderQuestion)}\n </Flex>\n </Form>\n </FormProvider>\n )}\n </Flex>\n </div>\n )\n}\n\nconst Footer = ({ onEvent }: { onEvent: OnEventType<EventType, unknown> }) => {\n useI18n('InformationRequests.InformationRequestForm')\n const { t } = useTranslation('InformationRequests.InformationRequestForm')\n const { Button } = useComponentContext()\n const { companyId, selectedRequestId } = useFlow<InformationRequestsContextInterface>()\n\n const { data } = useInformationRequestsGetInformationRequestsSuspense({\n companyUuid: companyId,\n })\n\n const informationRequest = data.informationRequests?.find(req => req.uuid === selectedRequestId)\n const requiredQuestions = informationRequest?.requiredQuestions ?? []\n const hasUnsupportedTypes = hasUnsupportedQuestionTypes(requiredQuestions)\n\n const isMutating = useIsMutating({\n mutationKey: mutationKeyInformationRequestsSubmit(),\n })\n const isPending = isMutating > 0\n\n const handleCancel = () => {\n onEvent(informationRequestEvents.INFORMATION_REQUEST_FORM_CANCEL)\n }\n\n if (hasUnsupportedTypes) {\n return (\n <Flex justifyContent=\"flex-end\" gap={12}>\n <Button variant=\"secondary\" onClick={handleCancel}>\n {t('cta.close')}\n </Button>\n </Flex>\n )\n }\n\n return (\n <Flex justifyContent=\"flex-end\" gap={12}>\n <Button variant=\"secondary\" onClick={handleCancel} isDisabled={isPending}>\n {t('cta.cancel')}\n </Button>\n <Button\n variant=\"primary\"\n type=\"submit\"\n form={INFORMATION_REQUEST_FORM_ID}\n isLoading={isPending}\n >\n {t('cta.submit')}\n </Button>\n </Flex>\n )\n}\n\nInformationRequestForm.Footer = Footer\n"],"names":["INFORMATION_REQUEST_FORM_ID","ACCEPTED_FILE_TYPES","dompurifyConfig","MAX_TEXT_RESPONSE","InformationRequestFormSchema","z","InformationRequestForm","props","jsx","BaseComponent","Root","convertFileToDataUrl","file","resolve","reject","reader","SUPPORTED_RESPONSE_TYPES","ResponseType","hasUnsupportedQuestionTypes","questions","question","hasPersonaQuestionType","companyId","requestId","dictionary","useComponentDictionary","useI18n","t","useTranslation","Alert","Heading","Text","useComponentContext","onEvent","baseSubmitHandler","useBase","data","useInformationRequestsGetInformationRequestsSuspense","informationRequest","req","requiredQuestions","isBlockingPayroll","hasUnsupportedTypes","hasPersonaType","submitInformationRequest","useInformationRequestsSubmitMutation","defaultValues","questionUuids","formMethods","useForm","zodResolver","onSubmit","formData","validResponses","uuid","value","SubmitResponseType","fileResponse","response","informationRequestEvents","renderQuestion","fieldName","isDocumentType","isTextType","jsxs","styles","DOMPurify","TextInputField","FileInputField","unsupportedPlaceholder","Flex","FormProvider","Form","Footer","Button","selectedRequestId","useFlow","isPending","useIsMutating","mutationKeyInformationRequestsSubmit","handleCancel"],"mappings":"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"}
|
package/dist/components/InformationRequests/InformationRequestList/InformationRequestList.js
CHANGED
|
@@ -19,7 +19,7 @@ function C({ companyId: o, dictionary: d, onEvent: f }) {
|
|
|
19
19
|
S("InformationRequests.InformationRequestList", d), T("InformationRequests.InformationRequestList");
|
|
20
20
|
const { t } = b("InformationRequests.InformationRequestList"), { Heading: y, Text: m, Button: R, Badge: l } = x(), { data: g } = P({
|
|
21
21
|
companyUuid: o
|
|
22
|
-
}), c = (g.
|
|
22
|
+
}), c = (g.informationRequests ?? []).filter(
|
|
23
23
|
(e) => e.status !== r.Approved
|
|
24
24
|
), h = (e) => {
|
|
25
25
|
switch (e) {
|
package/dist/components/InformationRequests/InformationRequestList/InformationRequestList.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InformationRequestList.js","sources":["../../../../src/components/InformationRequests/InformationRequestList/InformationRequestList.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { useInformationRequestsGetInformationRequestsSuspense } from '@gusto/embedded-api/react-query/informationRequestsGetInformationRequests'\nimport type { InformationRequest } from '@gusto/embedded-api/models/components/informationrequest'\nimport {\n InformationRequestStatus,\n InformationRequestType,\n} from '@gusto/embedded-api/models/components/informationrequest'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { DataView } from '@/components/Common/DataView/DataView'\nimport { useDataView } from '@/components/Common/DataView/useDataView'\nimport { EmptyData, Flex, FlexItem } from '@/components/Common'\nimport { informationRequestEvents } from '@/shared/constants'\nimport type { BadgeProps } from '@/components/Common/UI/Badge/BadgeTypes'\n\ninterface InformationRequestListProps extends BaseComponentInterface<'InformationRequests.InformationRequestList'> {\n companyId: string\n onEvent: BaseComponentInterface['onEvent']\n}\n\nexport function InformationRequestList(props: InformationRequestListProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\ntype StatusMapping = {\n label: string\n badgeStatus: BadgeProps['status']\n} | null\n\nfunction Root({ companyId, dictionary, onEvent }: InformationRequestListProps) {\n useComponentDictionary('InformationRequests.InformationRequestList', dictionary)\n useI18n('InformationRequests.InformationRequestList')\n const { t } = useTranslation('InformationRequests.InformationRequestList')\n const { Heading, Text, Button, Badge } = useComponentContext()\n\n const { data } = useInformationRequestsGetInformationRequestsSuspense({\n companyUuid: companyId,\n })\n\n const informationRequests = data.
|
|
1
|
+
{"version":3,"file":"InformationRequestList.js","sources":["../../../../src/components/InformationRequests/InformationRequestList/InformationRequestList.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { useInformationRequestsGetInformationRequestsSuspense } from '@gusto/embedded-api/react-query/informationRequestsGetInformationRequests'\nimport type { InformationRequest } from '@gusto/embedded-api/models/components/informationrequest'\nimport {\n InformationRequestStatus,\n InformationRequestType,\n} from '@gusto/embedded-api/models/components/informationrequest'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { DataView } from '@/components/Common/DataView/DataView'\nimport { useDataView } from '@/components/Common/DataView/useDataView'\nimport { EmptyData, Flex, FlexItem } from '@/components/Common'\nimport { informationRequestEvents } from '@/shared/constants'\nimport type { BadgeProps } from '@/components/Common/UI/Badge/BadgeTypes'\n\ninterface InformationRequestListProps extends BaseComponentInterface<'InformationRequests.InformationRequestList'> {\n companyId: string\n onEvent: BaseComponentInterface['onEvent']\n}\n\nexport function InformationRequestList(props: InformationRequestListProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\ntype StatusMapping = {\n label: string\n badgeStatus: BadgeProps['status']\n} | null\n\nfunction Root({ companyId, dictionary, onEvent }: InformationRequestListProps) {\n useComponentDictionary('InformationRequests.InformationRequestList', dictionary)\n useI18n('InformationRequests.InformationRequestList')\n const { t } = useTranslation('InformationRequests.InformationRequestList')\n const { Heading, Text, Button, Badge } = useComponentContext()\n\n const { data } = useInformationRequestsGetInformationRequestsSuspense({\n companyUuid: companyId,\n })\n\n const informationRequests = data.informationRequests ?? []\n\n const visibleRequests = informationRequests.filter(\n request => request.status !== InformationRequestStatus.Approved,\n )\n\n const getTypeLabel = (type: InformationRequest['type']): string => {\n switch (type) {\n case InformationRequestType.CompanyOnboarding:\n return t('types.companyOnboarding')\n case InformationRequestType.AccountProtection:\n return t('types.accountProtection')\n case InformationRequestType.PaymentRequest:\n return t('types.paymentRequest')\n case InformationRequestType.PaymentError:\n return t('types.paymentError')\n default:\n return t('types.unknown')\n }\n }\n\n const getStatusMapping = (status: InformationRequest['status']): StatusMapping => {\n switch (status) {\n case InformationRequestStatus.PendingResponse:\n return { label: t('status.incomplete'), badgeStatus: 'info' }\n case InformationRequestStatus.PendingReview:\n return { label: t('status.underReview'), badgeStatus: 'warning' }\n default:\n return null\n }\n }\n\n const dataViewProps = useDataView({\n data: visibleRequests,\n emptyState: () => (\n <EmptyData title={t('emptyTableTitle')} description={t('emptyTableDescription')} />\n ),\n columns: [\n {\n key: 'type',\n title: t('columns.type'),\n render: request => (\n <FlexItem flexGrow={1}>\n <Text weight=\"medium\">{getTypeLabel(request.type)}</Text>\n </FlexItem>\n ),\n },\n {\n key: 'status',\n title: t('columns.status'),\n render: request => {\n const statusMapping = getStatusMapping(request.status)\n const showPayrollBlockingBadge = request.blockingPayroll\n\n if (!statusMapping && !showPayrollBlockingBadge) {\n return null\n }\n\n return (\n <Flex gap={8} alignItems=\"center\">\n {statusMapping && (\n <Badge status={statusMapping.badgeStatus}>{statusMapping.label}</Badge>\n )}\n {showPayrollBlockingBadge && (\n <Badge status=\"error\">{t('status.payrollBlocking')}</Badge>\n )}\n </Flex>\n )\n },\n },\n ],\n itemMenu: request => {\n const isPendingResponse = request.status === InformationRequestStatus.PendingResponse\n if (!isPendingResponse) {\n return null\n }\n return (\n <Button\n variant=\"secondary\"\n onClick={() => {\n onEvent(informationRequestEvents.INFORMATION_REQUEST_RESPOND, {\n requestId: request.uuid,\n })\n }}\n >\n {t('cta.respond')}\n </Button>\n )\n },\n })\n\n return (\n <Flex flexDirection=\"column\" gap={20}>\n <Flex flexDirection=\"column\" gap={2}>\n <Heading as=\"h2\" styledAs=\"h4\">\n {t('title')}\n </Heading>\n {visibleRequests.length > 0 && <Text>{t('description')}</Text>}\n </Flex>\n\n <DataView {...dataViewProps} label={t('title')} />\n </Flex>\n )\n}\n"],"names":["InformationRequestList","props","jsx","BaseComponent","Root","companyId","dictionary","onEvent","useComponentDictionary","useI18n","useTranslation","Heading","Text","Button","Badge","useComponentContext","data","useInformationRequestsGetInformationRequestsSuspense","visibleRequests","request","InformationRequestStatus","getTypeLabel","type","InformationRequestType","getStatusMapping","status","dataViewProps","useDataView","EmptyData","FlexItem","statusMapping","showPayrollBlockingBadge","jsxs","Flex","informationRequestEvents","DataView"],"mappings":"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"}
|
package/dist/components/Payroll/ConfirmWireDetails/ConfirmWireDetailsForm/ConfirmWireDetailsForm.js
CHANGED
|
@@ -4,8 +4,8 @@ import r from "zod";
|
|
|
4
4
|
import { useForm as _, FormProvider as O } from "react-hook-form";
|
|
5
5
|
import { zodResolver as T } from "@hookform/resolvers/zod";
|
|
6
6
|
import { useIsMutating as E } from "@tanstack/react-query";
|
|
7
|
-
import { useWireInRequestsSubmitMutation as
|
|
8
|
-
import { useWireInRequestsGetSuspense as
|
|
7
|
+
import { useWireInRequestsSubmitMutation as U, mutationKeyWireInRequestsSubmit as j } from "@gusto/embedded-api/react-query/wireInRequestsSubmit";
|
|
8
|
+
import { useWireInRequestsGetSuspense as B } from "@gusto/embedded-api/react-query/wireInRequestsGet";
|
|
9
9
|
import { usePayrollsListSuspense as G } from "@gusto/embedded-api/react-query/payrollsList";
|
|
10
10
|
import d from "./ConfirmWireDetailsForm.module.scss.js";
|
|
11
11
|
import { Form as H } from "../../../Common/Form/Form.js";
|
|
@@ -14,7 +14,7 @@ import { useBase as Y } from "../../../Base/useBase.js";
|
|
|
14
14
|
import { useComponentContext as S } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
|
|
15
15
|
import { useComponentDictionary as z, useI18n as g } from "../../../../i18n/I18n.js";
|
|
16
16
|
import { Flex as p, FlexItem as f } from "../../../Common/Flex/Flex.js";
|
|
17
|
-
import { payrollWireEvents as
|
|
17
|
+
import { payrollWireEvents as I } from "../../../../shared/constants.js";
|
|
18
18
|
import "classnames";
|
|
19
19
|
import { TextAreaField as V } from "../../../Common/Fields/TextAreaField/TextAreaField.js";
|
|
20
20
|
import { useDateFormatter as J } from "../../../../hooks/useDateFormatter.js";
|
|
@@ -26,7 +26,7 @@ const $ = r.object({
|
|
|
26
26
|
dateSent: r.date(),
|
|
27
27
|
bankName: r.string().min(1),
|
|
28
28
|
additionalNotes: r.string().optional()
|
|
29
|
-
}),
|
|
29
|
+
}), N = "confirm-wire-details-form", ee = (o) => ({
|
|
30
30
|
amountSent: String(o.amountSent),
|
|
31
31
|
dateSent: o.dateSent.toISOString().split("T")[0] || "",
|
|
32
32
|
bankName: o.bankName,
|
|
@@ -42,27 +42,27 @@ const oe = ({
|
|
|
42
42
|
modalContainerRef: y
|
|
43
43
|
}) => {
|
|
44
44
|
z("Payroll.ConfirmWireDetailsForm", i), g("Payroll.ConfirmWireDetailsForm");
|
|
45
|
-
const { onEvent: a, baseSubmitHandler:
|
|
45
|
+
const { onEvent: a, baseSubmitHandler: C } = Y(), { t } = F("Payroll.ConfirmWireDetailsForm"), { Heading: v, Text: b } = S(), R = J(), { data: P } = B({
|
|
46
46
|
wireInRequestUuid: o
|
|
47
|
-
}),
|
|
47
|
+
}), q = P.wireInRequest, { data: W } = G({
|
|
48
48
|
companyId: n,
|
|
49
49
|
processed: !0
|
|
50
|
-
}), l =
|
|
51
|
-
(u) => u.payrollUuid ===
|
|
50
|
+
}), l = W.payrollList?.find(
|
|
51
|
+
(u) => u.payrollUuid === q?.paymentUuid
|
|
52
52
|
), s = l?.payPeriod, c = s?.startDate && s.endDate ? R.formatPayPeriodRange(s.startDate, s.endDate) : void 0, h = l ? R.formatShortWithYear(l.checkDate) : void 0, D = _({
|
|
53
53
|
resolver: T($),
|
|
54
54
|
defaultValues: {
|
|
55
55
|
bankName: ""
|
|
56
56
|
}
|
|
57
|
-
}), { mutateAsync: k } =
|
|
58
|
-
await
|
|
59
|
-
const
|
|
57
|
+
}), { mutateAsync: k } = U(), x = async (u) => {
|
|
58
|
+
await C(u, async (w) => {
|
|
59
|
+
const L = ee(w), M = await k({
|
|
60
60
|
request: {
|
|
61
61
|
wireInRequestUuid: o,
|
|
62
|
-
|
|
62
|
+
wireInRequestUpdateRequestBody: L
|
|
63
63
|
}
|
|
64
64
|
});
|
|
65
|
-
a(
|
|
65
|
+
a(I.PAYROLL_WIRE_FORM_DONE, {
|
|
66
66
|
wireInRequest: M.wireInRequest,
|
|
67
67
|
confirmationAlert: {
|
|
68
68
|
title: c ? t("confirmationAlert.title", { payrollRange: c }) : t("confirmationAlert.emptyTitle"),
|
|
@@ -79,7 +79,7 @@ const oe = ({
|
|
|
79
79
|
/* @__PURE__ */ e(O, { ...D, children: /* @__PURE__ */ e(
|
|
80
80
|
H,
|
|
81
81
|
{
|
|
82
|
-
id:
|
|
82
|
+
id: N,
|
|
83
83
|
onSubmit: D.handleSubmit(x),
|
|
84
84
|
className: d.form,
|
|
85
85
|
children: /* @__PURE__ */ m(p, { flexDirection: "column", gap: 20, children: [
|
|
@@ -122,7 +122,7 @@ const oe = ({
|
|
|
122
122
|
}, re = ({ onEvent: o }) => {
|
|
123
123
|
g("Payroll.ConfirmWireDetailsForm");
|
|
124
124
|
const { t: n } = F("Payroll.ConfirmWireDetailsForm"), { Button: i } = S(), a = E({
|
|
125
|
-
mutationKey:
|
|
125
|
+
mutationKey: j()
|
|
126
126
|
}) > 0;
|
|
127
127
|
return /* @__PURE__ */ m(p, { gap: 12, justifyContent: "space-evenly", children: [
|
|
128
128
|
/* @__PURE__ */ e(f, { flexGrow: 1, children: /* @__PURE__ */ e(
|
|
@@ -130,7 +130,7 @@ const oe = ({
|
|
|
130
130
|
{
|
|
131
131
|
variant: "secondary",
|
|
132
132
|
onClick: () => {
|
|
133
|
-
o(
|
|
133
|
+
o(I.PAYROLL_WIRE_FORM_CANCEL);
|
|
134
134
|
},
|
|
135
135
|
isDisabled: a,
|
|
136
136
|
className: d.button,
|
|
@@ -142,7 +142,7 @@ const oe = ({
|
|
|
142
142
|
{
|
|
143
143
|
variant: "primary",
|
|
144
144
|
type: "submit",
|
|
145
|
-
form:
|
|
145
|
+
form: N,
|
|
146
146
|
isLoading: a,
|
|
147
147
|
className: d.button,
|
|
148
148
|
children: n("submitCta")
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfirmWireDetailsForm.js","sources":["../../../../../src/components/Payroll/ConfirmWireDetails/ConfirmWireDetailsForm/ConfirmWireDetailsForm.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport z from 'zod'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { useIsMutating } from '@tanstack/react-query'\nimport {\n useWireInRequestsSubmitMutation,\n mutationKeyWireInRequestsSubmit,\n} from '@gusto/embedded-api/react-query/wireInRequestsSubmit'\nimport { useWireInRequestsGetSuspense } from '@gusto/embedded-api/react-query/wireInRequestsGet'\nimport type { PutWireInRequestsWireInRequestUuidRequest } from '@gusto/embedded-api/models/operations/putwireinrequestswireinrequestuuid'\nimport { usePayrollsListSuspense } from '@gusto/embedded-api/react-query/payrollsList'\nimport styles from './ConfirmWireDetailsForm.module.scss'\nimport { Form as HtmlForm } from '@/components/Common/Form'\nimport { BaseComponent, useBase, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { Flex, FlexItem } from '@/components/Common/Flex/Flex'\nimport { payrollWireEvents, type EventType } from '@/shared/constants'\nimport { DatePickerField, NumberInputField, TextInputField } from '@/components/Common'\nimport { TextAreaField } from '@/components/Common/Fields/TextAreaField'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\n\ninterface ConfirmWireDetailsFormProps extends BaseComponentInterface<'Payroll.ConfirmWireDetailsForm'> {\n wireInId: string\n companyId: string\n modalContainerRef?: React.RefObject<HTMLDivElement | null>\n}\n\nexport const ConfirmWireDetailsFormSchema = z.object({\n amountSent: z.number().positive(),\n dateSent: z.date(),\n bankName: z.string().min(1),\n additionalNotes: z.string().optional(),\n})\n\nexport type ConfirmWireDetailsFormValues = z.infer<typeof ConfirmWireDetailsFormSchema>\n\nconst CONFIRM_WIRE_FORM_ID = 'confirm-wire-details-form'\n\nconst transformFormDataToPayload = (\n data: ConfirmWireDetailsFormValues,\n): PutWireInRequestsWireInRequestUuidRequest['requestBody'] => {\n return {\n amountSent: String(data.amountSent),\n dateSent: data.dateSent.toISOString().split('T')[0] || '',\n bankName: data.bankName,\n additionalNotes: data.additionalNotes || undefined,\n }\n}\n\nexport function ConfirmWireDetailsForm(props: ConfirmWireDetailsFormProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\nconst Root = ({\n wireInId,\n companyId,\n dictionary,\n modalContainerRef,\n}: ConfirmWireDetailsFormProps) => {\n useComponentDictionary('Payroll.ConfirmWireDetailsForm', dictionary)\n useI18n('Payroll.ConfirmWireDetailsForm')\n const { onEvent, baseSubmitHandler } = useBase()\n const { t } = useTranslation('Payroll.ConfirmWireDetailsForm')\n const { Heading, Text } = useComponentContext()\n const dateFormatter = useDateFormatter()\n const { data } = useWireInRequestsGetSuspense({\n wireInRequestUuid: wireInId,\n })\n const wireInRequest = data.wireInRequest\n\n const { data: payrollsData } = usePayrollsListSuspense({\n companyId,\n processed: true,\n })\n\n const payrollData = payrollsData.payrollList?.find(\n payroll => payroll.payrollUuid === wireInRequest?.paymentUuid,\n )\n const payPeriod = payrollData?.payPeriod\n const payPeriodRange =\n payPeriod?.startDate && payPeriod.endDate\n ? dateFormatter.formatPayPeriodRange(payPeriod.startDate, payPeriod.endDate)\n : undefined\n\n const checkDate = payrollData\n ? dateFormatter.formatShortWithYear(payrollData.checkDate)\n : undefined\n\n const formHandlers = useForm<ConfirmWireDetailsFormValues>({\n resolver: zodResolver(ConfirmWireDetailsFormSchema),\n defaultValues: {\n bankName: '',\n },\n })\n\n const { mutateAsync: submitWireInRequest } = useWireInRequestsSubmitMutation()\n\n const onSubmit = async (data: ConfirmWireDetailsFormValues) => {\n await baseSubmitHandler(data, async innerData => {\n const payload = transformFormDataToPayload(innerData)\n const response = await submitWireInRequest({\n request: {\n wireInRequestUuid: wireInId,\n requestBody: payload,\n },\n })\n onEvent(payrollWireEvents.PAYROLL_WIRE_FORM_DONE, {\n wireInRequest: response.wireInRequest,\n confirmationAlert: {\n title: payPeriodRange\n ? t('confirmationAlert.title', { payrollRange: payPeriodRange })\n : t('confirmationAlert.emptyTitle'),\n content: checkDate ? (\n <Text>{t('confirmationAlert.content', { checkDate })}</Text>\n ) : undefined,\n },\n })\n })\n }\n\n return (\n <Flex flexDirection=\"column\" gap={24}>\n <FlexItem>\n <Heading as=\"h2\">\n <Trans i18nKey=\"title\" t={t} values={{ payrollRange: payPeriodRange }} />\n </Heading>\n <Text>{t('description')}</Text>\n </FlexItem>\n\n <FormProvider {...formHandlers}>\n <HtmlForm\n id={CONFIRM_WIRE_FORM_ID}\n onSubmit={formHandlers.handleSubmit(onSubmit)}\n className={styles.form}\n >\n <Flex flexDirection=\"column\" gap={20}>\n <NumberInputField\n name=\"amountSent\"\n label={t('amountLabel')}\n isRequired\n format=\"currency\"\n errorMessage={t('validations.amount')}\n />\n <DatePickerField\n name=\"dateSent\"\n label={t('dateLabel')}\n isRequired\n errorMessage={t('validations.date')}\n portalContainer={modalContainerRef?.current || undefined}\n />\n <TextInputField\n name=\"bankName\"\n label={t('bankNameLabel')}\n isRequired\n description={t('bankNameDescription')}\n placeholder={t('bankNamePlaceholder')}\n errorMessage={t('validations.bankName')}\n />\n <TextAreaField name=\"additionalNotes\" label={t('notesLabel')} rows={3} />\n </Flex>\n </HtmlForm>\n </FormProvider>\n </Flex>\n )\n}\n\nconst Footer = ({ onEvent }: { onEvent: OnEventType<EventType, unknown> }) => {\n useI18n('Payroll.ConfirmWireDetailsForm')\n const { t } = useTranslation('Payroll.ConfirmWireDetailsForm')\n const { Button } = useComponentContext()\n const isMutating = useIsMutating({\n mutationKey: mutationKeyWireInRequestsSubmit(),\n })\n const isPending = isMutating > 0\n\n return (\n <Flex gap={12} justifyContent=\"space-evenly\">\n <FlexItem flexGrow={1}>\n <Button\n variant=\"secondary\"\n onClick={() => {\n onEvent(payrollWireEvents.PAYROLL_WIRE_FORM_CANCEL)\n }}\n isDisabled={isPending}\n className={styles.button}\n >\n {t('cancelCta')}\n </Button>\n </FlexItem>\n <FlexItem flexGrow={1}>\n <Button\n variant=\"primary\"\n type=\"submit\"\n form={CONFIRM_WIRE_FORM_ID}\n isLoading={isPending}\n className={styles.button}\n >\n {t('submitCta')}\n </Button>\n </FlexItem>\n </Flex>\n )\n}\nConfirmWireDetailsForm.Footer = Footer\n"],"names":["ConfirmWireDetailsFormSchema","z","CONFIRM_WIRE_FORM_ID","transformFormDataToPayload","data","ConfirmWireDetailsForm","props","jsx","BaseComponent","Root","wireInId","companyId","dictionary","modalContainerRef","useComponentDictionary","useI18n","onEvent","baseSubmitHandler","useBase","useTranslation","Heading","Text","useComponentContext","dateFormatter","useDateFormatter","useWireInRequestsGetSuspense","wireInRequest","payrollsData","usePayrollsListSuspense","payrollData","payroll","payPeriod","payPeriodRange","checkDate","formHandlers","useForm","zodResolver","submitWireInRequest","useWireInRequestsSubmitMutation","onSubmit","innerData","payload","response","payrollWireEvents","jsxs","Flex","FlexItem","Trans","FormProvider","HtmlForm","styles","NumberInputField","DatePickerField","TextInputField","TextAreaField","Footer","t","Button","isPending","useIsMutating","mutationKeyWireInRequestsSubmit"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ConfirmWireDetailsForm.js","sources":["../../../../../src/components/Payroll/ConfirmWireDetails/ConfirmWireDetailsForm/ConfirmWireDetailsForm.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport z from 'zod'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { useIsMutating } from '@tanstack/react-query'\nimport {\n useWireInRequestsSubmitMutation,\n mutationKeyWireInRequestsSubmit,\n} from '@gusto/embedded-api/react-query/wireInRequestsSubmit'\nimport { useWireInRequestsGetSuspense } from '@gusto/embedded-api/react-query/wireInRequestsGet'\nimport type { PutWireInRequestsWireInRequestUuidRequest } from '@gusto/embedded-api/models/operations/putwireinrequestswireinrequestuuid'\nimport { usePayrollsListSuspense } from '@gusto/embedded-api/react-query/payrollsList'\nimport styles from './ConfirmWireDetailsForm.module.scss'\nimport { Form as HtmlForm } from '@/components/Common/Form'\nimport { BaseComponent, useBase, type BaseComponentInterface } from '@/components/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { Flex, FlexItem } from '@/components/Common/Flex/Flex'\nimport { payrollWireEvents, type EventType } from '@/shared/constants'\nimport { DatePickerField, NumberInputField, TextInputField } from '@/components/Common'\nimport { TextAreaField } from '@/components/Common/Fields/TextAreaField'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\n\ninterface ConfirmWireDetailsFormProps extends BaseComponentInterface<'Payroll.ConfirmWireDetailsForm'> {\n wireInId: string\n companyId: string\n modalContainerRef?: React.RefObject<HTMLDivElement | null>\n}\n\nexport const ConfirmWireDetailsFormSchema = z.object({\n amountSent: z.number().positive(),\n dateSent: z.date(),\n bankName: z.string().min(1),\n additionalNotes: z.string().optional(),\n})\n\nexport type ConfirmWireDetailsFormValues = z.infer<typeof ConfirmWireDetailsFormSchema>\n\nconst CONFIRM_WIRE_FORM_ID = 'confirm-wire-details-form'\n\nconst transformFormDataToPayload = (\n data: ConfirmWireDetailsFormValues,\n): PutWireInRequestsWireInRequestUuidRequest['wireInRequestUpdateRequestBody'] => {\n return {\n amountSent: String(data.amountSent),\n dateSent: data.dateSent.toISOString().split('T')[0] || '',\n bankName: data.bankName,\n additionalNotes: data.additionalNotes || undefined,\n }\n}\n\nexport function ConfirmWireDetailsForm(props: ConfirmWireDetailsFormProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\nconst Root = ({\n wireInId,\n companyId,\n dictionary,\n modalContainerRef,\n}: ConfirmWireDetailsFormProps) => {\n useComponentDictionary('Payroll.ConfirmWireDetailsForm', dictionary)\n useI18n('Payroll.ConfirmWireDetailsForm')\n const { onEvent, baseSubmitHandler } = useBase()\n const { t } = useTranslation('Payroll.ConfirmWireDetailsForm')\n const { Heading, Text } = useComponentContext()\n const dateFormatter = useDateFormatter()\n const { data } = useWireInRequestsGetSuspense({\n wireInRequestUuid: wireInId,\n })\n const wireInRequest = data.wireInRequest\n\n const { data: payrollsData } = usePayrollsListSuspense({\n companyId,\n processed: true,\n })\n\n const payrollData = payrollsData.payrollList?.find(\n payroll => payroll.payrollUuid === wireInRequest?.paymentUuid,\n )\n const payPeriod = payrollData?.payPeriod\n const payPeriodRange =\n payPeriod?.startDate && payPeriod.endDate\n ? dateFormatter.formatPayPeriodRange(payPeriod.startDate, payPeriod.endDate)\n : undefined\n\n const checkDate = payrollData\n ? dateFormatter.formatShortWithYear(payrollData.checkDate)\n : undefined\n\n const formHandlers = useForm<ConfirmWireDetailsFormValues>({\n resolver: zodResolver(ConfirmWireDetailsFormSchema),\n defaultValues: {\n bankName: '',\n },\n })\n\n const { mutateAsync: submitWireInRequest } = useWireInRequestsSubmitMutation()\n\n const onSubmit = async (data: ConfirmWireDetailsFormValues) => {\n await baseSubmitHandler(data, async innerData => {\n const payload = transformFormDataToPayload(innerData)\n const response = await submitWireInRequest({\n request: {\n wireInRequestUuid: wireInId,\n wireInRequestUpdateRequestBody: payload,\n },\n })\n onEvent(payrollWireEvents.PAYROLL_WIRE_FORM_DONE, {\n wireInRequest: response.wireInRequest,\n confirmationAlert: {\n title: payPeriodRange\n ? t('confirmationAlert.title', { payrollRange: payPeriodRange })\n : t('confirmationAlert.emptyTitle'),\n content: checkDate ? (\n <Text>{t('confirmationAlert.content', { checkDate })}</Text>\n ) : undefined,\n },\n })\n })\n }\n\n return (\n <Flex flexDirection=\"column\" gap={24}>\n <FlexItem>\n <Heading as=\"h2\">\n <Trans i18nKey=\"title\" t={t} values={{ payrollRange: payPeriodRange }} />\n </Heading>\n <Text>{t('description')}</Text>\n </FlexItem>\n\n <FormProvider {...formHandlers}>\n <HtmlForm\n id={CONFIRM_WIRE_FORM_ID}\n onSubmit={formHandlers.handleSubmit(onSubmit)}\n className={styles.form}\n >\n <Flex flexDirection=\"column\" gap={20}>\n <NumberInputField\n name=\"amountSent\"\n label={t('amountLabel')}\n isRequired\n format=\"currency\"\n errorMessage={t('validations.amount')}\n />\n <DatePickerField\n name=\"dateSent\"\n label={t('dateLabel')}\n isRequired\n errorMessage={t('validations.date')}\n portalContainer={modalContainerRef?.current || undefined}\n />\n <TextInputField\n name=\"bankName\"\n label={t('bankNameLabel')}\n isRequired\n description={t('bankNameDescription')}\n placeholder={t('bankNamePlaceholder')}\n errorMessage={t('validations.bankName')}\n />\n <TextAreaField name=\"additionalNotes\" label={t('notesLabel')} rows={3} />\n </Flex>\n </HtmlForm>\n </FormProvider>\n </Flex>\n )\n}\n\nconst Footer = ({ onEvent }: { onEvent: OnEventType<EventType, unknown> }) => {\n useI18n('Payroll.ConfirmWireDetailsForm')\n const { t } = useTranslation('Payroll.ConfirmWireDetailsForm')\n const { Button } = useComponentContext()\n const isMutating = useIsMutating({\n mutationKey: mutationKeyWireInRequestsSubmit(),\n })\n const isPending = isMutating > 0\n\n return (\n <Flex gap={12} justifyContent=\"space-evenly\">\n <FlexItem flexGrow={1}>\n <Button\n variant=\"secondary\"\n onClick={() => {\n onEvent(payrollWireEvents.PAYROLL_WIRE_FORM_CANCEL)\n }}\n isDisabled={isPending}\n className={styles.button}\n >\n {t('cancelCta')}\n </Button>\n </FlexItem>\n <FlexItem flexGrow={1}>\n <Button\n variant=\"primary\"\n type=\"submit\"\n form={CONFIRM_WIRE_FORM_ID}\n isLoading={isPending}\n className={styles.button}\n >\n {t('submitCta')}\n </Button>\n </FlexItem>\n </Flex>\n )\n}\nConfirmWireDetailsForm.Footer = Footer\n"],"names":["ConfirmWireDetailsFormSchema","z","CONFIRM_WIRE_FORM_ID","transformFormDataToPayload","data","ConfirmWireDetailsForm","props","jsx","BaseComponent","Root","wireInId","companyId","dictionary","modalContainerRef","useComponentDictionary","useI18n","onEvent","baseSubmitHandler","useBase","useTranslation","Heading","Text","useComponentContext","dateFormatter","useDateFormatter","useWireInRequestsGetSuspense","wireInRequest","payrollsData","usePayrollsListSuspense","payrollData","payroll","payPeriod","payPeriodRange","checkDate","formHandlers","useForm","zodResolver","submitWireInRequest","useWireInRequestsSubmitMutation","onSubmit","innerData","payload","response","payrollWireEvents","jsxs","Flex","FlexItem","Trans","FormProvider","HtmlForm","styles","NumberInputField","DatePickerField","TextInputField","TextAreaField","Footer","t","Button","isPending","useIsMutating","mutationKeyWireInRequestsSubmit"],"mappings":"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"}
|
package/dist/components/Payroll/Dismissal/DismissalPayPeriodSelection/DismissalPayPeriodSelection.js
CHANGED
|
@@ -2,10 +2,10 @@ import { jsx as d } from "react/jsx-runtime";
|
|
|
2
2
|
import { useEffect as A, useMemo as y, useState as O } from "react";
|
|
3
3
|
import { usePaySchedulesGetUnprocessedTerminationPeriodsSuspense as b } from "@gusto/embedded-api/react-query/paySchedulesGetUnprocessedTerminationPeriods";
|
|
4
4
|
import { usePayrollsCreateOffCycleMutation as g } from "@gusto/embedded-api/react-query/payrollsCreateOffCycle";
|
|
5
|
-
import { OffCycleReason as
|
|
5
|
+
import { OffCycleReason as T } from "@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls";
|
|
6
6
|
import { RFCDate as D } from "@gusto/embedded-api/types/rfcdate";
|
|
7
|
-
import { useTranslation as
|
|
8
|
-
import { DismissalPayPeriodSelectionPresentation as
|
|
7
|
+
import { useTranslation as K } from "react-i18next";
|
|
8
|
+
import { DismissalPayPeriodSelectionPresentation as L } from "./DismissalPayPeriodSelectionPresentation.js";
|
|
9
9
|
import { BaseComponent as M } from "../../../Base/Base.js";
|
|
10
10
|
import { useBase as $ } from "../../../Base/useBase.js";
|
|
11
11
|
import { componentEvents as p } from "../../../../shared/constants.js";
|
|
@@ -18,11 +18,11 @@ function oe(t) {
|
|
|
18
18
|
const S = (t) => `${t.startDate}__${t.endDate}`;
|
|
19
19
|
function Y({ companyId: t, employeeId: r, payrollId: n, dictionary: E }) {
|
|
20
20
|
q("Payroll.Dismissal", E), x("Payroll.Dismissal");
|
|
21
|
-
const { t: i } =
|
|
21
|
+
const { t: i } = K("Payroll.Dismissal"), { onEvent: l, baseSubmitHandler: C } = $(), { data: f } = b({ companyId: t }), { mutateAsync: w, isPending: U } = g(), v = !!n && !!r;
|
|
22
22
|
A(() => {
|
|
23
23
|
n && r && l(p.DISMISSAL_PAY_PERIOD_SELECTED, { payrollUuid: n });
|
|
24
24
|
}, [n, r, l]);
|
|
25
|
-
const m = y(() => (f.
|
|
25
|
+
const m = y(() => (f.unprocessedTerminationPayPeriods ?? []).filter((o) => !r || o.employeeUuid === r).filter(
|
|
26
26
|
(o) => !!o.startDate && !!o.endDate && !!o.employeeUuid
|
|
27
27
|
), [f, r]), c = y(() => m.map((e) => {
|
|
28
28
|
const o = N(e.startDate, e.endDate), a = e.employeeName ? `${o} (${e.employeeName})` : o;
|
|
@@ -42,7 +42,7 @@ function Y({ companyId: t, employeeId: r, payrollId: n, dictionary: E }) {
|
|
|
42
42
|
companyId: t,
|
|
43
43
|
requestBody: {
|
|
44
44
|
offCycle: !0,
|
|
45
|
-
offCycleReason:
|
|
45
|
+
offCycleReason: T.DismissedEmployee,
|
|
46
46
|
startDate: new D(e.startDate),
|
|
47
47
|
endDate: new D(e.endDate),
|
|
48
48
|
employeeUuids: [o]
|
|
@@ -55,7 +55,7 @@ function Y({ companyId: t, employeeId: r, payrollId: n, dictionary: E }) {
|
|
|
55
55
|
});
|
|
56
56
|
};
|
|
57
57
|
return v ? null : /* @__PURE__ */ d(
|
|
58
|
-
|
|
58
|
+
L,
|
|
59
59
|
{
|
|
60
60
|
payPeriodOptions: c,
|
|
61
61
|
selectedPeriodKey: s,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DismissalPayPeriodSelection.js","sources":["../../../../../src/components/Payroll/Dismissal/DismissalPayPeriodSelection/DismissalPayPeriodSelection.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react'\nimport { usePaySchedulesGetUnprocessedTerminationPeriodsSuspense } from '@gusto/embedded-api/react-query/paySchedulesGetUnprocessedTerminationPeriods'\nimport { usePayrollsCreateOffCycleMutation } from '@gusto/embedded-api/react-query/payrollsCreateOffCycle'\nimport type { UnprocessedTerminationPayPeriod } from '@gusto/embedded-api/models/components/unprocessedterminationpayperiod'\nimport { OffCycleReason } from '@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls'\nimport { RFCDate } from '@gusto/embedded-api/types/rfcdate'\nimport { useTranslation } from 'react-i18next'\nimport { DismissalPayPeriodSelectionPresentation } from './DismissalPayPeriodSelectionPresentation'\nimport { BaseComponent } from '@/components/Base/Base'\nimport type { BaseComponentInterface } from '@/components/Base/Base'\nimport { useBase } from '@/components/Base/useBase'\nimport { componentEvents } from '@/shared/constants'\nimport { SDKInternalError } from '@/types/sdkError'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { formatPayPeriodRange } from '@/helpers/dateFormatting'\nimport type { SelectOption } from '@/components/Common/UI/Select/SelectTypes'\n\nexport interface DismissalPayPeriodSelectionProps extends BaseComponentInterface<'Payroll.Dismissal'> {\n companyId: string\n employeeId?: string\n payrollId?: string\n}\n\nexport function DismissalPayPeriodSelection(props: DismissalPayPeriodSelectionProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props} />\n </BaseComponent>\n )\n}\n\ntype RequiredPayPeriod = UnprocessedTerminationPayPeriod &\n Required<Pick<UnprocessedTerminationPayPeriod, 'startDate' | 'endDate' | 'employeeUuid'>>\n\nconst payPeriodKey = (period: RequiredPayPeriod) => `${period.startDate}__${period.endDate}`\n\nfunction Root({ companyId, employeeId, payrollId, dictionary }: DismissalPayPeriodSelectionProps) {\n useComponentDictionary('Payroll.Dismissal', dictionary)\n useI18n('Payroll.Dismissal')\n const { t } = useTranslation('Payroll.Dismissal')\n const { onEvent, baseSubmitHandler } = useBase()\n\n const { data } = usePaySchedulesGetUnprocessedTerminationPeriodsSuspense({ companyId })\n const { mutateAsync: createOffCyclePayroll, isPending } = usePayrollsCreateOffCycleMutation()\n\n const shouldAutoAdvance = Boolean(payrollId) && Boolean(employeeId)\n\n useEffect(() => {\n if (payrollId && employeeId) {\n onEvent(componentEvents.DISMISSAL_PAY_PERIOD_SELECTED, { payrollUuid: payrollId })\n }\n }, [payrollId, employeeId, onEvent])\n\n const employeePayPeriods: RequiredPayPeriod[] = useMemo(() => {\n const allPeriods = data.
|
|
1
|
+
{"version":3,"file":"DismissalPayPeriodSelection.js","sources":["../../../../../src/components/Payroll/Dismissal/DismissalPayPeriodSelection/DismissalPayPeriodSelection.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react'\nimport { usePaySchedulesGetUnprocessedTerminationPeriodsSuspense } from '@gusto/embedded-api/react-query/paySchedulesGetUnprocessedTerminationPeriods'\nimport { usePayrollsCreateOffCycleMutation } from '@gusto/embedded-api/react-query/payrollsCreateOffCycle'\nimport type { UnprocessedTerminationPayPeriod } from '@gusto/embedded-api/models/components/unprocessedterminationpayperiod'\nimport { OffCycleReason } from '@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls'\nimport { RFCDate } from '@gusto/embedded-api/types/rfcdate'\nimport { useTranslation } from 'react-i18next'\nimport { DismissalPayPeriodSelectionPresentation } from './DismissalPayPeriodSelectionPresentation'\nimport { BaseComponent } from '@/components/Base/Base'\nimport type { BaseComponentInterface } from '@/components/Base/Base'\nimport { useBase } from '@/components/Base/useBase'\nimport { componentEvents } from '@/shared/constants'\nimport { SDKInternalError } from '@/types/sdkError'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { formatPayPeriodRange } from '@/helpers/dateFormatting'\nimport type { SelectOption } from '@/components/Common/UI/Select/SelectTypes'\n\nexport interface DismissalPayPeriodSelectionProps extends BaseComponentInterface<'Payroll.Dismissal'> {\n companyId: string\n employeeId?: string\n payrollId?: string\n}\n\nexport function DismissalPayPeriodSelection(props: DismissalPayPeriodSelectionProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props} />\n </BaseComponent>\n )\n}\n\ntype RequiredPayPeriod = UnprocessedTerminationPayPeriod &\n Required<Pick<UnprocessedTerminationPayPeriod, 'startDate' | 'endDate' | 'employeeUuid'>>\n\nconst payPeriodKey = (period: RequiredPayPeriod) => `${period.startDate}__${period.endDate}`\n\nfunction Root({ companyId, employeeId, payrollId, dictionary }: DismissalPayPeriodSelectionProps) {\n useComponentDictionary('Payroll.Dismissal', dictionary)\n useI18n('Payroll.Dismissal')\n const { t } = useTranslation('Payroll.Dismissal')\n const { onEvent, baseSubmitHandler } = useBase()\n\n const { data } = usePaySchedulesGetUnprocessedTerminationPeriodsSuspense({ companyId })\n const { mutateAsync: createOffCyclePayroll, isPending } = usePayrollsCreateOffCycleMutation()\n\n const shouldAutoAdvance = Boolean(payrollId) && Boolean(employeeId)\n\n useEffect(() => {\n if (payrollId && employeeId) {\n onEvent(componentEvents.DISMISSAL_PAY_PERIOD_SELECTED, { payrollUuid: payrollId })\n }\n }, [payrollId, employeeId, onEvent])\n\n const employeePayPeriods: RequiredPayPeriod[] = useMemo(() => {\n const allPeriods = data.unprocessedTerminationPayPeriods ?? []\n return allPeriods\n .filter(period => !employeeId || period.employeeUuid === employeeId)\n .filter(\n (period): period is RequiredPayPeriod =>\n Boolean(period.startDate) && Boolean(period.endDate) && Boolean(period.employeeUuid),\n )\n }, [data, employeeId])\n\n const payPeriodOptions: SelectOption[] = useMemo(() => {\n return employeePayPeriods.map(period => {\n const dateRange = formatPayPeriodRange(period.startDate, period.endDate)\n const label = period.employeeName ? `${dateRange} (${period.employeeName})` : dateRange\n return {\n value: payPeriodKey(period),\n label,\n }\n })\n }, [employeePayPeriods])\n\n const initialSelection = payPeriodOptions.length === 1 ? payPeriodOptions[0]!.value : undefined\n const [selectedPeriodKey, setSelectedPeriodKey] = useState(initialSelection)\n\n const handleSubmit = async () => {\n await baseSubmitHandler({ selectedPeriodKey }, async () => {\n if (selectedPeriodKey === undefined) {\n throw new SDKInternalError(t('errors.noPayPeriodSelected'))\n }\n\n const period = employeePayPeriods.find(p => payPeriodKey(p) === selectedPeriodKey)\n if (!period) {\n throw new SDKInternalError(t('errors.invalidPayPeriod'))\n }\n\n const resolvedEmployeeId = employeeId ?? period.employeeUuid\n\n const response = await createOffCyclePayroll({\n request: {\n companyId,\n requestBody: {\n offCycle: true,\n offCycleReason: OffCycleReason.DismissedEmployee,\n startDate: new RFCDate(period.startDate),\n endDate: new RFCDate(period.endDate),\n employeeUuids: [resolvedEmployeeId],\n },\n },\n })\n\n const payrollUuid =\n response.payrollUnprocessed?.payrollUuid ?? response.payrollUnprocessed?.uuid\n\n if (!payrollUuid) {\n throw new SDKInternalError(t('errors.missingPayrollId'))\n }\n\n onEvent(componentEvents.DISMISSAL_PAY_PERIOD_SELECTED, { payrollUuid })\n })\n }\n\n if (shouldAutoAdvance) {\n return null\n }\n\n return (\n <DismissalPayPeriodSelectionPresentation\n payPeriodOptions={payPeriodOptions}\n selectedPeriodKey={selectedPeriodKey}\n onSelectPeriod={setSelectedPeriodKey}\n onSubmit={handleSubmit}\n isPending={isPending}\n />\n )\n}\n"],"names":["DismissalPayPeriodSelection","props","jsx","BaseComponent","Root","payPeriodKey","period","companyId","employeeId","payrollId","dictionary","useComponentDictionary","useI18n","t","useTranslation","onEvent","baseSubmitHandler","useBase","data","usePaySchedulesGetUnprocessedTerminationPeriodsSuspense","createOffCyclePayroll","isPending","usePayrollsCreateOffCycleMutation","shouldAutoAdvance","useEffect","componentEvents","employeePayPeriods","useMemo","payPeriodOptions","dateRange","formatPayPeriodRange","label","initialSelection","selectedPeriodKey","setSelectedPeriodKey","useState","handleSubmit","SDKInternalError","p","resolvedEmployeeId","response","OffCycleReason","RFCDate","payrollUuid","DismissalPayPeriodSelectionPresentation"],"mappings":"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"}
|
|
@@ -15,7 +15,7 @@ import { useBase as H } from "../../Base/useBase.js";
|
|
|
15
15
|
import "@gusto/embedded-api/models/errors/apierror";
|
|
16
16
|
import "@gusto/embedded-api/models/errors/gustoembeddederror";
|
|
17
17
|
import "@gusto/embedded-api/models/errors/sdkvalidationerror";
|
|
18
|
-
import "@gusto/embedded-api/models/errors/
|
|
18
|
+
import "@gusto/embedded-api/models/errors/unprocessableentityerror";
|
|
19
19
|
import "@gusto/embedded-api/models/errors/httpclienterrors";
|
|
20
20
|
import { formatNumberAsCurrency as L } from "../../../helpers/formattedStrings.js";
|
|
21
21
|
import { useComponentContext as V } from "../../../contexts/ComponentAdapter/useComponentContext.js";
|
package/dist/components/Payroll/OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation.js
CHANGED
|
@@ -2,8 +2,8 @@ import { jsxs as i, jsx as r } from "react/jsx-runtime";
|
|
|
2
2
|
import { useTranslation as l } from "react-i18next";
|
|
3
3
|
import a from "./OffCyclePayPeriodDateFormPresentation.module.scss.js";
|
|
4
4
|
import { useI18n as o } from "../../../i18n/I18n.js";
|
|
5
|
-
import "../../../shared/constants.js";
|
|
6
5
|
import "classnames";
|
|
6
|
+
import "../../../shared/constants.js";
|
|
7
7
|
import { CheckboxField as c } from "../../Common/Fields/CheckboxField/CheckboxField.js";
|
|
8
8
|
import { DatePickerField as t } from "../../Common/Fields/DatePickerField/DatePickerField.js";
|
|
9
9
|
function h() {
|
package/dist/components/Payroll/OffCycleReasonSelection/OffCycleReasonSelectionPresentation.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx as r } from "react/jsx-runtime";
|
|
2
2
|
import { useMemo as n } from "react";
|
|
3
3
|
import { useTranslation as s } from "react-i18next";
|
|
4
|
-
import "../../../shared/constants.js";
|
|
5
4
|
import "classnames";
|
|
5
|
+
import "../../../shared/constants.js";
|
|
6
6
|
import { RadioGroupField as l } from "../../Common/Fields/RadioGroupField/RadioGroupField.js";
|
|
7
7
|
function b({
|
|
8
8
|
name: e,
|
|
@@ -5,8 +5,8 @@ import { useTranslation as L } from "react-i18next";
|
|
|
5
5
|
import { WithholdingPayPeriod as N } from "@gusto/embedded-api/models/operations/postv1companiescompanyidpayrolls";
|
|
6
6
|
import { WITHHOLDING_PAY_PERIOD_I18N_KEY as p } from "../OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes.js";
|
|
7
7
|
import l from "./OffCycleTaxWithholdingModal.module.scss.js";
|
|
8
|
-
import "../../../shared/constants.js";
|
|
9
8
|
import "classnames";
|
|
9
|
+
import "../../../shared/constants.js";
|
|
10
10
|
import { ActionsLayout as T } from "../../Common/ActionsLayout/ActionsLayout.js";
|
|
11
11
|
import { useComponentContext as W } from "../../../contexts/ComponentAdapter/useComponentContext.js";
|
|
12
12
|
import { useI18n as w } from "../../../i18n/I18n.js";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as o, jsxs as m } from "react/jsx-runtime";
|
|
2
|
-
import { useState as
|
|
2
|
+
import { useState as L, useCallback as d } from "react";
|
|
3
3
|
import { useTranslation as N } from "react-i18next";
|
|
4
4
|
import k from "classnames";
|
|
5
5
|
import { usePayrollsGetBlockersSuspense as O } from "@gusto/embedded-api/react-query/payrollsGetBlockers";
|
|
@@ -23,7 +23,7 @@ function be(s) {
|
|
|
23
23
|
}
|
|
24
24
|
function ee({ className: s, companyId: n, dictionary: B, onEvent: u }) {
|
|
25
25
|
z("Payroll.PayrollBlocker", B), J("Payroll.PayrollBlocker");
|
|
26
|
-
const { t: r } = N("Payroll.PayrollBlocker"), { Button: D, Text: i, Heading: b, Alert: g } = M(), [x, f] =
|
|
26
|
+
const { t: r } = N("Payroll.PayrollBlocker"), { Button: D, Text: i, Heading: b, Alert: g } = M(), [x, f] = L({
|
|
27
27
|
id: 0,
|
|
28
28
|
alerts: []
|
|
29
29
|
}), E = d((e) => {
|
|
@@ -48,21 +48,21 @@ function ee({ className: s, companyId: n, dictionary: B, onEvent: u }) {
|
|
|
48
48
|
}), { data: q } = F({
|
|
49
49
|
companyUuid: n
|
|
50
50
|
}), y = (A.payrollBlockers ?? []).map((e) => {
|
|
51
|
-
const t = e.key, l = G(t),
|
|
52
|
-
defaultValue: t.replace(/_/g, " ").replace(/\b\w/g, (
|
|
53
|
-
}),
|
|
51
|
+
const t = e.key, l = G(t), I = r(l.titleKey, {
|
|
52
|
+
defaultValue: t.replace(/_/g, " ").replace(/\b\w/g, (_) => _.toUpperCase())
|
|
53
|
+
}), U = r(l.descriptionKey, {
|
|
54
54
|
defaultValue: e.message || r("defaultBlockerDescription")
|
|
55
55
|
});
|
|
56
56
|
return {
|
|
57
57
|
id: t,
|
|
58
|
-
title:
|
|
59
|
-
description:
|
|
58
|
+
title: I,
|
|
59
|
+
description: U
|
|
60
60
|
};
|
|
61
|
-
}), P = S.
|
|
61
|
+
}), P = S.recoveryCases ?? [], w = q.informationRequests ?? [], h = P.some(
|
|
62
62
|
(e) => e.status !== "recovered"
|
|
63
63
|
), C = w.some(
|
|
64
64
|
(e) => e.status !== K.Approved
|
|
65
|
-
),
|
|
65
|
+
), T = Y({
|
|
66
66
|
data: y,
|
|
67
67
|
columns: [
|
|
68
68
|
{
|
|
@@ -96,7 +96,7 @@ function ee({ className: s, companyId: n, dictionary: B, onEvent: u }) {
|
|
|
96
96
|
)),
|
|
97
97
|
R && /* @__PURE__ */ m(a, { flexDirection: "column", gap: 20, children: [
|
|
98
98
|
/* @__PURE__ */ o(b, { as: "h2", styledAs: "h4", children: r("blockersListTitle") }),
|
|
99
|
-
/* @__PURE__ */ o(Q, { ...
|
|
99
|
+
/* @__PURE__ */ o(Q, { ...T, label: r("blockersListTitle") })
|
|
100
100
|
] }),
|
|
101
101
|
h && /* @__PURE__ */ o(W, { companyId: n, onEvent: p }),
|
|
102
102
|
C && /* @__PURE__ */ o(Z, { companyId: n, withAlert: !1, onEvent: p })
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PayrollBlockerList.js","sources":["../../../../../src/components/Payroll/PayrollBlocker/components/PayrollBlockerList.tsx"],"sourcesContent":["import { useState, useCallback } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport { usePayrollsGetBlockersSuspense } from '@gusto/embedded-api/react-query/payrollsGetBlockers'\nimport { useRecoveryCasesGetSuspense } from '@gusto/embedded-api/react-query/recoveryCasesGet'\nimport { useInformationRequestsGetInformationRequestsSuspense } from '@gusto/embedded-api/react-query/informationRequestsGetInformationRequests'\nimport { InformationRequestStatus } from '@gusto/embedded-api/models/components/informationrequest'\nimport { getBlockerTranslationKeys } from '../payrollHelpers'\nimport styles from './PayrollBlockerList.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { Flex, FlexItem } from '@/components/Common'\nimport { DataView } from '@/components/Common/DataView/DataView'\nimport { useDataView } from '@/components/Common/DataView/useDataView'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { RecoveryCases } from '@/components/Payroll/RecoveryCases'\nimport { InformationRequestsFlow } from '@/components/InformationRequests'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { informationRequestEvents, recoveryCasesEvents, type EventType } from '@/shared/constants'\n\ntype ResponseAlertType = 'recoveryCaseResubmitted' | 'informationRequestResponded'\n\ninterface ResponseAlert {\n id: number\n type: ResponseAlertType\n}\n\ninterface ResponseAlertState {\n id: number\n alerts: ResponseAlert[]\n}\n\ninterface PayrollBlocker {\n id: string\n title: string\n description: string\n action?: {\n label: string\n onClick: () => void\n }\n}\n\ninterface PayrollBlockerListProps extends BaseComponentInterface<'Payroll.PayrollBlocker'> {\n companyId: string\n}\n\n/**\n * PayrollBlockerList - DataView-based component displaying payroll blockers\n * Shows each blocker with individual resolution buttons\n * Also displays recovery cases and information requests sections when applicable\n */\nexport function PayrollBlockerList(props: PayrollBlockerListProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\nfunction Root({ className, companyId, dictionary, onEvent }: PayrollBlockerListProps) {\n useComponentDictionary('Payroll.PayrollBlocker', dictionary)\n useI18n('Payroll.PayrollBlocker')\n const { t } = useTranslation('Payroll.PayrollBlocker')\n const { Button, Text, Heading, Alert } = useComponentContext()\n\n const [alertState, setAlertState] = useState<ResponseAlertState>({\n id: 0,\n alerts: [],\n })\n\n const handleDismissAlert = useCallback((alertId: number) => {\n setAlertState(prev => ({\n ...prev,\n alerts: prev.alerts.filter(alert => alert.id !== alertId),\n }))\n }, [])\n\n const addAlert = useCallback((alertType: ResponseAlertType) => {\n setAlertState(prev => ({\n id: prev.id + 1,\n alerts: [{ id: prev.id, type: alertType }, ...prev.alerts],\n }))\n }, [])\n\n const handleEvent = useCallback(\n (type: EventType, data?: unknown) => {\n if (type === recoveryCasesEvents.RECOVERY_CASE_RESUBMIT_DONE) {\n addAlert('recoveryCaseResubmitted')\n }\n\n if (type === informationRequestEvents.INFORMATION_REQUEST_FORM_DONE) {\n addAlert('informationRequestResponded')\n }\n\n onEvent(type, data)\n },\n [onEvent, addAlert],\n )\n\n const { data: blockersData } = usePayrollsGetBlockersSuspense({\n companyUuid: companyId,\n })\n\n const { data: recoveryCasesData } = useRecoveryCasesGetSuspense({\n companyUuid: companyId,\n })\n\n const { data: informationRequestsData } = useInformationRequestsGetInformationRequestsSuspense({\n companyUuid: companyId,\n })\n\n const payrollBlockerList = blockersData.payrollBlockers ?? []\n const blockers: PayrollBlocker[] = payrollBlockerList.map(blocker => {\n const blockerKey = blocker.key\n const translationKeys = getBlockerTranslationKeys(blockerKey)\n\n const title = t(translationKeys.titleKey, {\n defaultValue: blockerKey\n .replace(/_/g, ' ')\n .replace(/\\b\\w/g, (letter: string) => letter.toUpperCase()),\n })\n\n const description = t(translationKeys.descriptionKey, {\n defaultValue: blocker.message || t('defaultBlockerDescription'),\n })\n\n return {\n id: blockerKey,\n title,\n description,\n }\n })\n\n const recoveryCases = recoveryCasesData.recoveryCaseList ?? []\n const informationRequests = informationRequestsData.informationRequestList ?? []\n\n const hasUnrecoveredCases = recoveryCases.some(\n recoveryCase => recoveryCase.status !== 'recovered',\n )\n\n const hasInformationRequests = informationRequests.some(\n request => request.status !== InformationRequestStatus.Approved,\n )\n\n const dataViewProps = useDataView({\n data: blockers,\n columns: [\n {\n title: t('blockerSectionLabel'),\n render: blocker => (\n <FlexItem flexGrow={1}>\n <Flex flexDirection=\"column\" gap={8}>\n <Text weight=\"semibold\">{blocker.title}</Text>\n <Text variant=\"supporting\">{blocker.description}</Text>\n </Flex>\n </FlexItem>\n ),\n },\n {\n title: '',\n render: blocker => {\n const action = blocker.action\n\n if (!action) {\n return null\n }\n\n return (\n <Flex justifyContent=\"flex-end\" alignItems=\"center\">\n <Button variant=\"secondary\" onClick={action.onClick} title={action.label}>\n {action.label}\n </Button>\n </Flex>\n )\n },\n },\n ],\n })\n\n const hasBlockers = blockers.length > 0\n const hasAnyContent = hasBlockers || hasUnrecoveredCases || hasInformationRequests\n\n if (!hasAnyContent) {\n return (\n <div className={classNames(styles.root, className)}>\n <Text>{t('noBlockersMessage')}</Text>\n </div>\n )\n }\n\n return (\n <div className={classNames(styles.root, className)}>\n <Flex flexDirection=\"column\" gap={32}>\n {alertState.alerts.map(alert => (\n <Alert\n key={alert.id}\n status=\"success\"\n label={t(`alerts.${alert.type}.title`)}\n onDismiss={() => {\n handleDismissAlert(alert.id)\n }}\n >\n <Text>{t(`alerts.${alert.type}.description`)}</Text>\n </Alert>\n ))}\n\n {hasBlockers && (\n <Flex flexDirection=\"column\" gap={20}>\n <Heading as=\"h2\" styledAs=\"h4\">\n {t('blockersListTitle')}\n </Heading>\n <DataView {...dataViewProps} label={t('blockersListTitle')} />\n </Flex>\n )}\n\n {hasUnrecoveredCases && <RecoveryCases companyId={companyId} onEvent={handleEvent} />}\n\n {hasInformationRequests && (\n <InformationRequestsFlow companyId={companyId} withAlert={false} onEvent={handleEvent} />\n )}\n </Flex>\n </div>\n )\n}\n"],"names":["PayrollBlockerList","props","jsx","BaseComponent","Root","className","companyId","dictionary","onEvent","useComponentDictionary","useI18n","t","useTranslation","Button","Text","Heading","Alert","useComponentContext","alertState","setAlertState","useState","handleDismissAlert","useCallback","alertId","prev","alert","addAlert","alertType","handleEvent","type","data","recoveryCasesEvents","informationRequestEvents","blockersData","usePayrollsGetBlockersSuspense","recoveryCasesData","useRecoveryCasesGetSuspense","informationRequestsData","useInformationRequestsGetInformationRequestsSuspense","blockers","blocker","blockerKey","translationKeys","getBlockerTranslationKeys","title","letter","description","recoveryCases","informationRequests","hasUnrecoveredCases","recoveryCase","hasInformationRequests","request","InformationRequestStatus","dataViewProps","useDataView","FlexItem","jsxs","Flex","action","hasBlockers","classNames","styles","DataView","RecoveryCases","InformationRequestsFlow"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PayrollBlockerList.js","sources":["../../../../../src/components/Payroll/PayrollBlocker/components/PayrollBlockerList.tsx"],"sourcesContent":["import { useState, useCallback } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport { usePayrollsGetBlockersSuspense } from '@gusto/embedded-api/react-query/payrollsGetBlockers'\nimport { useRecoveryCasesGetSuspense } from '@gusto/embedded-api/react-query/recoveryCasesGet'\nimport { useInformationRequestsGetInformationRequestsSuspense } from '@gusto/embedded-api/react-query/informationRequestsGetInformationRequests'\nimport { InformationRequestStatus } from '@gusto/embedded-api/models/components/informationrequest'\nimport { getBlockerTranslationKeys } from '../payrollHelpers'\nimport styles from './PayrollBlockerList.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { Flex, FlexItem } from '@/components/Common'\nimport { DataView } from '@/components/Common/DataView/DataView'\nimport { useDataView } from '@/components/Common/DataView/useDataView'\nimport { useComponentDictionary, useI18n } from '@/i18n'\nimport { RecoveryCases } from '@/components/Payroll/RecoveryCases'\nimport { InformationRequestsFlow } from '@/components/InformationRequests'\nimport { BaseComponent, type BaseComponentInterface } from '@/components/Base'\nimport { informationRequestEvents, recoveryCasesEvents, type EventType } from '@/shared/constants'\n\ntype ResponseAlertType = 'recoveryCaseResubmitted' | 'informationRequestResponded'\n\ninterface ResponseAlert {\n id: number\n type: ResponseAlertType\n}\n\ninterface ResponseAlertState {\n id: number\n alerts: ResponseAlert[]\n}\n\ninterface PayrollBlocker {\n id: string\n title: string\n description: string\n action?: {\n label: string\n onClick: () => void\n }\n}\n\ninterface PayrollBlockerListProps extends BaseComponentInterface<'Payroll.PayrollBlocker'> {\n companyId: string\n}\n\n/**\n * PayrollBlockerList - DataView-based component displaying payroll blockers\n * Shows each blocker with individual resolution buttons\n * Also displays recovery cases and information requests sections when applicable\n */\nexport function PayrollBlockerList(props: PayrollBlockerListProps) {\n return (\n <BaseComponent {...props}>\n <Root {...props}>{props.children}</Root>\n </BaseComponent>\n )\n}\n\nfunction Root({ className, companyId, dictionary, onEvent }: PayrollBlockerListProps) {\n useComponentDictionary('Payroll.PayrollBlocker', dictionary)\n useI18n('Payroll.PayrollBlocker')\n const { t } = useTranslation('Payroll.PayrollBlocker')\n const { Button, Text, Heading, Alert } = useComponentContext()\n\n const [alertState, setAlertState] = useState<ResponseAlertState>({\n id: 0,\n alerts: [],\n })\n\n const handleDismissAlert = useCallback((alertId: number) => {\n setAlertState(prev => ({\n ...prev,\n alerts: prev.alerts.filter(alert => alert.id !== alertId),\n }))\n }, [])\n\n const addAlert = useCallback((alertType: ResponseAlertType) => {\n setAlertState(prev => ({\n id: prev.id + 1,\n alerts: [{ id: prev.id, type: alertType }, ...prev.alerts],\n }))\n }, [])\n\n const handleEvent = useCallback(\n (type: EventType, data?: unknown) => {\n if (type === recoveryCasesEvents.RECOVERY_CASE_RESUBMIT_DONE) {\n addAlert('recoveryCaseResubmitted')\n }\n\n if (type === informationRequestEvents.INFORMATION_REQUEST_FORM_DONE) {\n addAlert('informationRequestResponded')\n }\n\n onEvent(type, data)\n },\n [onEvent, addAlert],\n )\n\n const { data: blockersData } = usePayrollsGetBlockersSuspense({\n companyUuid: companyId,\n })\n\n const { data: recoveryCasesData } = useRecoveryCasesGetSuspense({\n companyUuid: companyId,\n })\n\n const { data: informationRequestsData } = useInformationRequestsGetInformationRequestsSuspense({\n companyUuid: companyId,\n })\n\n const payrollBlockerList = blockersData.payrollBlockers ?? []\n const blockers: PayrollBlocker[] = payrollBlockerList.map(blocker => {\n const blockerKey = blocker.key\n const translationKeys = getBlockerTranslationKeys(blockerKey)\n\n const title = t(translationKeys.titleKey, {\n defaultValue: blockerKey\n .replace(/_/g, ' ')\n .replace(/\\b\\w/g, (letter: string) => letter.toUpperCase()),\n })\n\n const description = t(translationKeys.descriptionKey, {\n defaultValue: blocker.message || t('defaultBlockerDescription'),\n })\n\n return {\n id: blockerKey,\n title,\n description,\n }\n })\n\n const recoveryCases = recoveryCasesData.recoveryCases ?? []\n const informationRequests = informationRequestsData.informationRequests ?? []\n\n const hasUnrecoveredCases = recoveryCases.some(\n recoveryCase => recoveryCase.status !== 'recovered',\n )\n\n const hasInformationRequests = informationRequests.some(\n request => request.status !== InformationRequestStatus.Approved,\n )\n\n const dataViewProps = useDataView({\n data: blockers,\n columns: [\n {\n title: t('blockerSectionLabel'),\n render: blocker => (\n <FlexItem flexGrow={1}>\n <Flex flexDirection=\"column\" gap={8}>\n <Text weight=\"semibold\">{blocker.title}</Text>\n <Text variant=\"supporting\">{blocker.description}</Text>\n </Flex>\n </FlexItem>\n ),\n },\n {\n title: '',\n render: blocker => {\n const action = blocker.action\n\n if (!action) {\n return null\n }\n\n return (\n <Flex justifyContent=\"flex-end\" alignItems=\"center\">\n <Button variant=\"secondary\" onClick={action.onClick} title={action.label}>\n {action.label}\n </Button>\n </Flex>\n )\n },\n },\n ],\n })\n\n const hasBlockers = blockers.length > 0\n const hasAnyContent = hasBlockers || hasUnrecoveredCases || hasInformationRequests\n\n if (!hasAnyContent) {\n return (\n <div className={classNames(styles.root, className)}>\n <Text>{t('noBlockersMessage')}</Text>\n </div>\n )\n }\n\n return (\n <div className={classNames(styles.root, className)}>\n <Flex flexDirection=\"column\" gap={32}>\n {alertState.alerts.map(alert => (\n <Alert\n key={alert.id}\n status=\"success\"\n label={t(`alerts.${alert.type}.title`)}\n onDismiss={() => {\n handleDismissAlert(alert.id)\n }}\n >\n <Text>{t(`alerts.${alert.type}.description`)}</Text>\n </Alert>\n ))}\n\n {hasBlockers && (\n <Flex flexDirection=\"column\" gap={20}>\n <Heading as=\"h2\" styledAs=\"h4\">\n {t('blockersListTitle')}\n </Heading>\n <DataView {...dataViewProps} label={t('blockersListTitle')} />\n </Flex>\n )}\n\n {hasUnrecoveredCases && <RecoveryCases companyId={companyId} onEvent={handleEvent} />}\n\n {hasInformationRequests && (\n <InformationRequestsFlow companyId={companyId} withAlert={false} onEvent={handleEvent} />\n )}\n </Flex>\n </div>\n )\n}\n"],"names":["PayrollBlockerList","props","jsx","BaseComponent","Root","className","companyId","dictionary","onEvent","useComponentDictionary","useI18n","t","useTranslation","Button","Text","Heading","Alert","useComponentContext","alertState","setAlertState","useState","handleDismissAlert","useCallback","alertId","prev","alert","addAlert","alertType","handleEvent","type","data","recoveryCasesEvents","informationRequestEvents","blockersData","usePayrollsGetBlockersSuspense","recoveryCasesData","useRecoveryCasesGetSuspense","informationRequestsData","useInformationRequestsGetInformationRequestsSuspense","blockers","blocker","blockerKey","translationKeys","getBlockerTranslationKeys","title","letter","description","recoveryCases","informationRequests","hasUnrecoveredCases","recoveryCase","hasInformationRequests","request","InformationRequestStatus","dataViewProps","useDataView","FlexItem","jsxs","Flex","action","hasBlockers","classNames","styles","DataView","RecoveryCases","InformationRequestsFlow"],"mappings":"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"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { PayrollBlockersError } from '@gusto/embedded-api/models/errors/payrollblockerserror';
|
|
2
|
-
import {
|
|
2
|
+
import { UnprocessableEntityError } from '@gusto/embedded-api/models/errors/unprocessableentityerror';
|
|
3
3
|
export interface ApiPayrollBlocker {
|
|
4
4
|
key: string;
|
|
5
5
|
message?: string;
|
|
6
6
|
}
|
|
7
7
|
export declare function isPayrollBlockersError(error: unknown): error is PayrollBlockersError;
|
|
8
|
-
export declare function isUnprocessableEntityWithPayrollBlockers(error: unknown): error is
|
|
8
|
+
export declare function isUnprocessableEntityWithPayrollBlockers(error: unknown): error is UnprocessableEntityError;
|
|
9
9
|
export declare function parsePayrollBlockersFromError(error: unknown): ApiPayrollBlocker[];
|
|
10
10
|
export interface PayrollSubmitResult {
|
|
11
11
|
success: boolean;
|