show additional disk percentages in systems table (#1365)

agent/agent.go

@@ -166,7 +166,7 @@ func (a *Agent) gatherStats(cacheTimeMs uint16) *system.CombinedData {
 	}
 
 	data.Stats.ExtraFs = make(map[string]*system.FsStats)
-	data.Info.ExtraFsPct = make(map[string]system.ExtraFsInfo)
+	data.Info.ExtraFsPct = make(map[string]float64)
 	for name, stats := range a.fsStats {
 		if !stats.Root && stats.DiskTotal > 0 {
 			// Use custom name if available, otherwise use device name
@@ -175,10 +175,10 @@ func (a *Agent) gatherStats(cacheTimeMs uint16) *system.CombinedData {
 				key = stats.Name
 			}
 			data.Stats.ExtraFs[key] = stats
-			// Add percentage info to Info struct for dashboard
+			// Add percentages to Info struct for dashboard
 			if stats.DiskTotal > 0 {
-				pct := (stats.DiskUsed / stats.DiskTotal) * 100
-				data.Info.ExtraFsPct[key] = system.ExtraFsInfo{DiskPct: pct}
+				pct := twoDecimals((stats.DiskUsed / stats.DiskTotal) * 100)
+				data.Info.ExtraFsPct[key] = pct
 			}
 		}
 	}

internal/entities/system/system.go

@@ -99,11 +99,6 @@ type FsStats struct {
 	MaxDiskWriteBytes uint64 `json:"wbm,omitempty" cbor:"-"`
 }
 
-// ExtraFsInfo contains summary info for extra filesystems in the system info
-type ExtraFsInfo struct {
-	DiskPct float64 `json:"dp" cbor:"0,keyasint"`
-}
-
 type NetIoStats struct {
 	BytesRecv uint64
 	BytesSent uint64
@@ -149,9 +144,9 @@ type Info struct {
 	LoadAvg15      float64 `json:"l15,omitempty" cbor:"17,keyasint,omitempty"`
 	BandwidthBytes uint64  `json:"bb" cbor:"18,keyasint"`
 	// TODO: remove load fields in future release in favor of load avg array
-	LoadAvg        [3]float64     `json:"la,omitempty" cbor:"19,keyasint"`
-	ConnectionType ConnectionType `json:"ct,omitempty" cbor:"20,keyasint,omitempty,omitzero"`
-	ExtraFsPct     map[string]ExtraFsInfo `json:"efsp,omitempty" cbor:"21,keyasint,omitempty"`
+	LoadAvg        [3]float64         `json:"la,omitempty" cbor:"19,keyasint"`
+	ConnectionType ConnectionType     `json:"ct,omitempty" cbor:"20,keyasint,omitempty,omitzero"`
+	ExtraFsPct     map[string]float64 `json:"efs,omitempty" cbor:"21,keyasint,omitempty"`
 }
 
 // Final data structure to return to the hub

internal/site/src/components/systems-table/systems-table-columns.tsx

@@ -356,86 +356,73 @@ function TableCellWithMeter(info: CellContext<SystemRecord, unknown>) {
 }
 
 function DiskCellWithMultiple(info: CellContext<SystemRecord, unknown>) {
-	const { info: sysInfo, status } = info.row.original
+	const { info: sysInfo, status, id } = info.row.original
+	const extraFs = Object.entries(sysInfo.efs ?? {})
+
+	// No extra disks - show basic meter
+	if (extraFs.length === 0) {
+		return TableCellWithMeter(info)
+	}
+
 	const rootDiskPct = sysInfo.dp
-	const extraFsData = sysInfo.efsp
-	const extraFsCount = extraFsData ? Object.keys(extraFsData).length : 0
-
-	const threshold = getMeterState(rootDiskPct)
-	const meterClass = cn(
-		"h-full",
-		(status !== SystemStatus.Up && STATUS_COLORS.paused) ||
-			(threshold === MeterState.Good && STATUS_COLORS.up) ||
-			(threshold === MeterState.Warn && STATUS_COLORS.pending) ||
-			STATUS_COLORS.down
-	)
-
-	// No extra disks - show simple meter
-	if (extraFsCount === 0) {
-		return (
-			<div className="flex gap-2 items-center tabular-nums tracking-tight w-full">
-				<span className="min-w-8 shrink-0">{decimalString(rootDiskPct, rootDiskPct >= 10 ? 1 : 2)}%</span>
-				<span className="flex-1 min-w-8 grid bg-muted h-[1em] rounded-sm overflow-hidden">
-					<span className={meterClass} style={{ width: `${rootDiskPct}%` }}></span>
-				</span>
-			</div>
+	
+	// sort extra disks by percentage descending
+	extraFs.sort((a, b) => b[1] - a[1])
+	
+	function getMeterClass(pct: number) {
+		const threshold = getMeterState(pct)
+		return cn(
+			"h-full",
+			(status !== SystemStatus.Up && STATUS_COLORS.paused) ||
+				(threshold === MeterState.Good && STATUS_COLORS.up) ||
+				(threshold === MeterState.Warn && STATUS_COLORS.pending) ||
+				STATUS_COLORS.down
 		)
 	}
 
-	// Has extra disks - show with tooltip
 	return (
 		<Tooltip>
 			<TooltipTrigger asChild>
-				<div className="flex flex-col gap-0.5 w-full cursor-help relative z-10">
+				<Link href={getPagePath($router, "system", { id })} tabIndex={-1} className="flex flex-col gap-0.5 w-full relative z-10">
 					<div className="flex gap-2 items-center tabular-nums tracking-tight">
 						<span className="min-w-8 shrink-0">{decimalString(rootDiskPct, rootDiskPct >= 10 ? 1 : 2)}%</span>
 						<span className="flex-1 min-w-8 grid bg-muted h-[1em] rounded-sm overflow-hidden">
-							<span className={meterClass} style={{ width: `${rootDiskPct}%` }}></span>
+							{/* Root disk */}
+							<span className={getMeterClass(rootDiskPct)} style={{ width: `${rootDiskPct}%` }}></span>
+							{/* Extra disks */}
+							{extraFs.map(([_name, pct], index) => (
+								<span key={index} className={getMeterClass(pct)} style={{ width: `${pct}%` }}></span>
+							))}
+
 						</span>
 					</div>
-					<div className="text-[0.7rem] text-muted-foreground ps-0.5">+{extraFsCount} more</div>
-				</div>
+				</Link>
 			</TooltipTrigger>
-			<TooltipContent side="right" className="max-w-xs">
-				<div className="flex flex-col gap-2 py-1">
-					<div className="flex items-center gap-2 text-xs font-medium">
-						<HardDriveIcon className="size-3" />
-						<span>{t`All Disks`}</span>
-					</div>
-					<div className="flex flex-col gap-1.5">
-						<div className="flex flex-col gap-0.5">
-							<div className="text-[0.65rem] text-muted-foreground uppercase tracking-wider">{t`Root`}</div>
+			<TooltipContent side="right" className="max-w-xs pb-2">
+					<div className="grid gap-1.5">
+						<div className="grid gap-0.5">
+							<div className="text-[0.65rem] text-muted-foreground uppercase tracking-wide tabular-nums">{t`Root`}</div>
 							<div className="flex gap-2 items-center tabular-nums text-xs">
 								<span className="min-w-7">{decimalString(rootDiskPct, rootDiskPct >= 10 ? 1 : 2)}%</span>
-								<span className="flex-1 min-w-12 grid bg-muted/50 h-1.5 rounded-sm overflow-hidden">
-									<span className={meterClass} style={{ width: `${rootDiskPct}%` }}></span>
+								<span className="flex-1 min-w-12 grid bg-muted h-2.5 rounded-sm overflow-hidden">
+									<span className={getMeterClass(rootDiskPct)} style={{ width: `${rootDiskPct}%` }}></span>
 								</span>
 							</div>
 						</div>
-						{extraFsData && Object.entries(extraFsData).map(([name, fs]) => {
-							const pct = fs.dp
-							const fsThreshold = getMeterState(pct)
-							const fsMeterClass = cn(
-								"h-full",
-								(status !== SystemStatus.Up && STATUS_COLORS.paused) ||
-									(fsThreshold === MeterState.Good && STATUS_COLORS.up) ||
-									(fsThreshold === MeterState.Warn && STATUS_COLORS.pending) ||
-									STATUS_COLORS.down
-							)
+						{extraFs.map(([name, pct]) => {
 							return (
-								<div key={name} className="flex flex-col gap-0.5">
-									<div className="text-[0.65rem] text-muted-foreground uppercase tracking-wider truncate">{name}</div>
+								<div key={name} className="grid gap-0.5">
+									<div className="text-[0.65rem] max-w-40 text-muted-foreground uppercase tracking-wide truncate">{name}</div>
 									<div className="flex gap-2 items-center tabular-nums text-xs">
 										<span className="min-w-7">{decimalString(pct, pct >= 10 ? 1 : 2)}%</span>
-										<span className="flex-1 min-w-12 grid bg-muted/50 h-1.5 rounded-sm overflow-hidden">
-											<span className={fsMeterClass} style={{ width: `${pct}%` }}></span>
+										<span className="flex-1 min-w-12 grid bg-muted h-2.5 rounded-sm overflow-hidden">
+											<span className={getMeterClass(pct)} style={{ width: `${pct}%` }}></span>
 										</span>
 									</div>
 								</div>
 							)
 						})}
 					</div>
-				</div>
 			</TooltipContent>
 		</Tooltip>
 	)

internal/site/src/locales/fr/fr.po

@@ -8,7 +8,7 @@ msgstr ""
 "Language: fr\n"
 "Project-Id-Version: beszel\n"
 "Report-Msgid-Bugs-To: \n"
-"PO-Revision-Date: 2025-10-28 22:59\n"
+"PO-Revision-Date: 2025-11-11 19:25\n"
 "Last-Translator: \n"
 "Language-Team: French\n"
 "Plural-Forms: nplurals=2; plural=(n > 1);\n"
@@ -990,7 +990,7 @@ msgstr "Réinitialiser le mot de passe"
 #: src/components/alerts-history-columns.tsx
 #: src/components/routes/settings/alerts-history-data-table.tsx
 msgid "Resolved"
-msgstr "Résolution"
+msgstr "Résolu"
 
 #: src/components/systems-table/systems-table-columns.tsx
 msgid "Resume"

internal/site/src/locales/sv/sv.po

@@ -8,7 +8,7 @@ msgstr ""
 "Language: sv\n"
 "Project-Id-Version: beszel\n"
 "Report-Msgid-Bugs-To: \n"
-"PO-Revision-Date: 2025-10-28 23:00\n"
+"PO-Revision-Date: 2025-11-10 01:57\n"
 "Last-Translator: \n"
 "Language-Team: Swedish\n"
 "Plural-Forms: nplurals=2; plural=(n != 1);\n"
@@ -113,11 +113,11 @@ msgstr "Justera visningsalternativ för diagram."
 #: src/components/command-palette.tsx
 #: src/components/command-palette.tsx
 msgid "Admin"
-msgstr ""
+msgstr "Admin"
 
 #: src/components/systems-table/systems-table-columns.tsx
 msgid "Agent"
-msgstr ""
+msgstr "Agent"
 
 #: src/components/command-palette.tsx
 #: src/components/routes/settings/alerts-history-data-table.tsx
@@ -448,7 +448,7 @@ msgstr "Urladdar"
 
 #: src/components/systems-table/systems-table-columns.tsx
 msgid "Disk"
-msgstr ""
+msgstr "Disk"
 
 #: src/components/routes/system.tsx
 msgid "Disk I/O"
@@ -625,7 +625,7 @@ msgstr "FreeBSD kommando"
 #. Context: Battery state
 #: src/lib/i18n.ts
 msgid "Full"
-msgstr ""
+msgstr "Full"
 
 #. Context: General settings
 #: src/components/routes/settings/general.tsx
@@ -746,7 +746,7 @@ msgstr "Manuella installationsinstruktioner"
 #. Chart select field. Please try to keep this short.
 #: src/components/routes/system.tsx
 msgid "Max 1 min"
-msgstr ""
+msgstr "Max 1 min"
 
 #: src/components/containers-table/containers-table-columns.tsx
 #: src/components/systems-table/systems-table-columns.tsx
@@ -938,7 +938,7 @@ msgstr "Vänligen logga in på ditt konto"
 
 #: src/components/add-system.tsx
 msgid "Port"
-msgstr ""
+msgstr "Port"
 
 #. Power On Time
 #: src/components/routes/system/smart-table.tsx
@@ -1183,7 +1183,7 @@ msgstr "Växla tema"
 #: src/components/add-system.tsx
 #: src/components/routes/settings/tokens-fingerprints.tsx
 msgid "Token"
-msgstr "Token"
+msgstr "Nyckel"
 
 #: src/components/command-palette.tsx
 #: src/components/routes/settings/layout.tsx
@@ -1260,7 +1260,7 @@ msgstr "Enhetsinställningar"
 #: src/components/command-palette.tsx
 #: src/components/routes/settings/tokens-fingerprints.tsx
 msgid "Universal token"
-msgstr "Universal token"
+msgstr "Universell nyckel"
 
 #. Context: Battery state
 #: src/lib/i18n.ts

internal/site/src/types.d.ts

@@ -78,12 +78,7 @@ export interface SystemInfo {
 	/** connection type */
 	ct?: ConnectionType
 	/** extra filesystem percentages */
-	efsp?: Record<string, ExtraFsInfo>
-}
-
-export interface ExtraFsInfo {
-	/** disk percent */
-	dp: number
+	efs?: Record<string, number>
 }
 
 export interface SystemStats {