feat: extract Deductions card from DashboardFlow into standalone management block

docs/reference/endpoint-inventory.json

@@ -2618,10 +2618,10 @@
     "Employee.DashboardFlow": {
       "blocks": [
         "Employee.Compensation",
-        "Employee.Deductions",
         "Employee.HomeAddress",
         "Employee.PaymentMethod",
         "Employee.WorkAddress",
+        "EmployeeManagement.Deductions",
         "EmployeeManagement.DocumentManager",
         "EmployeeManagement.FederalTaxes",
         "EmployeeManagement.Profile",
@@ -2677,14 +2677,14 @@
     "EmployeeManagement.DashboardFlow": {
       "blocks": [
         "Employee.PaymentMethod",
+        "EmployeeManagement.Deductions",
         "EmployeeManagement.DocumentManager",
         "EmployeeManagement.FederalTaxes",
         "EmployeeManagement.HomeAddress",
         "EmployeeManagement.Profile",
         "EmployeeManagement.StateTaxes",
         "EmployeeManagement.WorkAddress",
         "EmployeeOnboarding.Compensation",
-        "EmployeeOnboarding.Deductions",
         "EmployeeOnboarding.PaymentMethod"
       ]
     },

docs/reference/endpoint-reference.md

@@ -487,13 +487,13 @@ Flows compose multiple blocks into a single workflow. The endpoint list for a fl
 | **Contractor.OnboardingFlow** | Contractor.Address, Contractor.ContractorList, Contractor.ContractorProfile, Contractor.ContractorSubmit, Contractor.NewHireReport, Contractor.PaymentMethod |
 | **Contractor.PaymentFlow** | Contractor.CreatePayment, Contractor.PaymentHistory, Contractor.PaymentStatement, Contractor.PaymentSummary, Contractor.PaymentsList, InformationRequests.InformationRequestsFlow |
 | **ContractorOnboarding.OnboardingFlow** | ContractorOnboarding.Address, ContractorOnboarding.ContractorList, ContractorOnboarding.ContractorProfile, ContractorOnboarding.ContractorSubmit, ContractorOnboarding.NewHireReport, ContractorOnboarding.PaymentMethod |
-| **Employee.DashboardFlow** | Employee.Compensation, Employee.Deductions, Employee.HomeAddress, Employee.PaymentMethod, Employee.WorkAddress, EmployeeManagement.DocumentManager, EmployeeManagement.FederalTaxes, EmployeeManagement.Profile, EmployeeManagement.StateTaxes, EmployeeOnboarding.PaymentMethod |
+| **Employee.DashboardFlow** | Employee.Compensation, Employee.HomeAddress, Employee.PaymentMethod, Employee.WorkAddress, EmployeeManagement.Deductions, EmployeeManagement.DocumentManager, EmployeeManagement.FederalTaxes, EmployeeManagement.Profile, EmployeeManagement.StateTaxes, EmployeeOnboarding.PaymentMethod |
 | **Employee.EmployeeListFlow** | Employee.DashboardFlow, Employee.OnboardingExecutionFlow, Employee.TerminationFlow, EmployeeManagement.EmployeeList |
 | **Employee.OnboardingExecutionFlow** | Employee.Compensation, Employee.Deductions, Employee.EmployeeDocuments, Employee.OnboardingSummary, Employee.PaymentMethod, Employee.Profile, EmployeeOnboarding.FederalTaxes, EmployeeOnboarding.StateTaxes |
 | **Employee.OnboardingFlow** | Employee.EmployeeList, Employee.OnboardingExecutionFlow |
 | **Employee.SelfOnboardingFlow** | Employee.DocumentSigner, Employee.Landing, Employee.OnboardingSummary, Employee.PaymentMethod, Employee.Profile, EmployeeOnboarding.FederalTaxes, EmployeeOnboarding.StateTaxes |
 | **Employee.TerminationFlow** | Employee.TerminateEmployee, Employee.TerminationSummary, Payroll.DismissalFlow, Payroll.PayrollLanding |
-| **EmployeeManagement.DashboardFlow** | Employee.PaymentMethod, EmployeeManagement.DocumentManager, EmployeeManagement.FederalTaxes, EmployeeManagement.HomeAddress, EmployeeManagement.Profile, EmployeeManagement.StateTaxes, EmployeeManagement.WorkAddress, EmployeeOnboarding.Compensation, EmployeeOnboarding.Deductions, EmployeeOnboarding.PaymentMethod |
+| **EmployeeManagement.DashboardFlow** | Employee.PaymentMethod, EmployeeManagement.Deductions, EmployeeManagement.DocumentManager, EmployeeManagement.FederalTaxes, EmployeeManagement.HomeAddress, EmployeeManagement.Profile, EmployeeManagement.StateTaxes, EmployeeManagement.WorkAddress, EmployeeOnboarding.Compensation, EmployeeOnboarding.PaymentMethod |
 | **EmployeeManagement.EmployeeListFlow** | EmployeeManagement.DashboardFlow, EmployeeManagement.EmployeeList, EmployeeManagement.TerminationFlow, EmployeeOnboarding.OnboardingExecutionFlow |
 | **EmployeeManagement.TerminationFlow** | EmployeeManagement.TerminateEmployee, EmployeeManagement.TerminationSummary, Payroll.DismissalFlow, Payroll.PayrollLanding |
 | **EmployeeOnboarding.OnboardingExecutionFlow** | Employee.EmployeeDocuments, Employee.PaymentMethod, EmployeeOnboarding.Compensation, EmployeeOnboarding.Deductions, EmployeeOnboarding.FederalTaxes, EmployeeOnboarding.OnboardingSummary, EmployeeOnboarding.Profile, EmployeeOnboarding.StateTaxes |

sdk-app/src/generated-registry-data.ts

@@ -33,6 +33,9 @@ export const ENTITY_REQUIREMENTS: Record<string, string[]> = {
   'Contractor.PaymentSummary': ['companyId'],
   'Contractor.PaymentsList': ['companyId'],
   'EmployeeManagement.DashboardFlow': ['employeeId'],
+  'EmployeeManagement.Deductions': ['employeeId'],
+  'EmployeeManagement.DeductionsCard': ['employeeId'],
+  'EmployeeManagement.DeductionsEditForm': ['employeeId'],
   'EmployeeManagement.DocumentManager': ['employeeId'],
   'EmployeeManagement.EmployeeDocuments': ['employeeId'],
   'EmployeeManagement.EmployeeList': ['companyId'],

src/components/Employee/Dashboard/Dashboard.test.tsx

@@ -372,7 +372,7 @@ describe('Dashboard', () => {
       expect(screen.queryByText('Old Deduction')).toBeNull()
     })
 
-    it('emits EMPLOYEE_DEDUCTION_ADD when clicking the Add deduction button', async () => {
+    it('emits EMPLOYEE_MANAGEMENT_DEDUCTIONS_CARD_ADD_REQUESTED when clicking the Add deduction button', async () => {
       stubGarnishmentsList([])
       const user = userEvent.setup()
 
@@ -381,12 +381,13 @@ describe('Dashboard', () => {
 
       await user.click(screen.getByRole('button', { name: 'Add deduction' }))
 
-      expect(onEvent).toHaveBeenCalledWith(componentEvents.EMPLOYEE_DEDUCTION_ADD, {
-        employeeId: 'employee-123',
-      })
+      expect(onEvent).toHaveBeenCalledWith(
+        componentEvents.EMPLOYEE_MANAGEMENT_DEDUCTIONS_CARD_ADD_REQUESTED,
+        { employeeId: 'employee-123' },
+      )
     })
 
-    it('emits EMPLOYEE_DEDUCTION_EDIT with the garnishment when clicking Edit', async () => {
+    it('emits EMPLOYEE_MANAGEMENT_DEDUCTIONS_CARD_EDIT_REQUESTED with the garnishment when clicking Edit', async () => {
       stubGarnishmentsList([
         buildGarnishment({ uuid: 'd-1', description: 'Health Insurance', amount: '120' }),
       ])
@@ -399,12 +400,12 @@ describe('Dashboard', () => {
       await user.click(await screen.findByRole('menuitem', { name: 'Edit deduction' }))
 
       expect(onEvent).toHaveBeenCalledWith(
-        componentEvents.EMPLOYEE_DEDUCTION_EDIT,
+        componentEvents.EMPLOYEE_MANAGEMENT_DEDUCTIONS_CARD_EDIT_REQUESTED,
         expect.objectContaining({ uuid: 'd-1', description: 'Health Insurance' }),
       )
     })
 
-    it('soft-deletes via PUT and emits EMPLOYEE_DEDUCTION_DELETED on confirm', async () => {
+    it('soft-deletes via PUT and emits EMPLOYEE_MANAGEMENT_DEDUCTIONS_CARD_DELETED on confirm', async () => {
       const target = buildGarnishment({ uuid: 'd-1', description: 'Health Insurance' })
       stubGarnishmentsList([target])
 
@@ -433,7 +434,7 @@ describe('Dashboard', () => {
       expect(updatePath).toBe('/v1/garnishments/d-1')
       expect(updateBody).toMatchObject({ active: false, version: 'version-d-1' })
       expect(onEvent).toHaveBeenCalledWith(
-        componentEvents.EMPLOYEE_DEDUCTION_DELETED,
+        componentEvents.EMPLOYEE_MANAGEMENT_DEDUCTIONS_CARD_DELETED,
         expect.objectContaining({ uuid: 'd-1', active: false }),
       )
     })

src/components/Employee/Dashboard/Dashboard.tsx

@@ -2,7 +2,6 @@ import { Suspense, useState, useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useEmployeesGetSuspense } from '@gusto/embedded-api-v-2025-11-15/react-query/employeesGet'
 import type { Job } from '@gusto/embedded-api-v-2025-11-15/models/components/job'
-import type { Garnishment } from '@gusto/embedded-api-v-2025-11-15/models/components/garnishment'
 import type { GetV1EmployeesEmployeeIdFederalTaxesResponse } from '@gusto/embedded-api-v-2025-11-15/models/operations/getv1employeesemployeeidfederaltaxes'
 import { BasicDetailsViewWithData } from './BasicDetailsView'
 import { JobAndPayView } from './JobAndPayView'
@@ -58,17 +57,6 @@ function DashboardRoot({
     onEvent(componentEvents.EMPLOYEE_JOB_ADD_ANOTHER, { employeeId })
   }, [onEvent, employeeId])
 
-  const handleAddDeduction = useCallback(() => {
-    onEvent(componentEvents.EMPLOYEE_DEDUCTION_ADD, { employeeId })
-  }, [onEvent, employeeId])
-
-  const handleEditDeduction = useCallback(
-    (deduction: Garnishment) => {
-      onEvent(componentEvents.EMPLOYEE_DEDUCTION_EDIT, deduction)
-    },
-    [onEvent],
-  )
-
   const handleEditFederalTaxes = useCallback(
     (federalTaxes: EmployeeFederalTax | undefined) => {
       onEvent(componentEvents.EMPLOYEE_FEDERAL_TAXES_EDIT, { employeeId, federalTaxes })
@@ -147,8 +135,6 @@ function DashboardRoot({
                 onEditCompensation={handleEditCompensation}
                 onAddJob={handleAddJob}
                 onAddAnotherJob={handleAddAnotherJob}
-                onAddDeduction={handleAddDeduction}
-                onEditDeduction={handleEditDeduction}
               />
             </Suspense>
           )}

src/components/Employee/Dashboard/DashboardComponents.tsx

@@ -10,17 +10,16 @@ import { ProfileEditForm } from '@/components/Employee/Profile/management/Profil
 import { BankForm } from '@/components/Employee/PaymentMethod/onboarding/BankForm'
 import { SplitView } from '@/components/Employee/PaymentMethod/onboarding/SplitView'
 import { DocumentManager } from '@/components/Employee/Documents/management/DocumentManager'
-import { DeductionsForm } from '@/components/Employee/Deductions/onboarding/DeductionsForm/DeductionsForm'
+import { DeductionsEditForm } from '@/components/Employee/Deductions/management/DeductionsEditForm'
 import {
   ManagementEditCompensation,
   ManagementEditPendingCompensation,
 } from '@/components/Employee/Compensation/management'
-import { useDeductionsList } from '@/components/Employee/Deductions/shared'
 import { AddAnotherJob } from '@/components/Employee/Compensation/management/AddAnotherJob/AddAnotherJob'
 import { EditCompensation } from '@/components/Employee/Compensation/onboarding/EditCompensation/EditCompensation'
 import { useFlow, type FlowContextInterface } from '@/components/Flow/useFlow'
 import { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'
-import { BaseComponent, BaseLayout } from '@/components/Base'
+import { BaseComponent } from '@/components/Base'
 import { ensureRequired } from '@/helpers/ensureRequired'
 import { useI18n } from '@/i18n'
 import { componentEvents } from '@/shared/constants'
@@ -40,8 +39,8 @@ export interface DashboardContextInterface extends FlowContextInterface {
   formId?: string
   currentJob?: Job | null
   successAlert?: DashboardSuccessAlert | null
-  /** Set by the EMPLOYEE_DEDUCTION_EDIT transition; consumed by
-   *  DeductionFormContextual to pre-populate the form. */
+  /** Set by the EMPLOYEE_MANAGEMENT_DEDUCTIONS_CARD_EDIT_REQUESTED transition;
+   *  consumed by `DeductionsEditFormContextual` to pre-populate the form. */
   editingDeductionId?: string
   /** Persists the active Dashboard tab across sub-flows so Cancel/Back
    *  returns to the originating tab instead of resetting to basic details. */
@@ -140,38 +139,14 @@ export function DocumentManagerContextual() {
   )
 }
 
-export function DeductionFormContextual() {
+export function DeductionsEditFormContextual() {
   const { employeeId, editingDeductionId, onEvent } = useFlow<DashboardContextInterface>()
-  // The same list query the form hooks use internally — React Query dedupes,
-  // so this just looks up the loaded row to pre-populate edit mode.
-  const list = useDeductionsList({ employeeId: ensureRequired(employeeId) })
-
-  if (list.isLoading) {
-    return <BaseLayout isLoading error={list.errorHandling.errors} />
-  }
-
-  const deduction = editingDeductionId
-    ? (list.data.deductions.find(d => d.uuid === editingDeductionId) ?? null)
-    : null
-
   return (
-    <BaseLayout error={list.errorHandling.errors}>
-      <DeductionsForm
-        employeeId={ensureRequired(employeeId)}
-        deduction={deduction}
-        onSaved={(saved, mode) => {
-          onEvent(
-            mode === 'create'
-              ? componentEvents.EMPLOYEE_DEDUCTION_CREATED
-              : componentEvents.EMPLOYEE_DEDUCTION_UPDATED,
-            saved,
-          )
-        }}
-        onCancel={() => {
-          onEvent(componentEvents.CANCEL)
-        }}
-      />
-    </BaseLayout>
+    <DeductionsEditForm
+      employeeId={ensureRequired(employeeId)}
+      editingDeductionId={editingDeductionId}
+      onEvent={onEvent}
+    />
   )
 }