diff --git a/src/common/api/employment.ts b/src/common/api/employment.ts new file mode 100644 index 00000000..2d155d3a --- /dev/null +++ b/src/common/api/employment.ts @@ -0,0 +1,41 @@ +import { getShowEmployment, GetShowEmploymentResponse } from '@/src/client'; +import { useClient } from '@/src/context'; +import { $TSFixMe } from '@/src/types/remoteFlows'; +import { useQuery, UseQueryResult } from '@tanstack/react-query'; +import { Client } from '@/src/client/client'; + +/** + * Hook to retrieve employment details for a specific employment ID. + * + * @param {Object} params - The parameters for the query. + * @param {string} params.employmentId - The ID of the employment to fetch details for. + * @returns {UseQueryResult} - The result of the query, including the employment details. + */ +export const useEmploymentQuery = ({ + employmentId, + queryParams, +}: { + employmentId: string; + queryParams?: $TSFixMe; // TODO: we need to generate openapi-ts types but it's broken at the moment +}): UseQueryResult< + GetShowEmploymentResponse['data']['employment'], + unknown +> => { + const { client } = useClient(); + return useQuery({ + queryKey: ['employment', employmentId], + retry: false, + queryFn: () => { + return getShowEmployment({ + client: client as Client, + headers: { + Authorization: ``, + }, + path: { employment_id: employmentId }, + query: queryParams, + }); + }, + enabled: !!employmentId, + select: ({ data }) => data?.data?.employment, + }); +}; diff --git a/src/common/api/index.ts b/src/common/api/index.ts index 52723ee3..aa5bb0ea 100644 --- a/src/common/api/index.ts +++ b/src/common/api/index.ts @@ -1,41 +1,8 @@ -import { - getShowEmployment, - MagicLinkParams, - postGenerateMagicLink, -} from '@/src/client'; +import { useMutation } from '@tanstack/react-query'; +import { MagicLinkParams, postGenerateMagicLink } from '@/src/client'; import { useClient } from '@/src/context'; -import { ContractAmendmentParams } from '@/src/flows/ContractAmendment/types'; import { Client } from '@/src/client/client'; -import { useMutation, useQuery } from '@tanstack/react-query'; - -type UseEmployment = Pick; - -/** - * Hook to retrieve employment details for a specific employment ID. - * - * @param {Object} params - The parameters for the query. - * @param {string} params.employmentId - The ID of the employment to fetch details for. - * @returns {UseQueryResult} - The result of the query, including the employment details. - */ -export const useEmploymentQuery = ({ employmentId }: UseEmployment) => { - const { client } = useClient(); - return useQuery({ - queryKey: ['employment', employmentId], - retry: false, - queryFn: () => { - return getShowEmployment({ - client: client as Client, - headers: { - Authorization: ``, - }, - path: { employment_id: employmentId }, - }); - }, - enabled: !!employmentId, - select: ({ data }) => data?.data?.employment, - }); -}; export const useMagicLink = () => { const { client } = useClient(); diff --git a/src/components/form/fields/default/RadioGroupFieldDefault.tsx b/src/components/form/fields/default/RadioGroupFieldDefault.tsx index 70278a5a..aaf34d1d 100644 --- a/src/components/form/fields/default/RadioGroupFieldDefault.tsx +++ b/src/components/form/fields/default/RadioGroupFieldDefault.tsx @@ -25,8 +25,10 @@ export const RadioGroupFieldDefault = ({ {label} {description && ( - - {description} + } + > + {description} )} diff --git a/src/components/ui/form.tsx b/src/components/ui/form.tsx index 30535455..1f617d41 100644 --- a/src/components/ui/form.tsx +++ b/src/components/ui/form.tsx @@ -131,11 +131,13 @@ const FormControl = React.forwardRef< FormControl.displayName = 'FormControl'; function FormDescription({ + helpCenter, className, children, as, ...props }: React.ComponentProps<'p'> & { + helpCenter?: React.ReactNode; children?: React.ReactNode | (() => React.ReactNode); as?: T; } & Omit, 'children' | 'className'>) { @@ -144,16 +146,19 @@ function FormDescription({ if (typeof children === 'string') { return ( - + <> + + {helpCenter && helpCenter} + ); } @@ -166,6 +171,7 @@ function FormDescription({ {...props} > {typeof children === 'function' ? children() : children} + {helpCenter && helpCenter} ); } diff --git a/src/flows/ContractAmendment/hooks.ts b/src/flows/ContractAmendment/hooks.ts index 514a0d91..e15725d2 100644 --- a/src/flows/ContractAmendment/hooks.ts +++ b/src/flows/ContractAmendment/hooks.ts @@ -11,7 +11,7 @@ import { parseJSFToValidate } from '@/src/components/form/utils'; import { mutationToPromise } from '@/src/lib/mutations'; import { Client } from '@/src/client/client'; import { createHeadlessForm } from '@/src/common/createHeadlessForm'; -import { useEmploymentQuery } from '@/src/common/api'; +import { useEmploymentQuery } from '@/src/common/api/employment'; import { useClient } from '@/src/context'; import { ContractAmendmentParams } from './types'; import { useStepState } from '../useStepState'; @@ -130,6 +130,9 @@ export const useContractAmendment = ({ error: errorEmployment, } = useEmploymentQuery({ employmentId, + queryParams: { + exclude_files: true, + }, }); const { diff --git a/src/flows/ContractorOnboarding/hooks.tsx b/src/flows/ContractorOnboarding/hooks.tsx index 24e083df..28d989c8 100644 --- a/src/flows/ContractorOnboarding/hooks.tsx +++ b/src/flows/ContractorOnboarding/hooks.tsx @@ -33,7 +33,6 @@ import { import { useCountriesSchemaField, useCreateEmployment, - useEmployment, useJSONSchemaForm, useUpdateEmployment, } from '@/src/flows/Onboarding/api'; @@ -58,6 +57,7 @@ import { } from '@/src/flows/ContractorOnboarding/jsfModify'; import { useUploadFile } from '@/src/common/api/files'; import { dataURLtoFile } from '@/src/lib/files'; +import { useEmploymentQuery } from '@/src/common/api/employment'; type useContractorOnboardingProps = Omit< ContractorOnboardingFlowProps, @@ -135,7 +135,10 @@ export const useContractorOnboarding = ({ data: employment, isLoading: isLoadingEmployment, refetch: refetchEmployment, - } = useEmployment(internalEmploymentId); + } = useEmploymentQuery({ + employmentId: internalEmploymentId as string, + queryParams: { exclude_files: true }, + }); const { status: employmentStatus } = employment || {}; diff --git a/src/flows/Onboarding/hooks.tsx b/src/flows/Onboarding/hooks.tsx index e7277886..8d040c45 100644 --- a/src/flows/Onboarding/hooks.tsx +++ b/src/flows/Onboarding/hooks.tsx @@ -30,7 +30,6 @@ import { useCompany, useCountriesSchemaField, useCreateEmployment, - useEmployment, useJSONSchemaForm, useUpdateBenefitsOffers, useUpdateEmployment, @@ -41,6 +40,7 @@ import { AnnualGrossSalary } from '@/src/flows/Onboarding/components/AnnualGross import { $TSFixMe, JSFField, JSFFieldset, Meta } from '@/src/types/remoteFlows'; import { EquityPriceDetails } from '@/src/flows/Onboarding/components/EquityPriceDetails'; import { useErrorReporting } from '@/src/components/error-handling/useErrorReporting'; +import { useEmploymentQuery } from '@/src/common/api/employment'; type OnboardingHookProps = Omit; @@ -192,7 +192,10 @@ export const useOnboarding = ({ data: employment, isLoading: isLoadingEmployment, refetch: refetchEmployment, - } = useEmployment(internalEmploymentId); + } = useEmploymentQuery({ + employmentId: internalEmploymentId as string, + queryParams: { exclude_files: true }, + }); // if the employment is loaded, country code has not been set yet // we set the internal country code with the employment country code diff --git a/src/flows/Termination/hooks.tsx b/src/flows/Termination/hooks.tsx index 7c55e553..19b8007a 100644 --- a/src/flows/Termination/hooks.tsx +++ b/src/flows/Termination/hooks.tsx @@ -37,7 +37,7 @@ import { cn } from '@/src/internals'; import { zendeskArticles } from '@/src/components/shared/zendesk-drawer/utils'; import { PaidTimeOff } from '@/src/flows/Termination/components/PaidTimeOff/PaidTimeOff'; import { PaidTimeOffContainer } from '@/src/flows/Termination/components/PaidTimeOff/PaidTimeOffContainer'; -import { useEmploymentQuery } from '@/src/common/api'; +import { useEmploymentQuery } from '@/src/common/api/employment'; import { AcknowledgeInformationContainer } from '@/src/flows/Termination/components/AcknowledgeInformation/AcknowledgeInfomationContainer'; import { AcknowledgeInformation } from '@/src/flows/Termination/components/AcknowledgeInformation/AcknowledgeInformation'; import { AcknowledgeInformationFees } from '@/src/flows/Termination/components/AcknowledgeInformation/AcknowledgeInformationFees'; @@ -56,7 +56,7 @@ export const useTermination = ({ useStepState(STEPS); const { data: employment, isLoading: isLoadingEmployment } = - useEmploymentQuery({ employmentId }); + useEmploymentQuery({ employmentId, queryParams: { exclude_files: true } }); const { data: payrollCalendars } = usePayrollCalendars({ query: { diff --git a/src/index.tsx b/src/index.tsx index ef776226..e12b4064 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -78,7 +78,8 @@ export type { ContractPreviewStatementProps } from '@/src/flows/ContractorOnboar export type * from '@/src/flows/CostCalculator/types'; -export { useEmploymentQuery, useMagicLink } from '@/src/common/api'; +export { useMagicLink } from '@/src/common/api'; +export { useEmploymentQuery } from '@/src/common/api/employment'; export { useTimeOffQuery,