Skip to content

fix: wire TIME_OFF_EDIT_POLICY and TIME_OFF_CHANGE_SETTINGS transitions #1695

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
jeffredodd merged 3 commits into from
May 6, 2026
+90 −20
Merged

fix: wire TIME_OFF_EDIT_POLICY and TIME_OFF_CHANGE_SETTINGS transitions #1695

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
100b8d4
fix: wire TIME_OFF_EDIT_POLICY and TIME_OFF_CHANGE_SETTINGS transitions
jeffredodd May 6, 2026
03ff1c7
fix: route Change settings save/back to the policy detail view
jeffredodd May 6, 2026
b356bfb
Merge remote-tracking branch 'origin/main' into fix/wire-edit-policy-…
jeffredodd May 6, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions src/components/UNSTABLE_TimeOff/PolicySettings/PolicySettings.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { useTimeOffPoliciesGetSuspense } from '@gusto/embedded-api/react-query/t
import { useTimeOffPoliciesUpdateMutation } from '@gusto/embedded-api/react-query/timeOffPoliciesUpdate'
import type { PutV1TimeOffPoliciesTimeOffPolicyUuidRequestBody } from '@gusto/embedded-api/models/operations/putv1timeoffpoliciestimeoffpolicyuuid'
import type { TimeOffPolicy } from '@gusto/embedded-api/models/components/timeoffpolicy'
import { useQueryClient } from '@tanstack/react-query'
import { PolicySettingsPresentation } from './PolicySettingsPresentation'
import type { PolicySettingsFormData, PolicySettingsAccrualMethod } from './PolicySettingsTypes'
import { BaseComponent, type BaseComponentInterface } from '@/components/Base'
Expand Down Expand Up @@ -89,6 +90,7 @@ function buildUpdateRequestBody(

function Root({ policyId }: PolicySettingsProps) {
const { onEvent, baseSubmitHandler } = useBase()
const queryClient = useQueryClient()

const { data: policyResponse } = useTimeOffPoliciesGetSuspense({
timeOffPolicyUuid: policyId,
Expand All @@ -111,6 +113,9 @@ function Root({ policyId }: PolicySettingsProps) {
},
})

void queryClient.invalidateQueries({
queryKey: ['@gusto/embedded-api', 'timeOffPolicies', 'get'],
})
onEvent(componentEvents.TIME_OFF_POLICY_SETTINGS_DONE, timeOffPolicy)
})
}
Expand Down
74 changes: 55 additions & 19 deletions src/components/UNSTABLE_TimeOff/TimeOffFlow/timeOffStateMachine.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ type TimeOffState =
| 'policyTypeSelector'
| 'policyDetailsForm'
| 'policySettings'
| 'editPolicySettings'
| 'addEmployeesToPolicy'
| 'viewTimeOffPolicyDetail'
| 'holidaySelectionForm'
Expand Down Expand Up @@ -311,13 +312,17 @@ describe('timeOffStateMachine', () => {
})

