From 6874f68343fcca0aed1937c21e779f4a9a3178d9 Mon Sep 17 00:00:00 2001
From: Maximilian Kaske <56969857+mxkaske@users.noreply.github.com>
Date: Sun, 26 Jul 2026 10:56:37 +0200
Subject: [PATCH] chore: dashboard small adjustments (#2445)

---
 .../(dashboard)/monitors/[id]/nav-actions.tsx | 49 ++++++++++++-------
 .../data-table/private-locations/columns.tsx  | 21 ++++----
 2 files changed, 43 insertions(+), 27 deletions(-)

diff --git a/apps/dashboard/src/app/(dashboard)/monitors/[id]/nav-actions.tsx b/apps/dashboard/src/app/(dashboard)/monitors/[id]/nav-actions.tsx
index fd4b6349..82c08d34 100644
--- a/apps/dashboard/src/app/(dashboard)/monitors/[id]/nav-actions.tsx
+++ b/apps/dashboard/src/app/(dashboard)/monitors/[id]/nav-actions.tsx
@@ -158,24 +158,37 @@ export function NavActions() {
     <div className="flex items-center gap-2 text-sm">
       <NavFeedback />
       <div className="text-muted-foreground hidden font-medium lg:inline-block">
-        {!monitor.active ? (
-          <span className="relative ml-1.5 inline-flex">
-            <span className="bg-muted-foreground/70 relative inline-flex h-2.5 w-2.5 rounded-full" />
-          </span>
-        ) : monitor.status === "active" ? (
-          <span className="relative ml-1.5 inline-flex">
-            <span className="bg-success/80 absolute inline-flex h-full w-full animate-ping rounded-full opacity-75" />
-            <span className="bg-success relative inline-flex h-2.5 w-2.5 rounded-full" />
-          </span>
-        ) : monitor.status === "error" ? (
-          <span className="relative ml-1.5 inline-flex">
-            <span className="bg-destructive relative inline-flex h-2.5 w-2.5 rounded-full" />
-          </span>
-        ) : (
-          <span className="relative ml-1.5 inline-flex">
-            <span className="bg-warning relative inline-flex h-2.5 w-2.5 rounded-full" />
-          </span>
-        )}
+        <Tooltip>
+          <TooltipTrigger asChild>
+            {!monitor.active ? (
+              <span className="relative ml-1.5 inline-flex">
+                <span className="bg-muted-foreground/70 relative inline-flex h-2.5 w-2.5 rounded-full" />
+              </span>
+            ) : monitor.status === "active" ? (
+              <span className="relative ml-1.5 inline-flex">
+                <span className="bg-success/80 absolute inline-flex h-full w-full animate-ping rounded-full opacity-75" />
+                <span className="bg-success relative inline-flex h-2.5 w-2.5 rounded-full" />
+              </span>
+            ) : monitor.status === "error" ? (
+              <span className="relative ml-1.5 inline-flex">
+                <span className="bg-destructive relative inline-flex h-2.5 w-2.5 rounded-full" />
+              </span>
+            ) : (
+              <span className="relative ml-1.5 inline-flex">
+                <span className="bg-warning relative inline-flex h-2.5 w-2.5 rounded-full" />
+              </span>
+            )}
+          </TooltipTrigger>
+          <TooltipContent>
+            {!monitor.active
+              ? "Inactive"
+              : monitor.status === "active"
+                ? "Normal"
+                : monitor.status === "error"
+                  ? "Failing"
+                  : "Degraded"}
+          </TooltipContent>
+        </Tooltip>
       </div>
       <TooltipProvider>
         <Tooltip>
diff --git a/apps/dashboard/src/components/data-table/private-locations/columns.tsx b/apps/dashboard/src/components/data-table/private-locations/columns.tsx
index 38d4c655..d01f8cc2 100644
--- a/apps/dashboard/src/components/data-table/private-locations/columns.tsx
+++ b/apps/dashboard/src/components/data-table/private-locations/columns.tsx
@@ -1,18 +1,24 @@
 "use client";
 
 import type { RouterOutputs } from "@openstatus/api";
-import { Badge } from "@openstatus/ui/components/ui/badge";
 import type { ColumnDef } from "@tanstack/react-table";
 import Link from "next/link";
 
 import { DataTableColumnHeader } from "@/components/ui/data-table/data-table-column-header";
+import { cn } from "@/lib/utils";
 
 import { TableCellBadge } from "../table-cell-badge";
 import { TableCellDate } from "../table-cell-date";
+import { TableCellText } from "../table-cell-text";
 import { DataTableRowActions } from "./data-table-row-actions";
 
 type PrivateLocation = RouterOutputs["privateLocation"]["list"][number];
 
+const statusClassName: Record<string, string> = {
+  active: "text-success",
+  error: "text-destructive",
+};
+
 export const columns: ColumnDef<PrivateLocation>[] = [
   {
     accessorKey: "name",
@@ -28,15 +34,12 @@ export const columns: ColumnDef<PrivateLocation>[] = [
     ),
     enableHiding: false,
     cell: ({ row }) => {
-      const status = row.getValue("status");
-      const isError = status === "error";
+      const value = String(row.getValue("status"));
       return (
-        <Badge
-          variant={isError ? "destructive" : "outline"}
-          className={isError ? undefined : "border-green-500/40 text-green-600"}
-        >
-          {isError ? "Error" : "Active"}
-        </Badge>
+        <TableCellText
+          value={value}
+          className={cn("font-mono", statusClassName[value])}
+        />
       );
     },
   },
-- 
2.51.2