HRM-System/docs/PLAN-sidebar-grouping.md

PLAN - Sidebar Navigation Grouping

1. Context & Objective

The user noticed that the sidebar navigation needs better organization, especially when an employee has both personal modules (like "My Leaves", "My Payslips") and elevated management permissions (like HR modules, Recruitment). The goal is to restructure the app-sidebar.tsx to group personal modules distinctly from company/management modules.

2. Target Files

• resources/js/components/app-sidebar.tsx

3. Task Breakdown

Phase 1: Grouping Personal Employee Modules

• Modify getEmployeeNavItems() to wrap the personal modules inside a logical group/folder (e.g., "Self Service" or "My Portal").
• Ensure items like "My Leaves", "Overtime Requests", "My Attendance", and "My Payslips" are children of this new group to reduce sidebar clutter.

Phase 2: Restructuring the Merged Navigation

• When an employee has elevated permissions (e.g., Manager or HR), the sidebar currently merges getEmployeeNavItems() and getCompanyNavItems() into a flat list.
• We will organize the main app-sidebar.tsx return array to clearly demarcate the groups.
• Example Structure:
  • Dashboard (Global)
  • My Portal (Expandable: My Leaves, My Attendance, etc.)
  • HR Management (Expandable: Branches, Departments, etc. - visible only if permissions exist)
  • Recruitment (Expandable - visible only if permissions exist)

Phase 3: Verify Permissions Flow

• Ensure that the hasPermission checks remain intact on all company-level modules.
• Ensure that if a standard employee logs in, they only see the "Dashboard" and "My Portal" groups.

4. Verification Checklist

• Personal modules are grouped under a single parent item (e.g., "Self Service").
• HR and Company modules remain grouped under their respective categories.
• The sidebar is visually organized and easy to navigate for users with dual roles (employee + HR).
• No permissions bypass occurs during the restructuring.