diff --git a/beszel/site/src/components/command-palette.tsx b/beszel/site/src/components/command-palette.tsx
index dafff9f..cfb551a 100644
--- a/beszel/site/src/components/command-palette.tsx
+++ b/beszel/site/src/components/command-palette.tsx
@@ -22,7 +22,7 @@ import {
import { useEffect } from "react"
import { useStore } from "@nanostores/react"
import { $systems } from "@/lib/stores"
-import { isAdmin } from "@/lib/utils"
+import { getHostDisplayValue, isAdmin } from "@/lib/utils"
import { $router, basePath, navigate } from "./router"
import { Trans, t } from "@lingui/macro"
import { getPagePath } from "@nanostores/router"
@@ -62,7 +62,7 @@ export default function CommandPalette({ open, setOpen }: { open: boolean; setOp
>
{system.name}
- {system.host}
+ {getHostDisplayValue(system)}
))}
diff --git a/beszel/site/src/components/routes/system.tsx b/beszel/site/src/components/routes/system.tsx
index 38b1ae2..2c6545f 100644
--- a/beszel/site/src/components/routes/system.tsx
+++ b/beszel/site/src/components/routes/system.tsx
@@ -6,7 +6,15 @@ import { useStore } from "@nanostores/react"
import Spinner from "../spinner"
import { ClockArrowUp, CpuIcon, GlobeIcon, LayoutGridIcon, MonitorIcon, XIcon } from "lucide-react"
import ChartTimeSelect from "../charts/chart-time-select"
-import { chartTimeData, cn, getPbTimestamp, getSizeAndUnit, toFixedFloat, useLocalStorage } from "@/lib/utils"
+import {
+ chartTimeData,
+ cn,
+ getHostDisplayValue,
+ getPbTimestamp,
+ getSizeAndUnit,
+ toFixedFloat,
+ useLocalStorage,
+} from "@/lib/utils"
import { Separator } from "../ui/separator"
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "../ui/tooltip"
import { Button } from "../ui/button"
@@ -244,7 +252,7 @@ export default function SystemDetail({ name }: { name: string }) {
uptime =
}
return [
- { value: system.host, Icon: GlobeIcon },
+ { value: getHostDisplayValue(system), Icon: GlobeIcon },
{
value: system.info.h,
Icon: MonitorIcon,
diff --git a/beszel/site/src/lib/utils.ts b/beszel/site/src/lib/utils.ts
index 3302846..f060227 100644
--- a/beszel/site/src/lib/utils.ts
+++ b/beszel/site/src/lib/utils.ts
@@ -336,3 +336,11 @@ export const alertInfo: Record = {
desc: () => t`Triggers when any sensor exceeds a threshold`,
},
}
+
+/**
+ * Retuns value of system host, truncating full path if socket.
+ * @example
+ * // Assuming system.host is "/var/run/beszel.sock"
+ * const hostname = getHostDisplayValue(system) // hostname will be "beszel.sock"
+ */
+export const getHostDisplayValue = (system: SystemRecord): string => system.host.slice(system.host.lastIndexOf("/") + 1)