Fix jwt-token

client/src/pages/Settings.jsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useMemo } from 'react';
+import React, { useState, useEffect } from 'react';
 import { useAuth } from '../contexts/AuthContext';
 import api from '../services/api';
 import toast from 'react-hot-toast';
@@ -54,7 +54,7 @@ const Settings = () => {
   const [tenantConfig, setTenantConfig] = useState(null);
   const [loading, setLoading] = useState(true);
   const [saving, setSaving] = useState(false);
-  const [initialTabSet, setInitialTabSet] = useState(false);
+  const [availableTabs, setAvailableTabs] = useState([]);
 
   // Check if user can access settings based on RBAC permissions
   const canAccess = canAccessSettings(user?.role);
@@ -98,20 +98,20 @@ const Settings = () => {
     );
   }
 
-  // Filter tabs based on user permissions - memoized to prevent infinite useEffect
+  // Calculate available tabs when user role changes
-  const availableTabs = useMemo(() => {
+  useEffect(() => {
-    return user?.role 
+    const tabs = user?.role 
       ? ALL_TABS.filter(tab => hasPermission(user.role, tab.permission))
       : [];
+    setAvailableTabs(tabs);
   }, [user?.role]);
 
-  // Set initial tab to first available tab (only once)
+  // Set initial tab to first available tab
   useEffect(() => {
-    if (!initialTabSet && availableTabs.length > 0 && !availableTabs.find(tab => tab.id === activeTab)) {
+    if (availableTabs.length > 0 && !availableTabs.find(tab => tab.id === activeTab)) {
       setActiveTab(availableTabs[0].id);
-      setInitialTabSet(true);
     }
-  }, [availableTabs, activeTab, initialTabSet]);
+  }, [availableTabs, activeTab]);
 
   return (
     <div className="min-h-screen bg-gray-50">