Implement Role Management Features and UI Enhancements

- Introduced a new composable `useActiveRole` for managing user roles, including fetching role status and switching roles with server validation.
- Updated `RoleSwitcher.vue` to utilize the new composable, enhancing role selection with improved error handling and UI feedback.
- Added new API endpoints for role management, including fetching user role status and switching active roles.
- Enhanced product visibility logic to filter based on the user's active role, ensuring a tailored experience.
- Updated database schema to support last active role tracking for users, improving session management.
- Refined UI components across the application to reflect role-based changes and improve user experience.

server/api/products/index.get.ts

@@ -1,11 +1,11 @@
 /**
  * GET /api/products
  *
- * Returns a list of products visible to the current user based on their roles.
+ * Returns a list of products visible to the current user based on their active role.
  *
  * Role-based Visibility (MVP):
  * - Unauthenticated users: See NO products (empty array)
- * - Authenticated users: See products assigned to their approved roles
+ * - Authenticated users: See products assigned to their ACTIVE role only
  * - Products WITHOUT role assignments: NOT visible (opt-in visibility)
  *
  * Query Parameters:
@@ -16,7 +16,8 @@
 
 import { eq, and, inArray } from 'drizzle-orm'
 import { products } from '../../database/schema'
-import { getVisibleProductIdsForUser } from '../../utils/roles'
+import { getVisibleProductIdsForRole } from '../../utils/roles'
+import { getUserActiveRole } from '../../utils/role-session'
 
 export default defineEventHandler(async (event) => {
   const db = useDatabase()
@@ -32,10 +33,13 @@ export default defineEventHandler(async (event) => {
       return []
     }
 
-    // Get product IDs visible to this user (based on approved roles)
-    const visibleProductIds = await getVisibleProductIdsForUser(user.id)
+    // Get user's active role (validates with TTL, auto-fallback if revoked)
+    const activeRole = await getUserActiveRole(event)
 
-    // If user has no approved roles or no products are assigned to their roles
+    // Get product IDs visible for the active role only
+    const visibleProductIds = await getVisibleProductIdsForRole(user.id, activeRole)
+
+    // If user has no access to products in their active role
     if (visibleProductIds.length === 0) {
       return []
     }