Remove linux router restriction

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

@@ -23,7 +23,6 @@ import Separator from "@components/Separator";
 import FullScreenLoading from "@components/ui/FullScreenLoading";
 import LoginExpiredBadge from "@components/ui/LoginExpiredBadge";
 import TextWithTooltip from "@components/ui/TextWithTooltip";
-import { getOperatingSystem } from "@hooks/useOperatingSystem";
 import useRedirect from "@hooks/useRedirect";
 import { IconCloudLock, IconInfoCircle } from "@tabler/icons-react";
 import useFetchApi from "@utils/api";
@@ -95,14 +94,6 @@ function PeerOverview() {
       peer,
     });
 
-  /**
-   * Check the operating system of the peer, if it is linux, then show the routes table, otherwise hide it.
-   */
-  const isLinux = useMemo(() => {
-    const operatingSystem = getOperatingSystem(peer.os);
-    return operatingSystem == OperatingSystem.LINUX;
-  }, [peer.os]);
-
   /**
    * Detect if there are changes in the peer information, if there are changes, then enable the save button.
    */
@@ -317,7 +308,7 @@ function PeerOverview() {
           </div>
         </div>
 
-        {isLinux && !isUser ? (
+        {!isUser ? (
           <>
             <Separator />
             <PeerNetworkRoutesSection peer={peer} />

src/components/PeerSelector.tsx

@@ -3,29 +3,22 @@ import { DropdownInput } from "@components/DropdownInput";
 import { Popover, PopoverContent, PopoverTrigger } from "@components/Popover";
 import TextWithTooltip from "@components/ui/TextWithTooltip";
 import { VirtualScrollAreaList } from "@components/VirtualScrollAreaList";
+import { getOperatingSystem } from "@hooks/useOperatingSystem";
 import { useSearch } from "@hooks/useSearch";
 import useFetchApi from "@utils/api";
 import { cn } from "@utils/helpers";
 import { sortBy, unionBy } from "lodash";
 import { ChevronsUpDown, MapPin } from "lucide-react";
 import * as React from "react";
 import { memo, useEffect, useState } from "react";
-import { FcLinux } from "react-icons/fc";
 import { useElementSize } from "@/hooks/useElementSize";
-import { getOperatingSystem } from "@/hooks/useOperatingSystem";
 import { OperatingSystem } from "@/interfaces/OperatingSystem";
 import { Peer } from "@/interfaces/Peer";
+import { OSLogo } from "@/modules/peers/PeerOSCell";
 
 const MapPinIcon = memo(() => <MapPin size={12} />);
 MapPinIcon.displayName = "MapPinIcon";
 
-const LinuxIcon = memo(() => (
-  <span className={"grayscale brightness-[100%] contrast-[40%]"}>
-    <FcLinux className={"text-white text-lg min-w-[20px] brightness-150"} />
-  </span>
-));
-LinuxIcon.displayName = "LinuxIcon";
-
 interface MultiSelectProps {
   value?: Peer;
   onChange: React.Dispatch<React.SetStateAction<Peer | undefined>>;
@@ -63,11 +56,6 @@ export function PeerSelector({
     // Sort
     let options = sortBy([...peers], "name") as Peer[];
 
-    // Filter out peers that are not linux
-    options = options.filter((peer) => {
-      return getOperatingSystem(peer.os) === OperatingSystem.LINUX;
-    });
-
     // Filter out excluded peers
     if (excludedPeers) {
       options = options.filter((peer) => {
@@ -128,7 +116,6 @@ export function PeerSelector({
                 }
               >
                 <div className={"flex items-center gap-2.5 text-sm"}>
-                  <LinuxIcon />
                   <TextWithTooltip text={value.name} maxChars={20} />
                 </div>
 
@@ -151,7 +138,7 @@ export function PeerSelector({
       </PopoverTrigger>
       <PopoverContent
         hideWhenDetached={false}
-        className="w-full p-0 shadow-sm  shadow-nb-gray-950"
+        className="w-full p-0 shadow-sm shadow-nb-gray-950"
         style={{
           width: width,
         }}
@@ -169,9 +156,7 @@ export function PeerSelector({
           {unfilteredItems.length == 0 && !search && (
             <div className={"max-w-xs mx-auto"}>
               <DropdownInfoText>
-                {
-                  "Seems like you don't have any Linux peers to assign as a routing peer."
-                }
+                {"No peers available to select."}
               </DropdownInfoText>
             </div>
           )}
@@ -187,6 +172,7 @@ export function PeerSelector({
               items={filteredItems}
               onSelect={togglePeer}
               renderItem={(option) => {
+                const os = getOperatingSystem(option.os);
                 return (
                   <>
                     <div
@@ -197,7 +183,17 @@ export function PeerSelector({
                           : "text-nb-gray-300",
                       )}
                     >
-                      <LinuxIcon />
+                      <div
+                        className={cn(
+                          "flex items-center justify-center grayscale brightness-[100%] contrast-[40%]",
+                          "w-4 h-4 shrink-0",
+                          os === OperatingSystem.WINDOWS && "p-[2.5px]",
+                          os === OperatingSystem.APPLE && "p-[2.5px]",
+                          os === OperatingSystem.FREEBSD && "p-[1.5px]",
+                        )}
+                      >
+                        <OSLogo os={option.os} />
+                      </div>
                       <TextWithTooltip text={option.name} maxChars={20} />
                     </div>
 

src/modules/exit-node/ExitNodeDropdownButton.tsx

@@ -16,10 +16,9 @@ type Props = {
 
 export const ExitNodeDropdownButton = ({ peer }: Props) => {
   const [modal, setModal] = useState(false);
-  const isLinux = getOperatingSystem(peer.os) === OperatingSystem.LINUX;
   const hasExitNodes = useHasExitNodes(peer);
 
-  return isLinux ? (
+  return (
     <>
       <DropdownMenuItem onClick={() => setModal(true)}>
         <div className={"flex gap-3 items-center w-full"}>
@@ -55,5 +54,5 @@ export const ExitNodeDropdownButton = ({ peer }: Props) => {
         )}
       </Modal>
     </>
-  ) : null;
+  );
 };

src/modules/networks/routing-peers/NetworkRoutingPeerModal.tsx

@@ -122,6 +122,7 @@ function RoutingPeerModalContent({
   const [enabled, setEnabled] = useState<boolean>(
     router ? router.enabled : true,
   );
+
   const [metric, setMetric] = useState(
     router?.metric ? router.metric.toString() : "9999",
   );
@@ -244,8 +245,8 @@ function RoutingPeerModalContent({
                 <SegmentedTabs.Content value={"peer"}>
                   <div>
                     <HelpText>
-                      Assign a single or multiple Linux peers as routing peers
-                      for the network.
+                      Assign a single or multiple peers as routing peers for the
+                      network.
                     </HelpText>
                     <PeerSelector
                       onChange={setRoutingPeer}
@@ -256,8 +257,8 @@ function RoutingPeerModalContent({
                 <SegmentedTabs.Content value={"group"}>
                   <div>
                     <HelpText>
-                      Assign a peer group with Linux machines to be used as
-                      routing peers.
+                      Assign a peer group with machines to be used as routing
+                      peers.
                     </HelpText>
                     <PeerGroupSelector
                       max={1}
@@ -273,7 +274,7 @@ function RoutingPeerModalContent({
               <div>
                 <Label>{"Don't have a routing peer?"}</Label>
                 <HelpText className={""}>
-                  You can install NetBird with a setup key on one or more Linux
+                  You can install NetBird with a setup key on one or more
                   machines to act as routing peers.
                 </HelpText>
               </div>
@@ -419,7 +420,7 @@ const InstallNetBirdWithSetupKeyButton = ({
     const choice = await confirm({
       title: `Create a Setup Key?`,
       description:
-        "If you continue, a one-off setup key will be automatically created and you will be able to install NetBird on a Linux machine.",
+        "If you continue, a one-off setup key will be automatically created and you will be able to install NetBird.",
       confirmText: "Continue",
       cancelText: "Cancel",
       type: "default",

src/modules/routes/RouteModal.tsx

@@ -611,7 +611,7 @@ export function RouteModalContent({
                 <SegmentedTabs.Content value={"peer-group"}>
                   <div>
                     <HelpText>
-                      Assign a peer group with Linux machines to be used as
+                      Assign a peer group with machines to be used as
                       {exitNode ? " exit nodes." : " routing peers."}
                     </HelpText>
                     <PeerGroupSelector

src/modules/routes/RouteUpdateModal.tsx

@@ -380,7 +380,7 @@ function RouteUpdateModalContent({ onSuccess, route, cell }: ModalProps) {
               <div>
                 <Label>Peer Group</Label>
                 <HelpText>
-                  Assign a peer group with Linux machines to be used as
+                  Assign a peer group with machines to be used as
                   {isExitNode ? " exit nodes." : " routing peers."}
                 </HelpText>
                 <PeerGroupSelector

src/modules/setup-netbird-modal/MacOSTab.tsx

@@ -23,12 +23,19 @@ import {
 import Link from "next/link";
 import React from "react";
 import { OperatingSystem } from "@/interfaces/OperatingSystem";
-import { SetupKeyParameter } from "@/modules/setup-netbird-modal/SetupModal";
+import {
+  RoutingPeerSetupKeyInfo,
+  SetupKeyParameter,
+} from "@/modules/setup-netbird-modal/SetupModal";
 
 type Props = {
   setupKey?: string;
+  showSetupKeyInfo?: boolean;
 };
-export default function MacOSTab({ setupKey }: Readonly<Props>) {
+export default function MacOSTab({
+  setupKey,
+  showSetupKeyInfo,
+}: Readonly<Props>) {
   return (
     <TabsContent value={String(OperatingSystem.APPLE)}>
       <TabsContentPadding>
@@ -104,7 +111,11 @@ export default function MacOSTab({ setupKey }: Readonly<Props>) {
 
           {setupKey ? (
             <Steps.Step step={GRPC_API_ORIGIN ? 3 : 2} line={false}>
-              <p>Open Terminal and run NetBird</p>
+              <p>
+                Open Terminal and run NetBird{" "}
+                {showSetupKeyInfo && <RoutingPeerSetupKeyInfo />}
+              </p>
+
               <Code>
                 <Code.Line>
                   {getNetBirdUpCommand()}
@@ -143,7 +154,10 @@ export default function MacOSTab({ setupKey }: Readonly<Props>) {
                   </Code>
                 </Steps.Step>
                 <Steps.Step step={2} line={false}>
-                  <p>Run NetBird {!setupKey && "and log in the browser"}</p>
+                  <p>
+                    Run NetBird {!setupKey && "and log in the browser"}
+                    {showSetupKeyInfo && <RoutingPeerSetupKeyInfo />}
+                  </p>
                   <Code>
                     <Code.Line>
                       {getNetBirdUpCommand()}
@@ -200,7 +214,10 @@ export default function MacOSTab({ setupKey }: Readonly<Props>) {
                   </Code>
                 </Steps.Step>
                 <Steps.Step step={4} line={false}>
-                  <p>Run NetBird {!setupKey && "and log in the browser"}</p>
+                  <p>
+                    Run NetBird {!setupKey && "and log in the browser"}
+                    {showSetupKeyInfo && <RoutingPeerSetupKeyInfo />}
+                  </p>
                   <Code>
                     <Code.Line>
                       {getNetBirdUpCommand()}

src/modules/setup-netbird-modal/SetupModal.tsx

@@ -115,26 +115,22 @@ export function SetupModalContent({
             Linux
           </TabsTrigger>
 
-          {!showOnlyRoutingPeerOS && (
-            <>
-              <TabsTrigger value={String(OperatingSystem.WINDOWS)}>
-                <WindowsIcon
-                  className={
-                    "fill-nb-gray-500 group-data-[state=active]/trigger:fill-netbird transition-all"
-                  }
-                />
-                Windows
-              </TabsTrigger>
-              <TabsTrigger value={String(OperatingSystem.APPLE)}>
-                <AppleIcon
-                  className={
-                    "fill-nb-gray-500 group-data-[state=active]/trigger:fill-netbird transition-all"
-                  }
-                />
-                macOS
-              </TabsTrigger>
-            </>
-          )}
+          <TabsTrigger value={String(OperatingSystem.WINDOWS)}>
+            <WindowsIcon
+              className={
+                "fill-nb-gray-500 group-data-[state=active]/trigger:fill-netbird transition-all"
+              }
+            />
+            Windows
+          </TabsTrigger>
+          <TabsTrigger value={String(OperatingSystem.APPLE)}>
+            <AppleIcon
+              className={
+                "fill-nb-gray-500 group-data-[state=active]/trigger:fill-netbird transition-all"
+              }
+            />
+            macOS
+          </TabsTrigger>
 
           {!setupKey && (
             <>
@@ -171,8 +167,14 @@ export function SetupModalContent({
           setupKey={setupKey}
           showSetupKeyInfo={showOnlyRoutingPeerOS}
         />
-        <WindowsTab setupKey={setupKey} />
-        <MacOSTab setupKey={setupKey} />
+        <WindowsTab
+          setupKey={setupKey}
+          showSetupKeyInfo={showOnlyRoutingPeerOS}
+        />
+        <MacOSTab
+          setupKey={setupKey}
+          showSetupKeyInfo={showOnlyRoutingPeerOS}
+        />
 
         {!setupKey && (
           <>

src/modules/setup-netbird-modal/WindowsTab.tsx

@@ -7,13 +7,20 @@ import { DownloadIcon, PackageOpenIcon } from "lucide-react";
 import Link from "next/link";
 import React from "react";
 import { OperatingSystem } from "@/interfaces/OperatingSystem";
-import { SetupKeyParameter } from "@/modules/setup-netbird-modal/SetupModal";
+import {
+  RoutingPeerSetupKeyInfo,
+  SetupKeyParameter,
+} from "@/modules/setup-netbird-modal/SetupModal";
 
 type Props = {
   setupKey?: string;
+  showSetupKeyInfo?: boolean;
 };
 
-export default function WindowsTab({ setupKey }: Readonly<Props>) {
+export default function WindowsTab({
+  setupKey,
+  showSetupKeyInfo,
+}: Readonly<Props>) {
   return (
     <TabsContent value={String(OperatingSystem.WINDOWS)}>
       <TabsContentPadding>
@@ -51,7 +58,11 @@ export default function WindowsTab({ setupKey }: Readonly<Props>) {
 
           {setupKey ? (
             <Steps.Step step={GRPC_API_ORIGIN ? 3 : 2} line={false}>
-              <p>Open Command-line and run NetBird</p>
+              <p>
+                Open Command-line and run NetBird{" "}
+                {showSetupKeyInfo && <RoutingPeerSetupKeyInfo />}
+              </p>
+
               <Code>
                 <Code.Line>
                   {getNetBirdUpCommand()}