Leave UI

Summary

The React/Vite client exposes a protected Leave route for employee self service and a broader legacy/admin workspace, plus a protected holiday and weekly-off configuration route.

Audience

Employees, managers, HR/Leave administrators, frontend developers, QA, support, and product owners.

Overview

UI scope and confirmed screens

• Leave at /leave: employee requests/history in the ESS rendering; requests, details, balances, decisions, cancellation, import/export, and a read-only leave-type/policy view in the legacy rendering.
• Holidays Configuration at /settings/holidays: holiday create/edit/delete and weekly-off selection, with import/export controls.
• The ESS dashboard also summarizes balance, pending requests, and upcoming holidays.

The route is selected by client-side employee-versus-manager/admin role text. ProtectedRoute separately requires an authenticated tenant user, the time-office module feature, and a matching route feature. These client checks do not replace API authorization.

API dependencies and transition

ESS uses gateway-oriented /ess/leaves. The broader workspace calls compatibility endpoints through the shared API client, while the extracted Leave Service exposes direct contracts documented in Leave API. Exact runtime ownership therefore remains Transitional.

Screenshot guidance

Screenshots are intentionally placeholders. Add only sanitized, current captures with no employee, tenant, balance, reason, or other personal data.

Known UI gaps

No dedicated UI was found for editable Leave Service types or policies, workflow status/timeline, carry forward, encashment, half-day input, supporting documents, pagination, or request search. The legacy policy tab is a calculated/read-only view, not policy administration.

Documentation map

• UI overview
• Navigation and access
• Leave request list
• Apply for leave
• Leave request details
• Leave balances
• Approval and rejection
• Cancellation
• Employee leave history
• Holiday management
• Weekly-off management
• Validation and errors
• Responsive and accessibility
• UI testing guide

Source References

• UI/salary-ui/apps/client-hrms-portal/src/App.tsx
• UI/salary-ui/apps/client-hrms-portal/src/components/AppLayout.tsx
• UI/salary-ui/apps/client-hrms-portal/src/pages/hr/PayrollFeaturePages.tsx
• UI/salary-ui/apps/client-hrms-portal/src/ess/EssPages.tsx

Related Articles

• Leave UI
• Leave API

See Also

• Leave business documentation
• Leave technical documentation

Keywords

• Leave UI
• Leave UI
• Workforce management

Revision Information

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