Clear up password from the state

config.json

@@ -15,4 +15,4 @@
   "googleAnalyticsID": "$NETBIRD_GOOGLE_ANALYTICS_ID",
   "googleTagManagerID": "$NETBIRD_GOOGLE_TAG_MANAGER_ID",
   "wasmPath": "$NETBIRD_WASM_PATH"
-}
+}

package-lock.json

@@ -56,7 +56,6 @@
         "flowbite": "^1.8.1",
         "flowbite-react": "^0.6.4",
         "framer-motion": "^10.16.4",
-        "ip-address": "^10.1.0",
         "ip-cidr": "^3.1.0",
         "js-cookie": "^3.0.5",
         "lodash": "^4.17.21",
@@ -6599,12 +6598,15 @@
       }
     },
     "node_modules/ip-address": {
-      "version": "10.1.0",
-      "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-10.1.0.tgz",
-      "integrity": "sha512-XXADHxXmvT9+CRxhXg56LJovE+bmWnEWB78LB83VZTprKTmaC5QfruXocxzTZ2Kl0DNwKuBdlIhjL8LeY8Sf8Q==",
-      "license": "MIT",
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-7.1.0.tgz",
+      "integrity": "sha512-V9pWC/VJf2lsXqP7IWJ+pe3P1/HCYGBMZrrnT62niLGjAfCbeiwXMUxaeHvnVlz19O27pvXP4azs+Pj/A0x+SQ==",
+      "dependencies": {
+        "jsbn": "1.1.0",
+        "sprintf-js": "1.1.2"
+      },
       "engines": {
-        "node": ">= 12"
+        "node": ">= 10"
       }
     },
     "node_modules/ip-cidr": {
@@ -6619,19 +6621,6 @@
         "node": ">=10.0.0"
       }
     },
