oceanhelm 0.0.13 → 0.0.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oceanhelm",
-  "version": "0.0.13",
+  "version": "0.0.15",
   "description": "Oceanhelm's highly customizable library",
   "private": false,
   "type": "module",

package/src/components/ConfigurableSidebar.vue

@@ -80,6 +80,7 @@ export default {
     },
 
     // User profile for role-based filtering
+    // Expected shape: { role: 'staff', categories: ['hr', 'purchaser'] }
     userProfile: {
       type: Object,
       default: () => ({})
@@ -97,7 +98,8 @@ export default {
       default: ''
     },
 
-    // Permission checker function
+    // Optional override: provide your own permission function
+    // Signature: (item, userProfile) => Boolean
     permissionChecker: {
       type: Function,
       default: null
@@ -111,12 +113,9 @@ export default {
 
     filteredMenuItems() {
       return this.menuItems.filter(item => {
-        // Check if the item itself has permission
-        if (!this.hasPermission(item)) {
-          return false;
-        }
+        if (!this.hasPermission(item)) return false;
 
-        // For dropdown items, check if any children have permission
+        // For dropdowns, only show if at least one child is permitted
         if (item.type === 'dropdown' && item.children) {
           return item.children.some(child => this.hasPermission(child));
         }
@@ -134,41 +133,63 @@ export default {
 
   methods: {
     toggleDropdown(item) {
-    // Close others if you want accordion behavior
-    this.filteredMenuItems.forEach(i => {
-      if (i !== item && i.type === 'dropdown') {
-        i.open = false;
-      }
-    });
+      // Accordion behaviour — close others
+      this.filteredMenuItems.forEach(i => {
+        if (i !== item && i.type === 'dropdown') {
+          i.open = false;
+        }
+      });
+      item.open = !item.open;
+    },
 
-    item.open = !item.open;
-  },
-    // Get filtered children for dropdown items
     getFilteredChildren(item) {
       if (!item.children) return [];
       return item.children.filter(child => this.hasPermission(child));
     },
 
-    // Permission checking
+    // ─── Permission logic ────────────────────────────────────────────────────
+    // Rule summary:
+    //   1. Use permissionChecker prop if supplied.
+    //   2. No `roles` array on the item → visible to everyone.
+    //   3. User's role must be in item.roles.
+    //   4. If the item also has a `categories` array AND the user's role is
+    //      NOT one of the "elevated" roles (owner, super-staff), the user must
+    //      possess at least one of the listed categories.
+    //      Elevated roles bypass the category gate entirely.
+    // ────────────────────────────────────────────────────────────────────────
     hasPermission(item) {
-      // Use custom permission checker if provided
       if (this.permissionChecker) {
         return this.permissionChecker(item, this.userProfile);
       }
 
-      // Default role-based checking
-      if (!item.roles || item.roles.length === 0) {
-        return true; // No role restriction
+      const userRole = this.userProfile?.role || '';
+      const userCategories = this.userProfile?.categories || [];
+
+      // No role restriction — always visible
+      if (!item.roles || item.roles.length === 0) return true;
+
+      // Role must be listed
+      if (!item.roles.includes(userRole)) return false;
+
+      // Category gate — only applies when the item declares categories
+      // AND the user is not an elevated role that bypasses it
+      if (item.categories && item.categories.length > 0) {
+        const elevatedRoles = ['owner', 'super-staff'];
+        if (!elevatedRoles.includes(userRole)) {
+          // Regular staff: must hold at least one of the required categories
+          const hasCategory = item.categories.some(cat => userCategories.includes(cat));
+          if (!hasCategory) return false;
+        }
+        // Elevated roles fall through — no category check needed
       }
 
-      return item.roles.includes(this.userProfile.role);
+      return true;
     },
 
     // Navigation handling
     handleNavigation(item) {
       this.$emit('navigate', item);
 
-      // Default behavior if no custom handler
       if (item.href && !item.preventDefault) {
         if (item.external) {
           window.open(item.href, '_blank');
@@ -186,13 +207,9 @@ export default {
     // Item click handling
     handleItemClick(item) {
       this.$emit('item-click', item);
-
-      if (item.type === 'dropdown') {
-        // Handle dropdown specific logic if needed
-      }
     },
 
-    // Responsive behavior
+    // Responsive behaviour
     initializeResponsiveBehavior() {
       const sidebarToggle = document.getElementById('sidebarToggle');
       const sidebar = document.getElementById('sidebar');
@@ -200,19 +217,16 @@ export default {
 
       if (!sidebarToggle || !sidebar || !content) return;
 
-      // Initial state for desktop
       if (window.innerWidth >= 768) {
         sidebar.classList.toggle('active');
         content.classList.toggle('active');
       }
 
-      // Toggle functionality
       sidebarToggle.addEventListener('click', () => {
         sidebar.classList.toggle('active');
         content.classList.toggle('active');
       });
 
-      // Close sidebar on outside click (mobile)
       document.addEventListener('click', (event) => {
         const isClickInsideSidebar = sidebar.contains(event.target);
         const isClickOnToggleBtn = sidebarToggle.contains(event.target);
@@ -232,14 +246,12 @@ export default {
 </script>
 
 <style>
-/* Dropdown container */
 .sidebar-dropdown {
   list-style: none;
   padding-left: 20px;
   margin: 5px 0 10px 0;
 }
 
-/* Dropdown items */
 .sidebar-dropdown li a {
   display: block;
   padding: 8px 15px;
@@ -253,7 +265,6 @@ export default {
   background: rgba(255, 255, 255, 0.1);
 }
 
-/* Dropdown arrow */
 .dropdown-arrow {
   float: right;
   transition: transform 0.2s ease;
@@ -262,5 +273,4 @@ export default {
 .dropdown-arrow.open {
   transform: rotate(180deg);
 }
-
 </style>

package/src/utils/sidebarConfig.js

@@ -9,12 +9,14 @@ export const createSidebarConfig = (options = {}) => {
     }
 }
 
+// Roles that behave like "owner" in terms of broad visibility
+// (super-staff gets everything owner sees, minus Activity Log and approvals)
 export const defaultMenuItems = [
     {
         type: 'link',
         label: 'Home',
         icon: 'bi bi-house',
-        roles: ['owner', 'staff', 'captain'],
+        roles: ['owner', 'super-staff', 'staff', 'captain'],
         href: '/app/dashboard',
         active: true
     },
@@ -26,6 +28,7 @@ export const defaultMenuItems = [
         roles: ['crew']
     },
     {
+        // Activity Log — intentionally excluded from super-staff
         type: 'link',
         label: 'Activity Log',
         icon: 'bi bi-activity',
@@ -37,7 +40,7 @@ export const defaultMenuItems = [
         label: 'People Manager',
         icon: 'bi bi-person-plus',
         href: '/app/people-manager',
-        roles: ['owner']
+        roles: ['owner', 'super-staff']
     },
     {
         type: 'text',
@@ -46,7 +49,7 @@ export const defaultMenuItems = [
     {
         type: 'dropdown',
         label: 'Compliance',
-        roles: ['owner', 'staff', 'captain'],
+        roles: ['owner', 'super-staff', 'staff', 'captain'],
         icon: 'bi bi-list-ul',
         children: [
             { label: 'Vessel Certification', action: 'vessel-cert' },
@@ -58,67 +61,89 @@ export const defaultMenuItems = [
     },
     {
         // ── HR MODULE ──────────────────────────────────────────────────────────
-        // Clock-in/out is office-only (owner + staff roles).
-        // Payroll and appraisal will also cover crew in a later release.
+        // Visible to owner, super-staff, and staff with the 'hr' category.
+        // Category-based filtering is handled by the sidebar's permissionChecker.
         type: 'dropdown',
         label: 'HR',
         icon: 'bi bi-people-fill',
-        roles: ['owner', 'staff'],       
+        roles: ['owner', 'super-staff', 'staff'],
+        categories: ['hr'],           // staff must also have this category
         children: [
             {
-                label: 'Attendance',         
+                label: 'Attendance',
                 action: 'hr-attendance',
-                roles: ['owner', 'staff'],
+                roles: ['owner', 'super-staff', 'staff'],
+                categories: ['hr'],
             },
             {
-                label: 'Payroll',            
+                label: 'Payroll',
                 action: 'hr-payroll',
-                roles: ['owner', 'staff'],
+                roles: ['owner', 'super-staff', 'staff'],
+                categories: ['hr'],
             },
             {
-                label: 'Appraisals',        
+                label: 'Appraisals',
                 action: 'hr-appraisals',
-                roles: ['owner', 'staff'],
+                roles: ['owner', 'super-staff', 'staff'],
+                categories: ['hr'],
             },
             {
                 label: 'Leave Management',
                 action: 'hr-leave',
-                roles: ['owner', 'staff'],
+                roles: ['owner', 'super-staff', 'staff'],
+                categories: ['hr'],
             },
             {
-                label: 'Disciplinary Log',   // Coming next
+                label: 'Disciplinary Log',
                 action: 'hr-disciplinary',
-                roles: ['owner'],
+                roles: ['owner'],      // owner-only, no category gate needed
             },
         ]
     },
-    /* ── end HR MODULE ── */
+    {
+        // ── RECRUITMENT MODULE ─────────────────────────────────────────────────
+        // Accessible to owner, super-staff, and staff with the 'hr' category.
+        type: 'dropdown',
+        label: 'Recruitment',
+        icon: 'bi bi-person-fill-add',
+        roles: ['owner', 'super-staff', 'staff'],
+        categories: ['hr'],           // staff must also have this category
+        children: [
+            {
+                label: 'Manage Recruitment',
+                action: 'recruitment-builder',
+                roles: ['owner', 'super-staff', 'staff'],
+                categories: ['hr'],
+            }
+        ]
+    },
+    /* ── end HR / RECRUITMENT MODULES ── */
     {
         type: 'button',
         label: 'Maintenance',
         icon: 'bi bi-tools',
         action: 'maintenance',
-        roles: ['owner', 'staff', 'captain']
+        roles: ['owner', 'super-staff', 'staff', 'captain']
     },
     {
         type: 'dropdown',
         label: 'Crew Management',
         icon: 'bi bi-people',
-        roles: ['owner', 'staff', 'captain'],
+        roles: ['owner', 'super-staff', 'staff', 'captain'],
         children: [
-            { label: 'All Crew',          action: 'crew-all',       roles: ['owner', 'staff'] },
+            { label: 'All Crew',           action: 'crew-all',       roles: ['owner', 'super-staff', 'staff'] },
             { label: 'Get Crew by Vessel', action: 'crew-by-vessel' },
-            { label: 'Schedule',          action: 'schedule' },
+            { label: 'Schedule',           action: 'schedule' },
         ]
     },
     {
         type: 'dropdown',
         label: 'Inventory Management',
         icon: 'bi bi-clipboard-data',
-        roles: ['owner', 'staff', 'captain'],
+        roles: ['owner', 'super-staff', 'staff', 'captain'],
         children: [
-            { label: 'Parts Inventory', action: 'inventory', roles: ['owner', 'staff', 'captain'] },
-            { label: 'Bunkering',       action: 'fuel',      roles: ['owner', 'staff', 'captain'] },
+            { label: 'Parts Inventory', action: 'inventory', roles: ['owner', 'super-staff', 'staff', 'captain'] },
+            { label: 'Bunkering',       action: 'fuel',      roles: ['owner', 'super-staff', 'staff', 'captain'] },
         ]
     },
     {
@@ -126,21 +151,21 @@ export const defaultMenuItems = [
         label: 'Requisition Processing',
         icon: 'bi bi-calendar-check',
         href: '/app/requisition',
-        roles: ['owner', 'staff', 'captain']
+        roles: ['owner', 'super-staff', 'staff', 'captain']
     },
     {
         type: 'button',
         label: 'Voyage Manager',
         icon: 'fas fa-ship',
         action: 'coming-soon',
-        roles: ['owner', 'staff', 'captain']
+        roles: ['owner', 'super-staff', 'staff', 'captain']
     },
     {
         type: 'button',
         label: 'Vessel Log',
         icon: 'bi bi-file-ruled',
         action: 'coming-soon',
-        roles: ['owner', 'staff', 'captain']
+        roles: ['owner', 'super-staff', 'staff', 'captain']
     },
     {
         type: 'button',
@@ -161,7 +186,7 @@ export const defaultMenuItems = [
         label: 'Settings',
         icon: 'bi bi-gear',
         action: 'settings',
-        roles: ['owner', 'staff']
+        roles: ['owner', 'super-staff', 'staff']
     },
     {
         type: 'button',