Add tags to servers, with a tag filter on the Servers page

Servers can be tagged (prod, media, rack-1, ...) for grouping. Operators
and admins edit tags inline on a server's detail page; the input suggests
tags already used on other servers so the same word ends up spelled the
same way everywhere. Tags show as chips that keep one colour per tag, on
the server cards, in the Manage table (and its CSV export), and on the
detail page, where each chip links to the Servers list filtered by that
tag. The Servers page has a tag bar with counts; picking several tags
narrows to servers that have all of them. The filter lives in the URL, so
it survives a refresh and can be linked to. Tags are also matched by the
global search.

Tags are normalized on the server (trimmed, lowercased, spaces become "-",
duplicates merged, sorted); letters in any language are allowed, plus
digits and - _ . : /, at most 30 characters and 12 per server. Invalid
input is rejected with a message naming the offending tag, and nothing is
saved. Changes are audit-logged with the before and after lists.

Stored as a JSON column on servers (migration 0010). Every server response
now returns tags as an array, and the shared response shaping strips the
token hash in one place instead of five.

Verified with 27 backend checks (normalization edge cases including
Swedish letters, roles, validation, search, audit, PATCH/detail/list
shapes) and by driving the real Servers and detail pages against the real
router in a browser (filtering, editing, invalid tag, viewer view). Real
dev database mtime untouched.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

server/src/routes/servers.ts

@@ -10,8 +10,16 @@ import { asyncHandler } from "../utils/asyncHandler.js";
 import { loadIntegrationConfig } from "../integrations/loadIntegration.js";
 import { createProxmoxAdapter, type ProxmoxGuestType } from "../integrations/proxmox/adapter.js";
 import { serverPortsRouter } from "./serverPorts.js";
+import { InvalidTagError, normalizeTags, parseTags } from "../services/serverTags.js";
 
 export const serversRouter = Router();
+
+/** A server row as the API returns it: no token hash, and tags as an array rather than the stored JSON. */
+function publicServer<T extends { apiTokenHash: string; tags: string | null }>(row: T) {
+  const { apiTokenHash: _hash, tags, ...rest } = row;
+  return { ...rest, tags: parseTags(tags) };
+}
+
 serversRouter.use(requireAuth);
 serversRouter.use("/:id/ports", serverPortsRouter);
 
@@ -25,7 +33,7 @@ const createServerSchema = z.object({
 serversRouter.get("/", asyncHandler(async (_req, res) => {
   const rows = await db.query.servers.findMany({ orderBy: (s, { asc }) => [asc(s.name)] });
   res.json({
-    servers: rows.map(({ apiTokenHash, ...rest }) => rest),
+    servers: rows.map(publicServer),
   });
 }));
 
@@ -58,7 +66,7 @@ serversRouter.post("/", requireRole("admin"), asyncHandler(async (req, res) => {
     detail: { name: created.name },
   });
 
-  const { apiTokenHash, ...serverOut } = created;
+  const serverOut = publicServer(created);
   // The full token is only ever shown once, at creation time.
   res.status(201).json({ server: serverOut, token });
 }));
@@ -85,7 +93,7 @@ serversRouter.post("/:id/rotate-token", requireRole("admin"), asyncHandler(async
     detail: { name: updated.name },
   });
 
-  const { apiTokenHash, ...serverOut } = updated;
+  const serverOut = publicServer(updated);
   res.json({ server: serverOut, token });
 }));
 
@@ -145,7 +153,7 @@ serversRouter.patch("/:id", requireRole("admin"), asyncHandler(async (req, res)
     detail: { name: updated.name },
   });
 
-  const { apiTokenHash, ...serverOut } = updated;
+  const serverOut = publicServer(updated);
   res.json({ server: serverOut });
 }));
 
@@ -232,7 +240,8 @@ serversRouter.get("/:id/detail", asyncHandler(async (req, res) => {
     .orderBy(serverLinks.label);
 
   const {
-    apiTokenHash,
+    apiTokenHash: _apiTokenHash,
+    tags: rawTags,
     ipAddresses: _rawIpAddresses,
     disks: _rawDisks,
     cpuModel: _cpuModel,
@@ -245,7 +254,43 @@ serversRouter.get("/:id/detail", asyncHandler(async (req, res) => {
     ...serverOut
   } = server;
 
-  res.json({ server: serverOut, ipAddresses, hardware, dnsMatches, links });
+  res.json({ server: { ...serverOut, tags: parseTags(rawTags) }, ipAddresses, hardware, dnsMatches, links });
+}));
+
+const tagsSchema = z.object({ tags: z.array(z.string().max(100)).max(50) });
+
+// Tags are lightweight labels, edited by operators like port notes and admin links — not admin-only like renaming a server.
+serversRouter.put("/:id/tags", requireRole("operator"), asyncHandler(async (req, res) => {
+  const id = Number(req.params.id);
+  if (!Number.isInteger(id)) return res.status(400).json({ error: "invalid_id" });
+
+  const parsed = tagsSchema.safeParse(req.body);
+  if (!parsed.success) {
+    return res.status(400).json({ error: "invalid_body", message: "Tags must be a list of text.", details: parsed.error.flatten() });
+  }
+  let tags: string[];
+  try {
+    tags = normalizeTags(parsed.data.tags);
+  } catch (err) {
+    if (err instanceof InvalidTagError) return res.status(400).json({ error: "invalid_tag", message: err.message });
+    throw err;
+  }
+
+  const [existing] = await db.select().from(servers).where(eq(servers.id, id)).limit(1);
+  if (!existing) return res.status(404).json({ error: "not_found" });
+
+  await db.update(servers).set({ tags: tags.length > 0 ? JSON.stringify(tags) : null }).where(eq(servers.id, id));
+
+  await recordAudit({
+    actor: req.currentUser!,
+    category: "server",
+    action: "set_tags",
+    targetType: "server",
+    targetId: id,
+    detail: { name: existing.name, before: parseTags(existing.tags), after: tags },
+  });
+
+  res.json({ tags });
 }));
 
 const linkSchema = z.object({