feat: phase 4 - frontend groups UI, permission-matrix, usePermission hook, field-level permissions tab, authStore permissions

frontend/src/hooks/usePermission.ts

@@ -0,0 +1,37 @@
+import { useAuthStore } from '@/store/authStore';
+
+export function usePermission() {
+  const user = useAuthStore((state) => state.user);
+
+  const hasPermission = (permission: string): boolean => {
+    if (user?.is_system_admin) return true;
+    const perms = user?.permissions || [];
+    // Check exact match and wildcards
+    for (const p of perms) {
+      if (p === permission) return true;
+      if (p === '*:*') return true;
+      const pParts = p.split(':');
+      const rParts = permission.split(':');
+      if (pParts.length === rParts.length) {
+        let match = true;
+        for (let i = 0; i < pParts.length; i++) {
+          if (pParts[i] !== '*' && pParts[i] !== rParts[i]) {
+            match = false;
+            break;
+          }
+        }
+        if (match) return true;
+      }
+    }
+    return false;
+  };
+
+  const hasFieldAccess = (module: string, field: string): 'hidden' | 'readonly' | 'read' => {
+    if (user?.is_system_admin) return 'read';
+    const fieldPerms = user?.field_permissions || {};
+    const modulePerms = fieldPerms[module] || {};
+    return modulePerms[field] || 'read';
+  };
+
+  return { hasPermission, hasFieldAccess };
+}