Skip to main content
The Employees page (/hr/employees) is the organization-wide employee directory, providing search, filtering by status, department, and level, toggling between grid and list layouts, paginated results, and dialogs to add or bulk-import employees.

​
Overview

The Employee Directory shows up to 50 employees per page. Filters include a full-text search (name, title, email, or employee number), employment status (active by default), department, and employee level. A grid view shows avatar, name, title, department, level badge, email, and phone. A list view shows the same data in a tabular row. Export to CSV downloads the filtered set; bulk import accepts a CSV. Navigating to an employee card opens the employee detail page at /hr/employees/:id. The URL query parameter ?action=new automatically opens the add-employee dialog.

​
Who it’s for

Requires permission: hr.employees.view (HR_PERMISSIONS.EMPLOYEES_VIEW).

​
Before you start

  • You need the hr.employees.view permission to access this page.
  • To add employees, you need hr.employees.create.
  • To export, you need hr.employees.export.

​
Steps

  1. Navigate to HR → Employees or go to /hr/employees.
  2. Use the search box or filters to narrow the list.
  3. Toggle Grid or List to switch the display mode.
  4. Click an employee card or row to open the employee detail.
  5. Click Add Employee to open the new employee dialog.
  6. Click the upload icon to open the bulk import dialog.
  7. Click the download icon to export the current filtered list as CSV.

​
Key concepts

​
Viewing an employee record

The Employee Details page shows the full profile and tabbed detail sections for a single employee. It is available at route /hr/employees/:id and requires permission HR_PERMISSIONS.EMPLOYEES_VIEW (hr.employees.view). The page fetches the employee record via useEmployeeDetail. The header card shows the employee’s avatar, full name, job title, department, office location, contact info, and employment status badge. Integration status indicators show Microsoft Entra, SharePoint, Teams presence, and OOO status (via platform integration hooks). Tabbed sections (tab state in URL via ?tab) include: Skills, Credentials, Payroll (bank accounts, deductions, tax info), Onboarding/Offboarding status, and more. An edit dialog opens EmployeeFormDialog. Start Onboarding and Start Offboarding buttons open the respective dialogs. Before you start: navigate from the Employee Directory at /hr/employees.
  1. From the Employee Directory at /hr/employees, click an employee card. You land on /hr/employees/:id.
  2. Check name, title, department, contact info, status badge, and integration sync indicators.
  3. Use the tab bar to navigate to Skills, Credentials, Payroll, or other available sections.
  4. Click Edit to open EmployeeFormDialog and update profile fields.
  5. Use the Start Onboarding or Start Offboarding buttons to launch the respective workflows.
Key detail concepts:
  • Tab routing — Active tab is stored in the URL as ?tab=<value>, enabling bookmarkable deep links.
  • Integration indicators — OOO status, presence, Entra, SharePoint, and Teams badges are read from platform integration hooks and are display-only.

​
Creating an employee

/hr/employees/new is a redirect route: the router immediately replaces it with /hr/employees?action=new. This means the Employee Directory page (EmployeeDirectory) loads and the action=new query parameter triggers the employee creation UI. For full onboarding intake, the Onboarding Wizard at /hr/onboarding/wizard may be the more appropriate entry point. Requires permission hr.employees.view (HR_PERMISSIONS.EMPLOYEES_VIEW) — enforced by the redirect destination /hr/employees. Before you start: confirm you have the necessary information for a new employee record (name, role, start date, etc.). For full hire intake including IT access, benefits enrollment, and task assignments, use the Onboarding Wizard at /hr/onboarding/wizard.
  1. Navigate to /hr/employees/new — you will be automatically redirected to /hr/employees?action=new.
  2. The employee directory page will open; follow any prompts triggered by the action=new parameter to create the employee record.

Human Resources

Human Resources core overview.

Governance & parity

This page documents shipped product behavior. It is not medical, legal, or billing advice. Verify against your organization’s policies and applicable regulations before using it for clinical, compliance, or billing decisions. Protected health information (PHI) shown in the product is governed by your tenant’s access controls and is never exposed in this documentation.
  • src/routes/hr.tsx
  • src/cores/hr/pages/EmployeeDirectory.tsx
  • src/cores/hr/pages/EmployeeDetail.tsx
  • src/cores/hr/pages/OnboardingWizardPage.tsx
  • src/cores/hr/hooks/employees/useEmployeeList.ts
  • src/cores/hr/hooks/employees/useEmployeeDetail.ts