feat: route permission guards, home page per role — RolePermissionsContext, PermissionGuard, App routes, DB migration

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/contexts/RolePermissionsContext.tsx

@@ -1,4 +1,4 @@
-import { createContext, useContext, useState, useEffect, useCallback, type ReactNode } from 'react'
+import { createContext, useContext, useState, useEffect, useCallback, useMemo, type ReactNode } from 'react'
 import { useAuth } from './AuthContext'
 import { api } from '../lib/api'
 
@@ -19,6 +19,17 @@ export const DEFAULT_ROLE_PERMS: Record<string, string[]> = {
   technician:  ['calendar', 'housekeeping', 'maintenance', 'rooms', 'floor_map', 'equipment', 'ttlock'],
 }
 
+// Default home pages per role (fallback)
+export const DEFAULT_HOME_PAGES: Record<string, string> = {
+  hotel_admin:  '/calendar',
+  manager:      '/calendar',
+  receptionist: '/calendar',
+  housekeeper:  '/housekeeping',
+  accountant:   '/reports',
+  security:     '/calendar',
+  technician:   '/housekeeping',
+}
+
 // ── Types ─────────────────────────────────────────────────────────────────────
 
 export interface SavedRolePermission {
@@ -29,15 +40,19 @@ export interface SavedRolePermission {
   color: string
   isSystem: boolean
   permissions: Record<string, boolean>
+  homePage?: string | null
 }
 
 interface RolePermissionsContextValue {
   /** Check if the current user has a given permission */
   can: (permission: string) => boolean
+  /** Home page path for the current user's role */
+  userHomePage: string
   /** Raw saved permissions for all roles (used by RolesTab editor) */
   savedPermissions: SavedRolePermission[]
   /** Re-fetch from API */
   reload: () => Promise<void>
+  /** True while initial permissions are being fetched */
   loading: boolean
 }
 
@@ -45,18 +60,23 @@ interface RolePermissionsContextValue {
 
 const RolePermissionsContext = createContext<RolePermissionsContextValue>({
   can: () => false,
+  userHomePage: '/calendar',
   savedPermissions: [],
   reload: async () => {},
-  loading: false,
+  loading: true,
 })
 
 export function RolePermissionsProvider({ children }: { children: ReactNode }) {
   const { user } = useAuth()
   const [savedPermissions, setSavedPermissions] = useState<SavedRolePermission[]>([])
-  const [loading, setLoading] = useState(false)
+  // Start as true — PermissionGuard waits before rendering, preventing permission flash
+  const [loading, setLoading] = useState(true)
 
   const reload = useCallback(async () => {
-    if (!user?.hotelSlug) return
+    if (!user?.hotelSlug) {
+      setLoading(false)
+      return
+    }
     setLoading(true)
     try {
       const data = await api.rolePermissions.list(user.hotelSlug)
@@ -75,13 +95,10 @@ export function RolePermissionsProvider({ children }: { children: ReactNode }) {
   const can = useCallback((permission: string): boolean => {
     const role = user?.role ?? 'housekeeper'
 
-    // super_admin: full access everywhere
     if (role === 'super_admin') return true
-
-    // hotel_admin and manager: full access to all hotel modules
     if (role === 'hotel_admin' || role === 'manager') return true
 
-    // Check saved permissions from DB for this role
+    // Check saved permissions from DB
     const saved = savedPermissions.find(rp => rp.roleKey === role)
     if (saved) {
       return saved.permissions[permission] === true
@@ -92,8 +109,21 @@ export function RolePermissionsProvider({ children }: { children: ReactNode }) {
     return perms.includes('*') || perms.includes(permission)
   }, [user?.role, savedPermissions])
 
+  const userHomePage = useMemo(() => {
+    const role = user?.role ?? ''
+    if (role === 'super_admin') return '/admin'
+    if (role === 'hotel_admin' || role === 'manager') return '/calendar'
+
+    // Use saved home page from DB if set
+    const saved = savedPermissions.find(rp => rp.roleKey === role)
+    if (saved?.homePage) return saved.homePage
+
+    // Fall back to role default
+    return DEFAULT_HOME_PAGES[role] ?? '/calendar'
+  }, [user?.role, savedPermissions])
+
   return (
-    <RolePermissionsContext.Provider value={{ can, savedPermissions, reload, loading }}>
+    <RolePermissionsContext.Provider value={{ can, userHomePage, savedPermissions, reload, loading }}>
       {children}
     </RolePermissionsContext.Provider>
   )