swarm-ui: say 1 hit, not 1 hits, in a box's screen-reader label

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 (

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.