-    "node_modules/ip-cidr/node_modules/ip-address": {
-      "version": "7.1.0",
-      "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-7.1.0.tgz",
-      "integrity": "sha512-V9pWC/VJf2lsXqP7IWJ+pe3P1/HCYGBMZrrnT62niLGjAfCbeiwXMUxaeHvnVlz19O27pvXP4azs+Pj/A0x+SQ==",
-      "license": "MIT",
-      "dependencies": {
-        "jsbn": "1.1.0",
-        "sprintf-js": "1.1.2"
-      },
-      "engines": {
-        "node": ">= 10"
-      }
-    },
     "node_modules/is-array-buffer": {
       "version": "3.0.5",
       "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.5.tgz",
@@ -8572,8 +8561,7 @@
     "node_modules/sprintf-js": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.2.tgz",
-      "integrity": "sha512-VE0SOVEHCk7Qc8ulkWw3ntAzXuqf7S2lvwQaDLRnUeIEaKNQJzV6BwmLKhOqT61aGhfUMrXeaBk+oDGCzvhcug==",
-      "license": "BSD-3-Clause"
+      "integrity": "sha512-VE0SOVEHCk7Qc8ulkWw3ntAzXuqf7S2lvwQaDLRnUeIEaKNQJzV6BwmLKhOqT61aGhfUMrXeaBk+oDGCzvhcug=="
     },
     "node_modules/stable-hash": {
       "version": "0.0.5",

package.json

@@ -61,7 +61,6 @@
     "flowbite": "^1.8.1",
     "flowbite-react": "^0.6.4",
     "framer-motion": "^10.16.4",
-    "ip-address": "^10.1.0",
     "ip-cidr": "^3.1.0",
     "js-cookie": "^3.0.5",
     "lodash": "^4.17.21",

src/app/(dashboard)/dns/nameservers/page.tsx

@@ -7,7 +7,7 @@ import SkeletonTable from "@components/skeletons/SkeletonTable";
 import { RestrictedAccess } from "@components/ui/RestrictedAccess";
 import { usePortalElement } from "@hooks/usePortalElement";
 import useFetchApi from "@utils/api";
-import { ExternalLinkIcon } from "lucide-react";
+import { ExternalLinkIcon, ServerIcon } from "lucide-react";
 import React, { lazy, Suspense } from "react";
 import DNSIcon from "@/assets/icons/DNSIcon";
 import { usePermissions } from "@/contexts/PermissionsProvider";
@@ -15,7 +15,7 @@ import { NameserverGroup } from "@/interfaces/Nameserver";
 import PageContainer from "@/layouts/PageContainer";
 
 const NameserverGroupTable = lazy(
-  () => import("@/modules/dns/nameservers/table/NameserverGroupTable"),
+  () => import("@/modules/dns-nameservers/table/NameserverGroupTable"),
 );
 
 export default function NameServers() {
@@ -40,7 +40,7 @@ export default function NameServers() {
             href={"/dns/nameservers"}
             label={"Nameservers"}
             active
-            icon={<DNSIcon size={13} />}
+            icon={<ServerIcon size={13} />}
           />
         </Breadcrumbs>
         <h1 ref={headingRef}>Nameservers</h1>

src/app/(dashboard)/dns/zones/layout.tsx

@@ -1,8 +0,0 @@
-import { globalMetaTitle } from "@utils/meta";
-import type { Metadata } from "next";
-import BlankLayout from "@/layouts/BlankLayout";
-
-export const metadata: Metadata = {
-  title: `Zones - DNS - ${globalMetaTitle}`,
-};
-export default BlankLayout;

src/app/(dashboard)/dns/zones/page.tsx

@@ -1,70 +0,0 @@
-"use client";
-
-import Breadcrumbs from "@components/Breadcrumbs";
-import InlineLink from "@components/InlineLink";
-import Paragraph from "@components/Paragraph";
-import SkeletonTable from "@components/skeletons/SkeletonTable";
-import { RestrictedAccess } from "@components/ui/RestrictedAccess";
-import { usePortalElement } from "@hooks/usePortalElement";
-import useFetchApi from "@utils/api";
-import { ExternalLinkIcon } from "lucide-react";
-import React, { lazy, Suspense } from "react";
-import DNSIcon from "@/assets/icons/DNSIcon";
-import { usePermissions } from "@/contexts/PermissionsProvider";
-import { DNS_ZONE_DOCS_LINK, DNSZone } from "@/interfaces/DNS";
-import PageContainer from "@/layouts/PageContainer";
-import { DNSZonesProvider } from "@/modules/dns/zones/DNSZonesProvider";
-import DNSZoneIcon from "@/assets/icons/DNSZoneIcon";
-
-const DNSZonesTable = lazy(
-  () => import("@/modules/dns/zones/table/DNSZonesTable"),
-);
-
-export default function DNSZonePage() {
-  const { permission } = usePermissions();
-
-  const { data: zones, isLoading } = useFetchApi<DNSZone[]>("/dns/zones");
-
-  const { ref: headingRef, portalTarget } =
-    usePortalElement<HTMLHeadingElement>();
-
-  return (
-    <PageContainer>
-      <div className={"p-default py-6"}>
-        <Breadcrumbs>
-          <Breadcrumbs.Item label={"DNS"} icon={<DNSIcon size={13} />} />
-          <Breadcrumbs.Item
-            href={"/dns/zones"}
-            label={"Zones"}
-            active
-            icon={<DNSZoneIcon size={16} />}
-          />
-        </Breadcrumbs>
-        <h1 ref={headingRef}>Zones</h1>
-        <Paragraph>
-          Manage DNS zones to control domain name resolution for your network.
-        </Paragraph>
-        <Paragraph>
-          Learn more about
-          <InlineLink href={DNS_ZONE_DOCS_LINK} target={"_blank"}>
-            DNS Zones
-            <ExternalLinkIcon size={12} />
-          </InlineLink>
-          in our documentation.
-        </Paragraph>
-      </div>
-
-      <RestrictedAccess page={"DNS Zones"} hasAccess={permission?.dns?.read}>
-        <Suspense fallback={<SkeletonTable />}>
-          <DNSZonesProvider>
-            <DNSZonesTable
-              isLoading={isLoading}
-              headingTarget={portalTarget}
-              data={zones}
-            />
-          </DNSZonesProvider>
-        </Suspense>
-      </RestrictedAccess>
-    </PageContainer>
-  );
-}

src/app/(dashboard)/group/page.tsx

@@ -15,7 +15,6 @@ import { useSearchParams } from "next/navigation";
 import React, { useState } from "react";
 import AccessControlIcon from "@/assets/icons/AccessControlIcon";
 import DNSIcon from "@/assets/icons/DNSIcon";
-import DNSZoneIcon from "@/assets/icons/DNSZoneIcon";
 import NetworkRoutesIcon from "@/assets/icons/NetworkRoutesIcon";
 import PeerIcon from "@/assets/icons/PeerIcon";
 import SetupKeysIcon from "@/assets/icons/SetupKeysIcon";
@@ -25,7 +24,6 @@ import { usePermissions } from "@/contexts/PermissionsProvider";
 import RoutesProvider from "@/contexts/RoutesProvider";
 import { Group, GROUP_TOOLTIP_TEXT } from "@/interfaces/Group";
 import PageContainer from "@/layouts/PageContainer";
-import { GroupDNSZonesSection } from "@/modules/groups/details/GroupDNSZonesSection";
 import { GroupNameserversSection } from "@/modules/groups/details/GroupNameserversSection";
 import { GroupNetworkRoutesSection } from "@/modules/groups/details/GroupNetworkRoutesSection";
 import { GroupPeersSection } from "@/modules/groups/details/GroupPeersSection";
@@ -136,9 +134,7 @@ const validAllGroupTabs = [
   "resources",
   "network-routes",
   "nameservers",
-  "zones",
 ];
-
 const validOtherGroupTabs = ["users", "peers", "setup-keys"];
 
 const GroupOverviewTabs = ({ group }: { group: Group }) => {
@@ -158,7 +154,7 @@ const GroupOverviewTabs = ({ group }: { group: Group }) => {
   };
 
   const [tab, setTab] = useState(getInitialTab());
-  const { groupDetails, isLoading } = useGroupDetails(group?.id || "");
+  const groupDetails = useGroupDetails(group?.id || "");
 
   const peersCount = groupDetails?.peers_count || 0;
   const usersCount = groupDetails?.users?.length || 0;
@@ -166,7 +162,6 @@ const GroupOverviewTabs = ({ group }: { group: Group }) => {
   const resourcesCount = groupDetails?.resources_count || 0;
   const routesCount = groupDetails?.routes?.length || 0;
   const nameserversCount = groupDetails?.nameservers?.length || 0;
-  const zonesCount = groupDetails?.zones?.length || 0;
   const setupKeysCount = groupDetails?.setupKeys?.length || 0;
 
   return (
@@ -254,19 +249,6 @@ const GroupOverviewTabs = ({ group }: { group: Group }) => {
           {singularize("Nameservers", nameserversCount)}
         </TabsTrigger>
 
-        <TabsTrigger
-          value={"zones"}
-          className={groupDetails === null ? "animate-pulse" : ""}
-        >
-          <DNSZoneIcon
-            size={16}
-            className={
-              "fill-nb-gray-500 group-data-[state=active]/trigger:fill-netbird transition-all"
-            }
-          />
-          {singularize("Zones", zonesCount)}
-        </TabsTrigger>
-
         {group.name !== "All" && (
           <TabsTrigger
             value={"setup-keys"}
@@ -284,56 +266,31 @@ const GroupOverviewTabs = ({ group }: { group: Group }) => {
       </TabsList>
 
       <TabsContent value={"users"} className={"pb-8"}>
-        <GroupUsersSection users={groupDetails?.users} isLoading={isLoading} />
+        <GroupUsersSection users={groupDetails?.users} />
       </TabsContent>
 
       <TabsContent value={"peers"} className={"pb-8"}>
-        <GroupPeersSection
-          peers={groupDetails?.peersOfGroup}
-          isLoading={isLoading}
-        />
+        <GroupPeersSection peers={groupDetails?.peersOfGroup} />
       </TabsContent>
 
       <TabsContent value={"policies"} className={"pb-8"}>
-        <GroupPoliciesSection
-          policies={groupDetails?.policies}
-          isLoading={isLoading}
-        />
+        <GroupPoliciesSection policies={groupDetails?.policies} />
       </TabsContent>
 
       <TabsContent value={"resources"} className={"pb-8"}>
-        <GroupResourcesSection
-          resources={groupDetails?.networkResources}
-          isLoading={isLoading}
-        />
+        <GroupResourcesSection resources={groupDetails?.networkResources} />
       </TabsContent>
 
       <TabsContent value={"network-routes"} className={"pb-8"}>
-        <GroupNetworkRoutesSection
-          routes={groupDetails?.routes}
-          isLoading={isLoading}
-        />
+        <GroupNetworkRoutesSection routes={groupDetails?.routes} />
       </TabsContent>
 
       <TabsContent value={"nameservers"} className={"pb-8"}>
-        <GroupNameserversSection
-          nameserverGroups={groupDetails?.nameservers}
-          isLoading={isLoading}
-        />
-      </TabsContent>
-
-      <TabsContent value={"zones"} className={"pb-8"}>
-        <GroupDNSZonesSection
-          zones={groupDetails?.zones}
-          isLoading={isLoading}
-        />
+        <GroupNameserversSection nameserverGroups={groupDetails?.nameservers} />
       </TabsContent>
 
       <TabsContent value={"setup-keys"} className={"pb-8"}>
-        <GroupSetupKeysSection
-          setupKeys={groupDetails?.setupKeys}
-          isLoading={isLoading}
-        />
+        <GroupSetupKeysSection setupKeys={groupDetails?.setupKeys} />
       </TabsContent>
     </Tabs>
   );

src/app/(dashboard)/network-routes/page.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import Breadcrumbs from "@components/Breadcrumbs";
+import { Callout } from "@components/Callout";
 import InlineLink from "@components/InlineLink";
 import Paragraph from "@components/Paragraph";
 import SkeletonTable from "@components/skeletons/SkeletonTable";
@@ -16,7 +17,6 @@ import RoutesProvider from "@/contexts/RoutesProvider";
 import { Route } from "@/interfaces/Route";
 import PageContainer from "@/layouts/PageContainer";
 import useGroupedRoutes from "@/modules/route-group/useGroupedRoutes";
-import { Callout } from "@components/Callout";
 
 const NetworkRoutesTable = lazy(
   () => import("@/modules/route-group/NetworkRoutesTable"),

src/app/(dashboard)/peer/page.tsx

@@ -26,10 +26,10 @@ import { RestrictedAccess } from "@components/ui/RestrictedAccess";
 import TextWithTooltip from "@components/ui/TextWithTooltip";
 import useRedirect from "@hooks/useRedirect";
 import useFetchApi from "@utils/api";
+import { cn } from "@utils/helpers";
 import dayjs from "dayjs";
 import { isEmpty, trim } from "lodash";
 import {
-  ArrowRightIcon,
   Barcode,
   CalendarDays,
   Cpu,
@@ -40,6 +40,7 @@ import {
   MonitorSmartphoneIcon,
   NetworkIcon,
   PencilIcon,
+  TimerResetIcon,
 } from "lucide-react";
 import { useRouter, useSearchParams } from "next/navigation";
 import { toASCII } from "punycode";
@@ -59,12 +60,11 @@ import type { Peer } from "@/interfaces/Peer";
 import PageContainer from "@/layouts/PageContainer";
 import useGroupHelper from "@/modules/groups/useGroupHelper";
 import { AccessiblePeersSection } from "@/modules/peer/AccessiblePeersSection";
+import { PeerExpirationToggle } from "@/modules/peer/PeerExpirationToggle";
 import { PeerNetworkRoutesSection } from "@/modules/peer/PeerNetworkRoutesSection";
 import { PeerSSHToggle } from "@/modules/peer/PeerSSHToggle";
 import { RDPButton } from "@/modules/remote-access/rdp/RDPButton";
 import { SSHButton } from "@/modules/remote-access/ssh/SSHButton";
-import Link from "next/link";
-import { PeerExpirationSettings } from "@/modules/peer/PeerExpirationSettings";
 
 export default function PeerPage() {
   const queryParameter = useSearchParams();
@@ -78,6 +78,12 @@ export default function PeerPage() {
 
   useRedirect("/peers", false, !peerId || isRestricted);
 
+  const peerKey = useMemo(() => {
+    let id = peer?.id ?? "";
+    let expiration = peer?.login_expiration_enabled ? "1" : "0";
+    return `${id}-${expiration}`;
+  }, [peer]);
+
   if (isRestricted) {
     return (
       <PageContainer>
@@ -98,7 +104,7 @@ export default function PeerPage() {
 
   return peer && !isLoading ? (
     <PeerProvider peer={peer} key={peerId} isPeerDetailPage={true}>
-      <PeerOverview key={peer?.id} />
+      <PeerOverview key={peerKey} />
     </PeerProvider>
   ) : (
     <FullScreenLoading />
@@ -134,9 +140,15 @@ const PeerGeneralInformation = () => {
   const { peer, user, peerGroups, update } = usePeer();
   const [name, setName] = useState(peer.name);
   const [showEditNameModal, setShowEditNameModal] = useState(false);
+  const [loginExpiration, setLoginExpiration] = useState(
+    peer.login_expiration_enabled,
+  );
+  const [inactivityExpiration, setInactivityExpiration] = useState(
+    peer.inactivity_expiration_enabled,
+  );
   const [selectedGroups, setSelectedGroups, { getAllGroupCalls }] =
     useGroupHelper({
-      initial: peerGroups?.filter((g) => g?.name !== "All"),
+      initial: peerGroups,
       peer,
     });
 
@@ -145,6 +157,8 @@ const PeerGeneralInformation = () => {
    */
   const { hasChanges, updateRef: updateHasChangedRef } = useHasChanges([
     selectedGroups,
+    loginExpiration,
+    inactivityExpiration,
   ]);
 
   const updatePeer = async (newName?: string) => {
@@ -154,6 +168,8 @@ const PeerGeneralInformation = () => {
     if (permission.peers.update) {
       const updateRequest = update({
         name: newName ?? name,
+        loginExpiration,
+        inactivityExpiration,
       });
       batchCall = groupCalls ? [...groupCalls, updateRequest] : [updateRequest];
     } else {
@@ -166,7 +182,11 @@ const PeerGeneralInformation = () => {
       promise: Promise.all(batchCall).then(() => {
         mutate("/peers/" + peer.id);
         mutate("/groups");
-        updateHasChangedRef([selectedGroups]);
+        updateHasChangedRef([
+          selectedGroups,
+          loginExpiration,
+          inactivityExpiration,
+        ]);
       }),
       loadingMessage: "Saving the peer...",
     });
@@ -217,21 +237,9 @@ const PeerGeneralInformation = () => {
             </h1>
             <LoginExpiredBadge loginExpired={peer.login_expired} />
           </div>
-          {(user?.id || user?.email) && (
-            <div className={"flex items-center gap-8"}>
-              <Paragraph className={"flex items-center"}>
-                <Link
-                  href={`/team/user?id=${user?.id}`}
-                  className={
-                    "hover:text-nb-gray-200 transition-all flex items-center gap-1"
-                  }
-                >
-                  {user?.email || user?.id}
-                  <ArrowRightIcon size={14} />
-                </Link>
-              </Paragraph>
-            </div>
-          )}
+          <div className={"flex items-center gap-8"}>
+            <Paragraph className={"flex items-center"}>{user?.email}</Paragraph>
+          </div>
         </div>
         <div className={"flex gap-4"}>
           <Button
@@ -262,7 +270,41 @@ const PeerGeneralInformation = () => {
         <PeerInformationCard peer={peer} />
 
         <div className={"flex flex-col gap-6 lg:w-1/2 transition-all"}>
-          <PeerExpirationSettings />
+          <div>
+            <PeerExpirationToggle
+              peer={peer}
+              value={loginExpiration}
+              icon={<TimerResetIcon size={16} />}
+              onChange={(state) => {
+                setLoginExpiration(state);
+                !state && setInactivityExpiration(false);
+              }}
+            />
+            {permission.peers.update && !!peer?.user_id && (
+              <div
+                className={cn(
+                  "border border-nb-gray-900 border-t-0 rounded-b-md bg-nb-gray-940 px-[1.28rem] pt-3 pb-5 flex flex-col gap-4 mx-[0.25rem]",
+                  !loginExpiration
+                    ? "opacity-50 pointer-events-none"
+                    : "bg-nb-gray-930/80",
+                )}
+              >
+                <PeerExpirationToggle
+                  peer={peer}
+                  variant={"blank"}
+                  value={inactivityExpiration}
+                  onChange={setInactivityExpiration}
+                  title={"Require login after disconnect"}
+                  description={
+                    "Enable to require authentication after users disconnect from management for 10 minutes."
+                  }
+                  className={
+                    !loginExpiration ? "opacity-40 pointer-events-none" : ""
+                  }
+                />
+              </div>
+            )}
+          </div>
 
           <PeerSSHToggle />
 

src/app/(dashboard)/settings/page.tsx

@@ -4,7 +4,6 @@ import { RestrictedAccess } from "@components/ui/RestrictedAccess";
 import { VerticalTabs } from "@components/VerticalTabs";
 import {
   AlertOctagonIcon,
-  FingerprintIcon,
   FolderGit2Icon,
   LockIcon,
   MonitorSmartphoneIcon,
@@ -20,7 +19,6 @@ import { useAccount } from "@/modules/account/useAccount";
 import AuthenticationTab from "@/modules/settings/AuthenticationTab";
 import ClientSettingsTab from "@/modules/settings/ClientSettingsTab";
 import DangerZoneTab from "@/modules/settings/DangerZoneTab";
-import IdentityProvidersTab from "@/modules/settings/IdentityProvidersTab";
 import NetworkSettingsTab from "@/modules/settings/NetworkSettingsTab";
 import PermissionsTab from "@/modules/settings/PermissionsTab";
 import GroupsSettings from "@/modules/settings/GroupsSettings";
@@ -55,13 +53,6 @@ export default function NetBirdSettings() {
                 <ShieldIcon size={14} />
                 Authentication
               </VerticalTabs.Trigger>
-              {account?.settings?.embedded_idp_enabled &&
-                permission.identity_providers.read && (
-                  <VerticalTabs.Trigger value="identity-providers">
-                    <FingerprintIcon size={14} />
-                    Identity Providers
-                  </VerticalTabs.Trigger>
-                )}
               <VerticalTabs.Trigger value="groups">
                 <FolderGit2Icon size={14} />
                 Groups
@@ -89,8 +80,6 @@ export default function NetBirdSettings() {
         >
           <div className={"border-l border-nb-gray-930 w-full"}>
             {account && <AuthenticationTab account={account} />}
-            {account?.settings?.embedded_idp_enabled &&
-              permission.identity_providers.read && <IdentityProvidersTab />}
             {account && <PermissionsTab account={account} />}
             {account && <GroupsSettings account={account} />}
             {account && <NetworkSettingsTab account={account} />}

src/app/(dashboard)/team/user/page.tsx

@@ -9,7 +9,6 @@ import { notify } from "@components/Notification";
 import Paragraph from "@components/Paragraph";
 import { PeerGroupSelector } from "@components/PeerGroupSelector";
 import Separator from "@components/Separator";
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "@components/Tabs";
 import FullScreenLoading from "@components/ui/FullScreenLoading";
 import { RestrictedAccess } from "@components/ui/RestrictedAccess";
 import useRedirect from "@hooks/useRedirect";
@@ -17,15 +16,7 @@ import { IconCirclePlus, IconSettings2 } from "@tabler/icons-react";
 import useFetchApi, { useApiCall } from "@utils/api";
 import { generateColorFromString } from "@utils/helpers";
 import dayjs from "dayjs";
-import {
-  Ban,
-  GalleryHorizontalEnd,
-  History,
-  KeyRoundIcon,
-  Mail,
-  MonitorSmartphoneIcon,
-  User2,
-} from "lucide-react";
+import { Ban, GalleryHorizontalEnd, History, Mail, User2 } from "lucide-react";
 import { useRouter, useSearchParams } from "next/navigation";
 import React, { useMemo, useState } from "react";
 import { useSWRConfig } from "swr";
@@ -42,7 +33,6 @@ import useGroupHelper from "@/modules/groups/useGroupHelper";
 import { useGroupIdsToGroups } from "@/modules/groups/useGroupIdsToGroups";
 import UserBlockCell from "@/modules/users/table-cells/UserBlockCell";
 import UserStatusCell from "@/modules/users/table-cells/UserStatusCell";
-import { UserPeersSection } from "@/modules/users/UserPeersSection";
 import { UserRoleSelector } from "@/modules/users/UserRoleSelector";
 
 export default function UserPage() {
@@ -90,7 +80,6 @@ type Props = {
 function UserOverview({ user, initialGroups }: Readonly<Props>) {
   const router = useRouter();
   const userRequest = useApiCall<User>("/users");
-  const isServiceUser = !!user?.is_service_user;
   const { mutate } = useSWRConfig();
   const { loggedInUser, isOwnerOrAdmin, isUser } = useLoggedInUser();
   const isLoggedInUser = loggedInUser ? loggedInUser?.id === user.id : false;
@@ -102,6 +91,7 @@ function UserOverview({ user, initialGroups }: Readonly<Props>) {
     });
 
   const [role, setRole] = useState(user.role || Role.User);
+
   const { hasChanges, updateRef: updateChangesRef } = useHasChanges([
     role,
     selectedGroups,
@@ -124,24 +114,13 @@ function UserOverview({ user, initialGroups }: Readonly<Props>) {
           `/${user.id}`,
         )
         .then(() => {
-          mutate(`/users?service_user=${isServiceUser}`);
+          mutate(`/users?service_user=${user.is_service_user}`);
           updateChangesRef([role, selectedGroups]);
         }),
       loadingMessage: "Saving changes...",
     });
   };
 
-  const isProfilePage = !!user?.is_current && !isServiceUser;
-  const canViewTokens = permission?.pats?.read;
-  const canViewPeers = permission?.peers?.read;
-
-  const showAccessTokens = (user?.is_current || isServiceUser) && canViewTokens;
-  const showPeers = !isServiceUser && canViewPeers;
-  const showTabs = isProfilePage && showPeers && showAccessTokens;
-  const showSeparator = !showTabs;
-
-  const [tab, setTab] = useState(isServiceUser ? "access-tokens" : "peers");
-
   return (
     <PageContainer>
       <div className={"p-default py-6 mb-4"}>
@@ -153,7 +132,7 @@ function UserOverview({ user, initialGroups }: Readonly<Props>) {
             icon={<TeamIcon size={13} />}
           />
 
-          {isServiceUser ? (
+          {user.is_service_user ? (
             <Breadcrumbs.Item
               href={"/team/service-users"}
               label={"Service Users"}
@@ -179,7 +158,7 @@ function UserOverview({ user, initialGroups }: Readonly<Props>) {
                   "w-10 h-10 rounded-full relative flex items-center justify-center text-white uppercase text-md font-medium bg-nb-gray-900"
                 }
                 style={
-                  isServiceUser
+                  user.is_service_user
                     ? {
                         color: "white",
                       }
@@ -192,13 +171,13 @@ function UserOverview({ user, initialGroups }: Readonly<Props>) {
                       }
                 }
               >
-                {isServiceUser ? (
+                {user.is_service_user ? (
                   <IconSettings2 size={16} />
                 ) : (
                   user?.name?.charAt(0) || user?.id?.charAt(0)
                 )}
               </div>
-              <h1 className={"flex items-center gap-3"} title={user?.id}>
+              <h1 className={"flex items-center gap-3"}>
                 {user.name || user.id}
               </h1>
             </div>
@@ -209,7 +188,7 @@ function UserOverview({ user, initialGroups }: Readonly<Props>) {
                 variant={"default"}
                 className={"w-full"}
                 onClick={() => {
-                  isServiceUser
+                  user.is_service_user
                     ? router.push("/team/service-users")
                     : router.push("/team/users");
                 }}
@@ -233,7 +212,7 @@ function UserOverview({ user, initialGroups }: Readonly<Props>) {
         <div className={"flex gap-10 w-full mt-8 max-w-6xl items-start"}>
           <UserInformationCard user={user} />
           <div className={"flex flex-col gap-8 w-1/2 "}>
-            {!isServiceUser && isOwnerOrAdmin && (
+            {!user.is_service_user && isOwnerOrAdmin && (
               <div>
                 <Label>Auto-assigned groups</Label>
                 <HelpText>
@@ -259,7 +238,7 @@ function UserOverview({ user, initialGroups }: Readonly<Props>) {
                 <UserRoleSelector
                   value={role}
                   onChange={setRole}
-                  hideOwner={isServiceUser}
+                  hideOwner={user.is_service_user}
                   currentUser={user}
                   disabled={isLoggedInUser || !permission.users.update}
                 />
@@ -269,65 +248,38 @@ function UserOverview({ user, initialGroups }: Readonly<Props>) {
         </div>
       </div>
 
-      {showSeparator && <Separator />}
-
-      <Tabs
-        defaultValue={tab}
-        onValueChange={setTab}
-        value={tab}
-        className={"pb-0 mb-0"}
-      >
-        <TabsList justify={"start"} className={"px-8"} hidden={!showTabs}>
-          {showPeers && (
-            <TabsTrigger value={"peers"}>
-              <MonitorSmartphoneIcon size={16} />
-              Peers
-            </TabsTrigger>
-          )}
-          {showAccessTokens && (
-            <TabsTrigger value={"access-tokens"}>
-              <KeyRoundIcon size={16} />
-              Access Tokens
-            </TabsTrigger>
-          )}
-        </TabsList>
-        {showPeers && (
-          <TabsContent value={"peers"} className={"pb-8"}>
-            <UserPeersSection user={user} />
-          </TabsContent>
-        )}
-        {showAccessTokens && (
-          <TabsContent value={"access-tokens"} className={"pb-8"}>
-            <div className={"px-8"}>
-              <div className={"max-w-6xl"}>
-                <div className={"flex justify-between items-center"}>
+      {(user.is_current || user.is_service_user) && permission.pats.read && (
+        <>
+          <Separator />
+          <div className={"px-8 py-6"}>
+            <div className={"max-w-6xl"}>
+              <div className={"flex justify-between items-center"}>
+                <div>
+                  <h2>Access Tokens</h2>
+                  <Paragraph>
+                    Access tokens give access to NetBird API.
+                  </Paragraph>
+                </div>
+                <div className={"inline-flex gap-4 justify-end"}>
                   <div>
-                    <h2>Access Tokens</h2>
-                    <Paragraph>
-                      Access tokens give access to NetBird API.
-                    </Paragraph>
-                  </div>
-                  <div className={"inline-flex gap-4 justify-end"}>
-                    <div>
-                      <CreateAccessTokenModal user={user}>
-                        <Button
-                          variant={"primary"}
-                          data-cy={"access-token-open-modal"}
-                          disabled={!permission.pats.create}
-                        >
-                          <IconCirclePlus size={16} />
-                          Create Access Token
-                        </Button>
-                      </CreateAccessTokenModal>
-                    </div>
+                    <CreateAccessTokenModal user={user}>
+                      <Button
+                        variant={"primary"}
+                        data-cy={"access-token-open-modal"}
+                        disabled={!permission.pats.create}
+                      >
+                        <IconCirclePlus size={16} />
+                        Create Access Token
+                      </Button>
+                    </CreateAccessTokenModal>
                   </div>
                 </div>
-                <AccessTokensTable user={user} />
               </div>
+              <AccessTokensTable user={user} />
             </div>
-          </TabsContent>
-        )}
-      </Tabs>
+          </div>
+        </>
+      )}
     </PageContainer>
   );
 }

src/app/(remote-access)/peer/rdp/page.tsx

@@ -4,6 +4,7 @@ import { notify } from "@components/Notification";
 import FullScreenLoading from "@components/ui/FullScreenLoading";
 import { IconCircleX } from "@tabler/icons-react";
 import useFetchApi from "@utils/api";
+import { cn } from "@utils/helpers";
 import { Loader2Icon } from "lucide-react";
 import React, { useCallback, useEffect, useRef, useState } from "react";
 import type { Peer } from "@/interfaces/Peer";
@@ -19,8 +20,6 @@ import {
   NetBirdStatus,
   useNetBirdClient,
 } from "@/modules/remote-access/useNetBirdClient";
-import { cn } from "@utils/helpers";
-import { isNetbirdSSHProtocolSupported } from "@utils/version";
 
 export default function RDPPage() {
   const { peerId } = useRDPQueryParams();
@@ -85,12 +84,7 @@ function RDPSession({ peer }: Props) {
       try {
         setCredentials(rdpCredentials);
         setIsNetBirdConnecting(true);
-        const protocol = isNetbirdSSHProtocolSupported(peer.version)
-          ? "netbird-ssh"
-          : "tcp";
-        await client.connectTemporary(peer.id, [
-          `${protocol}/${rdpCredentials.port}`,
-        ]);
+        await client.connectTemporary(peer.id, [`tcp/${rdpCredentials.port}`]);
         setIsNetBirdConnecting(false);
       } catch (error) {
         sendErrorNotification(

src/app/(remote-access)/peer/ssh/page.tsx

@@ -2,6 +2,7 @@
 
 import { PageNotFound } from "@components/ui/PageNotFound";
 import useFetchApi, { ErrorResponse } from "@utils/api";
+import { isNativeSSHSupported } from "@utils/version";
 import { CircleXIcon, InfoIcon, Loader2Icon } from "lucide-react";
 import React, { useEffect, useRef } from "react";
 import type { Peer } from "@/interfaces/Peer";
@@ -12,10 +13,6 @@ import {
   NetBirdStatus,
   useNetBirdClient,
 } from "@/modules/remote-access/useNetBirdClient";
-import {
-  isNativeSSHSupported,
-  isNetbirdSSHProtocolSupported,
-} from "@utils/version";
 
 export default function SSHPage() {
   const { peerId, username, port } = useSSHQueryParams();
@@ -91,10 +88,7 @@ function SSHTerminal({ username, port, peer }: Props) {
     connected.current = false;
     try {
       const aclPort = isNativeSSHSupported(peer.version) ? "22022" : port;
-      const protocol = isNetbirdSSHProtocolSupported(peer.version)
-        ? "netbird-ssh"
-        : "tcp";
-      const rules = [`${protocol}/${aclPort}`];
+      const rules = [`tcp/${aclPort}`];
       await client?.connectTemporary(peer.id, rules);
       await ssh({
         hostname: peer.ip,
@@ -117,10 +111,7 @@ function SSHTerminal({ username, port, peer }: Props) {
 
       try {
         const aclPort = isNativeSSHSupported(peer.version) ? "22022" : port;
-        const protocol = isNetbirdSSHProtocolSupported(peer.version)
-          ? "netbird-ssh"
-          : "tcp";
-        const rules = [`${protocol}/${aclPort}`];
+        const rules = [`tcp/${aclPort}`];
         await client?.connectTemporary(peer.id, rules);
         const res = await ssh({
           hostname: peer.ip,

src/app/not-found.tsx

@@ -36,6 +36,6 @@ export default function NotFound() {
 
 const Redirect = ({ url, queryParams }: Props) => {
   const params = queryParams && `?${queryParams}`;
-  useRedirect(url == "/" ? `/peers${params}` : `${url}${params}`, true);
+  useRedirect(url == "/" ? `/peers${params}` : `${url}${params}`);
   return <FullScreenLoading />;
 };

src/app/page.tsx

@@ -37,6 +37,6 @@ export default function Home() {
 
 const Redirect = ({ url, queryParams }: Props) => {
   const params = queryParams && `?${queryParams}`;
-  useRedirect(url == "/" ? `/peers${params}` : `${url}${params}`, true);
+  useRedirect(url == "/" ? `/peers${params}` : `${url}${params}`);
   return <FullScreenLoading />;
 };

src/app/setup/layout.tsx

@@ -1,8 +0,0 @@
-import { globalMetaTitle } from "@utils/meta";
-import type { Metadata } from "next";
-import BlankLayout from "@/layouts/BlankLayout";
-
-export const metadata: Metadata = {
-  title: `Instance Setup - ${globalMetaTitle}`,
-};
-export default BlankLayout;

src/app/setup/page.tsx

@@ -1,22 +0,0 @@
-"use client";
-
-import InstanceSetupWizard from "@/modules/instance-setup/InstanceSetupWizard";
-import { useInstanceSetup } from "@/contexts/InstanceSetupProvider";
-import { useRouter } from "next/navigation";
-import FullScreenLoading from "@components/ui/FullScreenLoading";
-import { useEffect } from "react";
-
-export default function SetupPage() {
-  const { setupRequired, loading } = useInstanceSetup();
-  const router = useRouter();
-
-  useEffect(() => {
-    if (!loading && !setupRequired) router.replace("/peers");
-  }, [loading, setupRequired]);
-
-  return loading || !setupRequired ? (
-    <FullScreenLoading />
-  ) : (
-    <InstanceSetupWizard />
-  );
-}

src/assets/icons/AuthentikIcon.tsx

@@ -1,28 +0,0 @@
-import { iconProperties, IconProps } from "@/assets/icons/IconProperties";
-
-export default function AuthentikIcon(props: Readonly<IconProps>) {
-  return (
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      viewBox="-0.03 59.9 512.03 392.1"
-      {...iconProperties(props)}
-    >
-      <path
-        d="M279.9 141h17.9v51.2h-17.9zm46.6-2.2h17.9v40h-17.9zM65.3 197.3c-24 0-46 13.2-57.4 34.3h30.4c13.5-11.6 33-15 47.1 0h32.2c-12.6-17.1-31.4-34.3-52.3-34.3"
-        fill="#fd4b2d"
-      />
-      <path
-        d="M108.7 262.4C66.8 350-6.6 275.3 38.3 231.5H7.9C-15.9 273 17 329 65.3 327.8c37.4 0 68.2-55.5 68.2-65.3 0-4.3-6-17.6-16-31H85.4c10.7 9.7 20 23.7 23.3 30.9m1.1-2.6"
-        fill="#fd4b2d"
-      />
-      <path
-        d="M512 140.3v231.3c0 44.3-36.1 80.4-80.4 80.4h-34.1v-78.8h-163V452h-34.1c-44.4 0-80.4-36.1-80.4-80.4v-72.8h258.4v-139H253.6V238H119.9v-97.6c0-3.1.2-6.2.5-9.2.4-3.7 1.1-7.3 2-10.8.3-1.1.6-2.3 1-3.4.1-.3.2-.6.3-.8.2-.6.4-1.1.5-1.7.2-.5.4-1.1.6-1.7s.5-1.2.7-1.8.5-1.2.8-1.8c2-4.7 4.4-9.3 7.3-13.6l.1-.1c.7-1.1 1.5-2.1 2.3-3.2.7-.9 1.3-1.7 2-2.6.8-.9 1.6-1.9 2.4-2.8s1.6-1.8 2.4-2.6l.1-.1c.4-.5.9-.9 1.4-1.4 3-2.9 6.2-5.6 9.6-8 .9-.7 1.9-1.3 2.8-1.9 1.1-.7 2.2-1.4 3.3-2 2.1-1.2 4.2-2.4 6.5-3.4.7-.3 1.4-.7 2.1-1 3.1-1.3 6.2-2.5 9.4-3.4 1.2-.4 2.5-.7 3.7-1 .6-.2 1.2-.3 1.8-.4 3.6-.8 7.2-1.3 10.9-1.6l1.6-.1h.8c1.2-.1 2.4-.1 3.7-.1h231.3c1.2 0 2.5 0 3.7.1h.8l1.6.1c3.7.3 7.3.8 10.9 1.6.6.1 1.2.3 1.8.4 1.3.3 2.5.6 3.7 1 3.2.9 6.3 2.1 9.4 3.4.7.3 1.4.6 2.1 1 2.2 1 4.4 2.2 6.5 3.4 1.1.7 2.2 1.3 3.3 2 1 .6 1.9 1.3 2.8 1.9 3.9 2.8 7.6 6 11 9.4.8.8 1.7 1.7 2.4 2.6.8.9 1.6 1.9 2.4 2.8.7.8 1.3 1.7 2 2.6.8 1.1 1.5 2.1 2.3 3.2l.1.1c2.9 4.3 5.3 8.8 7.3 13.6.2.6.5 1.2.8 1.8.2.6.5 1.2.7 1.8.2.5.4 1.1.6 1.7s.4 1.1.5 1.7c.1.3.2.6.3.8.3 1.1.7 2.3 1 3.4.9 3.6 1.6 7.2 2 10.8 0 3.1.2 6.1.2 9.2"
-        fill="#fd4b2d"
-      />
-      <path
-        d="M498.3 95.5H133.5c14.9-22.2 40-35.6 66.7-35.6h231.3c26.9 0 51.9 13.4 66.8 35.6m13.2 35.6H120.4c1.4-12.8 6-25 13.1-35.6h364.8c7.2 10.6 11.7 22.9 13.2 35.6m.5 9.2v26.4H378.3v-6.9H253.6v6.9H119.9v-26.4c0-3.1.2-6.2.5-9.2h391.1c.3 3.1.5 6.1.5 9.2M119.9 166.7h133.7v35.6H119.9zm258.4 0H512v35.6H378.3zm-258.4 35.6h133.7v35.6H119.9zm258.4 0H512v35.6H378.3z"
-        fill="#fd4b2d"
-      />
-    </svg>
-  );
-}

src/assets/icons/DNSZoneIcon.tsx

@@ -1,19 +0,0 @@
-import { iconProperties, IconProps } from "@/assets/icons/IconProperties";
-
-export default function DNSZoneIcon(props: IconProps) {
-  return (
-    <svg
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      xmlns="http://www.w3.org/2000/svg"
-      {...iconProperties(props)}
-    >
-      <path
-        fillRule="evenodd"
-        d="M5 5a2 2 0 0 0-2 2v3a1 1 0 0 0 1 1h16a1 1 0 0 0 1-1V7a2 2 0 0 0-2-2H5Zm9 2a1 1 0 1 0 0 2h.01a1 1 0 1 0 0-2H14Zm3 0a1 1 0 1 0 0 2h.01a1 1 0 1 0 0-2H17ZM3 17v-3a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2Zm11-2a1 1 0 1 0 0 2h.01a1 1 0 1 0 0-2H14Zm3 0a1 1 0 1 0 0 2h.01a1 1 0 1 0 0-2H17Z"
-        clipRule="evenodd"
-      />
-    </svg>
-  );
-}