jnd/beszel-ipv6
1
0
Fork 0
mirror of https://github.com/henrygd/beszel.git synced 2026-09-26 19:37:47 +02:00
Code Issues Packages Projects Releases 2 Wiki Activity

use tooltip for all systems table cell

Browse Source
This commit is contained in:
henrygd
2026-09-25 18:53:04 -04:00
parent 24792aa24f
commit 46fa7c581e
1 changed files with 35 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
internal/site/src/components/systems-table/systems-table-columns.tsx
View File

@@ -39,7 +39,7 @@ import {
} from "@/lib/utils" } from "@/lib/utils"
import { batteryStateTranslations } from "@/lib/i18n" import { batteryStateTranslations } from "@/lib/i18n"
import { connectedWiFi, strongestWiFi, strongestWiFiSignal } from "@/lib/wifi" import { connectedWiFi, strongestWiFi, strongestWiFiSignal } from "@/lib/wifi"
import type { SystemRecord } from "@/types" import type { SystemRecord, WiFi } from "@/types"
import { SystemDialog } from "../add-system" import { SystemDialog } from "../add-system"
import AlertButton from "../alerts/alert-button" import AlertButton from "../alerts/alert-button"
import { $router, Link } from "../router" import { $router, Link } from "../router"
@@ -363,25 +363,41 @@ export function SystemsTableColumns(viewMode: "table" | "grid"): ColumnDef<Syste
return null return null
} }
const displayedConnections = viewMode === "table" ? [strongest] : connections const displayedConnections = viewMode === "table" ? [strongest] : connections
const title = connections const signal = (wifi: WiFi) => (wifi.r === undefined ? "—" : `${wifi.r} dBm`)
.map(([id, wifi]) => `${id}${wifi.s ? ` (${wifi.s})` : ""}: ${wifi.r === undefined ? "—" : `${wifi.r} dBm`}`)
.join("\n")
return ( return (
<Link <Tooltip>
href={getPagePath($router, "system", { id: info.row.original.id })} <TooltipTrigger asChild>
tabIndex={-1} <Link
className="flex flex-col gap-0.5 min-w-0 py-1 relative z-10" href={getPagePath($router, "system", { id: info.row.original.id })}
title={title} tabIndex={-1}
> className="flex flex-col gap-0.5 min-w-0 py-1 relative z-10"
{displayedConnections.map(([id, wifi]) => ( >
<span key={id} className="tabular-nums whitespace-nowrap"> {displayedConnections.map(([id, wifi]) => (
{wifi.r === undefined ? "—" : `${wifi.r} dBm`} <span key={id} className="tabular-nums whitespace-nowrap">
</span> {signal(wifi)}
))} </span>
{viewMode === "table" && connections.length > 1 && ( ))}
<span className="text-xs text-muted-foreground">+{connections.length - 1}</span> {viewMode === "table" && connections.length > 1 && (
)} <span className="text-xs text-muted-foreground">+{connections.length - 1}</span>
</Link> )}
</Link>
</TooltipTrigger>
<TooltipContent side="right" className="max-w-xs pb-2">
<div className="grid gap-1">
{connections.map(([id, wifi]) => (
<div key={id} className="grid gap-0.5">
<div className="text-[0.65rem] max-w-40 text-muted-foreground uppercase tracking-wide truncate">
{id}
</div>
<div className="flex gap-2 items-center tabular-nums text-xs">
<span className="shrink-0">{signal(wifi)}</span>
{wifi.s && <span className="truncate max-w-40">{wifi.s}</span>}
</div>
</div>
))}
</div>
</TooltipContent>
</Tooltip>
) )
}, },
}, },