diff --git a/src/components/PeerSelector.tsx b/src/components/PeerSelector.tsx
index 05afa5b..8a5f5dc 100644
--- a/src/components/PeerSelector.tsx
+++ b/src/components/PeerSelector.tsx
@@ -1,7 +1,6 @@
import { CommandItem } from "@components/Command";
import { Popover, PopoverContent, PopoverTrigger } from "@components/Popover";
import { ScrollArea } from "@components/ScrollArea";
-import SmallOSIcon from "@components/ui/SmallOSIcon";
import TextWithTooltip from "@components/ui/TextWithTooltip";
import { IconArrowBack } from "@tabler/icons-react";
import useFetchApi from "@utils/api";
@@ -11,6 +10,7 @@ import { sortBy, trim, unionBy } from "lodash";
import { ChevronsUpDown, MapPin, SearchIcon } from "lucide-react";
import * as React from "react";
import { useEffect, useMemo, useState } from "react";
+import { FcLinux } from "react-icons/fc";
import { useElementSize } from "@/hooks/useElementSize";
import { getOperatingSystem } from "@/hooks/useOperatingSystem";
import { OperatingSystem } from "@/interfaces/OperatingSystem";
@@ -45,7 +45,7 @@ export function PeerSelector({
// Filter out peers that are not linux
options = options.filter((peer) => {
- return getOperatingSystem(peer.os) == OperatingSystem.LINUX;
+ return getOperatingSystem(peer.os) === OperatingSystem.LINUX;
});
// Filter out excluded peers
@@ -56,7 +56,7 @@ export function PeerSelector({
});
}
- setDropdownOptions(unionBy(options, dropdownOptions, "name"));
+ setDropdownOptions(unionBy(options, dropdownOptions, "id"));
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [peers]);
@@ -100,6 +100,12 @@ export function PeerSelector({
}
}, [open, dropdownOptions]);
+ const LinuxIcon = (
+
+
+
+ );
+
return (
-
+ {LinuxIcon}
@@ -249,7 +255,7 @@ export function PeerSelector({
}}
>
-
+ {LinuxIcon}
diff --git a/src/components/ui/SmallOSIcon.tsx b/src/components/ui/SmallOSIcon.tsx
deleted file mode 100644
index 0a7dbd5..0000000
--- a/src/components/ui/SmallOSIcon.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-import Image from "next/image";
-import { useMemo } from "react";
-import { FaWindows } from "react-icons/fa6";
-import { FcAndroidOs, FcLinux } from "react-icons/fc";
-import AppleLogo from "@/assets/os-icons/apple.svg";
-import { getOperatingSystem } from "@/hooks/useOperatingSystem";
-import { OperatingSystem } from "@/interfaces/OperatingSystem";
-
-export default function SmallOSIcon({ os }: { os: string }) {
- const icon = useMemo(() => {
- return getOperatingSystem(os.toLowerCase());
- }, [os]);
-
- if (icon === OperatingSystem.WINDOWS)
- return ;
- if (icon === OperatingSystem.APPLE)
- return (
-
-
-
- );
- if (icon === OperatingSystem.ANDROID)
- return ;
-
- return ;
-}
diff --git a/src/hooks/useOperatingSystem.ts b/src/hooks/useOperatingSystem.ts
index f60493e..6eb0dc9 100644
--- a/src/hooks/useOperatingSystem.ts
+++ b/src/hooks/useOperatingSystem.ts
@@ -13,10 +13,13 @@ export default function useOperatingSystem() {
}
export const getOperatingSystem = (os: string) => {
- if (os.includes("darwin")) return OperatingSystem.APPLE as const;
- if (os.includes("mac")) return OperatingSystem.APPLE as const;
- if (os.includes("android")) return OperatingSystem.ANDROID as const;
- if (os.includes("ios")) return OperatingSystem.IOS as const;
- if (os.includes("win")) return OperatingSystem.WINDOWS as const;
+ if (os.toLowerCase().includes("darwin"))
+ return OperatingSystem.APPLE as const;
+ if (os.toLowerCase().includes("mac")) return OperatingSystem.APPLE as const;
+ if (os.toLowerCase().includes("android"))
+ return OperatingSystem.ANDROID as const;
+ if (os.toLowerCase().includes("ios")) return OperatingSystem.IOS as const;
+ if (os.toLowerCase().includes("windows"))
+ return OperatingSystem.WINDOWS as const;
return OperatingSystem.LINUX as const;
};
diff --git a/src/modules/peers/PeerOSCell.tsx b/src/modules/peers/PeerOSCell.tsx
index a823bed..13e1f31 100644
--- a/src/modules/peers/PeerOSCell.tsx
+++ b/src/modules/peers/PeerOSCell.tsx
@@ -42,7 +42,7 @@ export function PeerOSCell({ os }: { os: string }) {
export function OSLogo({ os }: { os: string }) {
const icon = useMemo(() => {
- return getOperatingSystem(os.toLowerCase());
+ return getOperatingSystem(os);
}, [os]);
if (icon === OperatingSystem.WINDOWS)