Add permission-based visibility for Clients tab in profile

netmanager-app/app/(authenticated)/profile/components/ProfileTabs.tsx

@@ -6,17 +6,21 @@ import MyProfile from "./MyProfile"
 import PasswordEdit from "./PasswordEdit"
 import ApiTokens from "./ApiTokens"
 import ClientManagement from "./Clients"
+import { usePermissions } from "@/core/hooks/usePermissions"
 
 export default function ProfileTabs() {
   const [activeTab, setActiveTab] = useState("profile")
+  const { hasPermission } = usePermissions()
+
+  const canManageClients = hasPermission("CREATE_UPDATE_AND_DELETE_NETWORK_USERS")
 
   return (
     <Tabs value={activeTab} onValueChange={setActiveTab} className="w-full">
-      <TabsList className="grid w-full grid-cols-4">
+      <TabsList className={`grid w-full ${canManageClients ? "grid-cols-4" : "grid-cols-3"}`}>
         <TabsTrigger value="profile">My Profile</TabsTrigger>
         <TabsTrigger value="password">Password Edit</TabsTrigger>
         <TabsTrigger value="api">API Access Tokens</TabsTrigger>
-        <TabsTrigger value="clients">Clients</TabsTrigger>
+        {canManageClients && <TabsTrigger value="clients">Clients</TabsTrigger>}
       </TabsList>
       <TabsContent value="profile">
         <MyProfile />
@@ -27,10 +31,11 @@ export default function ProfileTabs() {
       <TabsContent value="api">
         <ApiTokens />
       </TabsContent>
-      <TabsContent value="clients">
-        <ClientManagement />
-      </TabsContent>
+      {canManageClients && (
+        <TabsContent value="clients">
+          <ClientManagement />
+        </TabsContent>
+      )}
     </Tabs>
   )
 }
-