Skip to main content

Edit Employee UI

Summary​

Edit reuses the seven-step modal and preloads the selected compatibility record plus linked-user values.

Audience​

  • HR administrators, developers, QA engineers, and support engineers

Purpose, navigation, and preconditions​

Select Edit from an employee card or profile panel. The record must be present in the accessible list, and the API requires tenant-wide mutation access.

Main components and fields​

The same Basic, Job, Access, Attendance, Compensation, Bank & KYC, and Review steps used for creation are shown. Existing date values are normalized for date inputs; linked-user identity and role are copied into access fields.

Transitional differences from create​

  • The submit label changes to Update Employee and uses the selected identifier.
  • Password controls offer temporary-password regeneration rather than initial manual entry.
  • Licensing blocks new records but not the edit path.
  • After save, the list reloads and the UI attempts to refresh the selected record.
  • The UI sends the broad monolith compatibility DTO; extracted Employee Service update does not own all displayed access, payroll, attendance, or KYC fields.

Validation, success, failure, and empty states​

Client validation matches create except for initial-password rules. Success shows an update toast, closes the modal, reloads, and refreshes the selection. Failure keeps the modal open with a visible error. No edit-specific not-found screen exists.

Permission and API dependency​

The Edit control is visible on cards/profile without an additional component-level permission check; API authorization is authoritative.

Screenshot placeholder​

Screenshot placeholder: Edit Employee modal populated with synthetic values only.

Source References​

  • UI/salary-ui/apps/client-hrms-portal/src/App.tsx
  • UI/salary-ui/apps/client-hrms-portal/src/pages/Labor.tsx
  • UI/salary-ui/apps/client-hrms-portal/src/utils/ProtectedRoute.tsx
  • Controllers/LaborController.cs
  • microservices/src/employee-service/Api/EmployeeCompatibilityEndpoints.cs

See Also​

Keywords​

  • Edit Employee
  • update modal
  • compatibility DTO

Revision Information​

  • Status: Draft
  • Last reviewed: 2026-07-15
  • Review cycle: Quarterly