Show only relevant tabs

remote_frontend/src/App.tsx

@@ -59,6 +59,10 @@ function AuthenticatedApp(): React.ReactElement {
 
   const load = async () => {
     setRights(await ServerApi.GetRights());
+
+    if (rights!.groups.length > 0) setTab("group");
+    else if (rights!.vms.length > 0) setTab("vm");
+    else setTab("info");
   };
 
   return (
@@ -87,27 +91,21 @@ function AuthenticatedApp(): React.ReactElement {
                 selectedValue={tab}
                 onTabSelect={(_, d) => setTab(d.value as any)}
               >
-                <Tab
-                  value="group"
-                  icon={<AppListIcon />}
-                  disabled={rights!.groups.length === 0}
-                >
+                {rights!.groups.length > 0 && (
+                  <Tab value="group" icon={<AppListIcon />}>
                     Groups
                   </Tab>
-                <Tab
-                  value="vm"
-                  icon={<DesktopIcon />}
-                  disabled={rights!.vms.length === 0}
-                >
+                )}
+                {rights!.vms.length > 0 && (
+                  <Tab value="vm" icon={<DesktopIcon />}>
                     Virtual machines
                   </Tab>
-                <Tab
-                  value="info"
-                  icon={<InfoIcon />}
-                  disabled={!rights!.sys_info}
-                >
+                )}
+                {rights!.sys_info && (
+                  <Tab value="info" icon={<InfoIcon />}>
                     System info
                   </Tab>
+                )}
               </TabList>
               <div>
                 <MainMenu />