From 81fd4466a582d091bf39d9c611577c2ef25b145e Mon Sep 17 00:00:00 2001
From: iris <iris@hyperhive.local>
Date: Sun, 25 Oct 2026 02:16:39 +0200
Subject: [PATCH] swarm-ui: say 1 hit, not 1 hits, in a box's screen-reader
 label

---
 .../swarm-ui/src/pages/notifications/FlowBox.tsx       | 10 ++++++----
 .../swarm-ui/src/pages/notifications/FlowCanvas.tsx    |  4 ++--
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/frontend/packages/swarm-ui/src/pages/notifications/FlowBox.tsx b/frontend/packages/swarm-ui/src/pages/notifications/FlowBox.tsx
index d76e5672..c17f9b27 100644
--- a/frontend/packages/swarm-ui/src/pages/notifications/FlowBox.tsx
+++ b/frontend/packages/swarm-ui/src/pages/notifications/FlowBox.tsx
@@ -13,6 +13,11 @@ const PAD = 10;
 // The long kind name would run into the aside beside it.
 const SHORT_KIND: Record<string, string> = { request_reviewer: "reviewer" };
 
+// "1 hit", "0 hits": how the box says how many events reached it.
+export function hitsText(hits: number): string {
+  return `${hits} ${hits === 1 ? "hit" : "hits"}`;
+}
+
 export function BoxFace({
   kind,
   text,
@@ -26,10 +31,7 @@ export function BoxFace({
   // The events of the last dry run that reached the node, when one covers it.
   hits?: number;
 }) {
-  const aside = [
-    order,
-    hits === undefined ? undefined : `${hits} ${hits === 1 ? "hit" : "hits"}`,
-  ]
+  const aside = [order, hits === undefined ? undefined : hitsText(hits)]
     .filter((part) => part !== undefined)
     .join(" · ");
   return (
diff --git a/frontend/packages/swarm-ui/src/pages/notifications/FlowCanvas.tsx b/frontend/packages/swarm-ui/src/pages/notifications/FlowCanvas.tsx
index 60e841ba..50ebdc7e 100644
--- a/frontend/packages/swarm-ui/src/pages/notifications/FlowCanvas.tsx
+++ b/frontend/packages/swarm-ui/src/pages/notifications/FlowCanvas.tsx
@@ -21,7 +21,7 @@ import {
   type Edit,
   type Limits,
 } from "./FlowDraft.js";
-import { BoxFace } from "./FlowBox.js";
+import { BoxFace, hitsText } from "./FlowBox.js";
 import { layoutFlow, neighbour, nodeAt } from "./FlowLayout.js";
 import { describeNode, ordinal, type Flow } from "./FlowTypes.js";
 
@@ -341,7 +341,7 @@ export function FlowCanvas({
                 tabIndex={p.id === tabStop ? 0 : -1}
                 role="button"
                 aria-pressed={p.id === selected}
-                aria-label={`${node.kind} ${p.id}: ${text}${order}${hits ? `, ${hits.get(p.id) ?? 0} hits` : ""}`}
+                aria-label={`${node.kind} ${p.id}: ${text}${order}${hits ? `, ${hitsText(hits.get(p.id) ?? 0)}` : ""}`}
                 onPointerDown={(e) => {
                   if (node.kind === "source") {
                     // The source cannot move; a press just picks it.