describe('viewTimeOffPolicyDetail state', () => {
it('transitions to addEmployeesToPolicy on TIME_OFF_ADD_EMPLOYEES_TO_POLICY with policyId', () => {
const service = createService()
function toViewPolicyDetail(service: ReturnType<typeof createService>) {
send(service, componentEvents.TIME_OFF_VIEW_POLICY, {
policyId: 'policy-existing',
policyType: 'vacation',
})
expect(service.machine.current).toBe('viewTimeOffPolicyDetail')
}

it('transitions to addEmployeesToPolicy on TIME_OFF_ADD_EMPLOYEES_TO_POLICY with policyId', () => {
const service = createService()
toViewPolicyDetail(service)

send(service, componentEvents.TIME_OFF_ADD_EMPLOYEES_TO_POLICY, {
policyId: 'policy-existing',
Expand All @@ -330,10 +335,7 @@ describe('timeOffStateMachine', () => {

it('returns to viewTimeOffPolicyDetail with the same policyId after adding employees', () => {
const service = createService()
send(service, componentEvents.TIME_OFF_VIEW_POLICY, {
policyId: 'policy-existing',
policyType: 'vacation',
})
toViewPolicyDetail(service)
send(service, componentEvents.TIME_OFF_ADD_EMPLOYEES_TO_POLICY, {
policyId: 'policy-existing',
})
Expand All @@ -344,13 +346,9 @@ describe('timeOffStateMachine', () => {
expect(service.context.policyId).toBe('policy-existing')
})

it('transitions to policyDetailsForm on TIME_OFF_EDIT_POLICY', () => {
it('transitions to policyDetailsForm on TIME_OFF_EDIT_POLICY with policyId', () => {
const service = createService()
send(service, componentEvents.TIME_OFF_VIEW_POLICY, {
policyId: 'policy-existing',
policyType: 'vacation',
})
expect(service.machine.current).toBe('viewTimeOffPolicyDetail')
toViewPolicyDetail(service)

send(service, componentEvents.TIME_OFF_EDIT_POLICY, { policyId: 'policy-existing' })

Expand All @@ -359,19 +357,57 @@ describe('timeOffStateMachine', () => {
expect(service.context.alerts).toBeUndefined()
})

it('transitions to policySettings on TIME_OFF_CHANGE_SETTINGS', () => {
it('transitions to editPolicySettings on TIME_OFF_CHANGE_SETTINGS with policyId', () => {
const service = createService()
send(service, componentEvents.TIME_OFF_VIEW_POLICY, {
policyId: 'policy-existing',
policyType: 'vacation',
})
toViewPolicyDetail(service)

send(service, componentEvents.TIME_OFF_CHANGE_SETTINGS, { policyId: 'policy-existing' })

expect(service.machine.current).toBe('editPolicySettings')
expect(service.context.policyId).toBe('policy-existing')
})

it('returns to viewTimeOffPolicyDetail on TIME_OFF_POLICY_SETTINGS_DONE in the edit flow', () => {
const service = createService()
toViewPolicyDetail(service)
send(service, componentEvents.TIME_OFF_CHANGE_SETTINGS, { policyId: 'policy-existing' })

send(service, componentEvents.TIME_OFF_POLICY_SETTINGS_DONE)

expect(service.machine.current).toBe('viewTimeOffPolicyDetail')
// policyId is preserved so the detail view re-renders for the same policy
expect(service.context.policyId).toBe('policy-existing')
})

it('returns to viewTimeOffPolicyDetail on TIME_OFF_POLICY_SETTINGS_BACK in the edit flow', () => {
const service = createService()
toViewPolicyDetail(service)
send(service, componentEvents.TIME_OFF_CHANGE_SETTINGS, { policyId: 'policy-existing' })

expect(service.machine.current).toBe('policySettings')
send(service, componentEvents.TIME_OFF_POLICY_SETTINGS_BACK)

expect(service.machine.current).toBe('viewTimeOffPolicyDetail')
expect(service.context.policyId).toBe('policy-existing')
expect(service.context.alerts).toBeUndefined()
})

it('cancels from editPolicySettings to policyList', () => {
const service = createService()
toViewPolicyDetail(service)
send(service, componentEvents.TIME_OFF_CHANGE_SETTINGS, { policyId: 'policy-existing' })

send(service, componentEvents.CANCEL)

expect(service.machine.current).toBe('policyList')
})

it('does not route TIME_OFF_POLICY_SETTINGS_DONE in the create flow back to the detail view', () => {
// Guards against regression of the create flow when adding the edit-only state.
const service = createService()
toPolicySettings(service)

send(service, componentEvents.TIME_OFF_POLICY_SETTINGS_DONE)

expect(service.machine.current).toBe('addEmployeesToPolicy')
})
Copy link
Copy Markdown
Contributor Author

@jeffredodd jeffredodd May 6, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added round-trip coverage in 03ff1c7 — tests for DONE → viewTimeOffPolicyDetail, BACK → viewTimeOffPolicyDetail, and CANCEL → policyList from editPolicySettings, plus a regression test pinning the create-flow DONE behavior.

})

Expand Down
31 changes: 30 additions & 1 deletion src/components/UNSTABLE_TimeOff/TimeOffFlow/timeOffStateMachine.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -308,7 +308,7 @@ export const timeOffMachine = {
),
transition(
componentEvents.TIME_OFF_CHANGE_SETTINGS,
'policySettings',
'editPolicySettings',
reduce(
(
ctx: TimeOffFlowContextInterface,
Expand All @@ -324,6 +324,35 @@ export const timeOffMachine = {
backToListTransition,
Comment on lines +309 to +324
Copy link
Copy Markdown
Contributor Author

@jeffredodd jeffredodd May 6, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good catch — fixed in 03ff1c7. Added a dedicated editPolicySettings state whose TIME_OFF_POLICY_SETTINGS_DONE and TIME_OFF_POLICY_SETTINGS_BACK transitions return to viewTimeOffPolicyDetail with policyId preserved, and re-pointed the TIME_OFF_CHANGE_SETTINGS transition there. The create-flow policySettings state and its outbound routing are unchanged. Also pinned a regression test that the create-flow DONE still routes to addEmployeesToPolicy.

),

// Distinct from `policySettings` (the create-flow step) so that DONE/BACK
// return to the policy detail view instead of routing into the create
// flow's add-employees / details-form steps.
editPolicySettings: state<MachineTransition>(
transition(
componentEvents.TIME_OFF_POLICY_SETTINGS_DONE,
'viewTimeOffPolicyDetail',
reduce(
(ctx: TimeOffFlowContextInterface): TimeOffFlowContextInterface => ({
...ctx,
component: TimeOffPolicyDetailContextual,
alerts: undefined,
}),
),
),
transition(
componentEvents.TIME_OFF_POLICY_SETTINGS_BACK,
'viewTimeOffPolicyDetail',
reduce(
(ctx: TimeOffFlowContextInterface): TimeOffFlowContextInterface => ({
...ctx,
component: TimeOffPolicyDetailContextual,
alerts: undefined,
}),
),
),
cancelToPolicyList,
),

holidaySelectionForm: state<MachineTransition>(
transition(
componentEvents.TIME_OFF_HOLIDAY_SELECTION_DONE,
Expand Down
Loading