@thebattlearena/corner 0.8.0 → 0.9.0

package/plugin/hooks/ring-pane.tsx

@@ -14,7 +14,8 @@ import { blend, tint } from './colors';
 import { iconSource } from './icon-files';
 import { tintedLink } from './label-links';
 import type { Elements } from './pane';
-import type { ChipLook, ChipView, RingView } from './ring';
+import type { ChipLook, ChipView, RingView, StripView } from './ring';
+import type { SparringView } from './sparring';
 import type { RingHealth } from '../types';
 import {
   clockTime,
@@ -31,9 +32,14 @@ import {
   truncateEnd,
 } from './ring';
 
-/** Lo que Ringside necesita para pintar el ring (diseño «F · Panel del ring», lámina Cuerpo). */
-export type RingPaneModel = {
-  view: RingView;
+/**
+ * Lo que Ringside necesita para pintar una sección del ring (diseño «F · Panel del ring», lámina
+ * Cuerpo): un combate o un sparring, con su tira de fichas.
+ */
+export type StripPaneModel = {
+  view: StripView;
+  /** Prefijo de las llaves y del grupo del realce: cada sección tiene el suyo (`ring` el combate). */
+  scope?: string;
   /** La fuente de íconos está instalada: glifos en vez de sus dos letras. */
   iconFont: boolean;
   /** Carpeta de los PNG de las fichas (`<plugin>/icons`). */
@@ -66,6 +72,14 @@ export type RingPaneModel = {
   onOpen: (command: string) => void;
 };
 
+/** El combate activo: su cabecera lleva el PR, los rounds, la campana y la crónica. */
+export type RingPaneModel = StripPaneModel & { view: RingView };
+
+/** Un sparring: su cabecera lleva la ronda, el último veredicto y sus repos con su PR. */
+export type SparringPaneModel = StripPaneModel & { view: SparringView };
+
+const scopeOf = (m: StripPaneModel): string => m.scope ?? 'ring';
+
 const AMBER = 'warning';
 const PURPLE = '#8B5CF6';
 const RED = '#E5484D';
@@ -161,7 +175,7 @@ export const ringHost = (items: DayItem[], view: RingView): DayItem | null =>
  * alguien trabaja, ■ ámbar si te toca decidir, 👊N rojo si Copilot dejó hilos; nada en reposo.
  */
 export const pointBadge = (
-  view: RingView,
+  view: StripView,
   tick: number,
   iconFont = false,
 ): { text: string; color: string } | null => {
@@ -182,7 +196,7 @@ export const pointBadge = (
 };
 
 /** El `Image` de la superficie, cuando se puede usar: terminal y sin que el engine lo haya negado. */
-const imageOf = (el: Elements, m: RingPaneModel, probing = false) =>
+const imageOf = (el: Elements, m: StripPaneModel, probing = false) =>
   m.isTerminal &&
   (probing ? m.imagesDraw !== false : m.imagesDraw === true) &&
   'Image' in el
@@ -216,19 +230,26 @@ const InlineIcon = (
 
 const Glyph = (
   { Text }: Elements,
-  m: RingPaneModel,
+  m: StripPaneModel,
   icon: Icon,
   color?: string,
 ) => <Text color={color}>{iconText(icon, m.iconFont)}</Text>;
 
+/** La marca de la cabecera: ■ ámbar si te toca, el spinner si alguien trabaja, ⁝ en reposo. */
+const headerMark = (m: StripPaneModel) =>
+  m.view.waiting
+    ? { text: ic('■'), color: AMBER }
+    : {
+        text: m.view.running ? spinnerFrame(m.tick) : '⁝',
+        color: fills(m.light).current,
+      };
+
 /** (a) Cabecera: spinner · #PR · rounds y su barra; a la derecha la última campana y la crónica. */
 const Header = (el: Elements, m: RingPaneModel, width: number) => {
   const { Box, Link, Text } = el;
   const { view } = m;
   const tone = fills(m.light);
-  const mark = view.waiting
-    ? { text: ic('■'), color: AMBER }
-    : { text: view.running ? spinnerFrame(m.tick) : '⁝', color: tone.current };
+  const mark = headerMark(m);
   const cells =
     view.rounds &&
     roundCells(view.rounds.fought, view.rounds.total, ROUND_CELLS);
@@ -274,6 +295,45 @@ const Header = (el: Elements, m: RingPaneModel, width: number) => {
   );
 };
 
+/**
+ * (a) Cabecera de un sparring: marca · ronda; a la derecha el último veredicto; debajo, un renglón
+ * por repo con su PR (borrador) o «sin PR».
+ */
+const SparringHeader = (el: Elements, m: SparringPaneModel, width: number) => {
+  const { Box, Text } = el;
+  const { view } = m;
+  const mark = headerMark(m);
+  return (
+    <Box flexDirection="column" width={width}>
+      <Box justifyContent="space-between" width={width}>
+        <Box gap={1}>
+          <Text color={mark.color} bold>
+            {mark.text}
+          </Text>
+          <Text bold>{`ronda ${view.round}`}</Text>
+        </Box>
+        <Text dimColor wrap="truncate-end">
+          {view.verdict
+            ? `último veredicto: ${view.verdict.call}`
+            : 'sin veredicto'}
+        </Text>
+      </Box>
+      {view.repos.map((repo) => (
+        <Box key={`${scopeOf(m)}-repo-${repo.repo}`} gap={1} width={width}>
+          <Text dimColor wrap="truncate-end">
+            {repo.repo}
+          </Text>
+          {repo.pr && repo.url ? (
+            tintedLink(el, repo.url, `#${repo.pr}`, { color: PALETTE.blue })
+          ) : (
+            <Text dimColor>sin PR</Text>
+          )}
+        </Box>
+      ))}
+    </Box>
+  );
+};
+
 /** La barra de acento a la izquierda de una tarjeta. */
 const Accent = ({ Text }: Elements, color: string) => (
   <Text color={color}>▌</Text>
@@ -283,7 +343,7 @@ const Accent = ({ Text }: Elements, color: string) => (
  * (b) La línea en vivo: tarjeta a todo lo ancho con acento a la izquierda. Trabajando, azul;
  * Copilot golpeó, rojo; te toca decidir, ámbar lleno con el tiempo; en reposo, desde cuándo.
  */
-const LiveCard = (el: Elements, m: RingPaneModel, width: number) => {
+const LiveCard = (el: Elements, m: StripPaneModel, width: number) => {
   const { Box, Text } = el;
   const live = m.view.live;
   const tone = fills(m.light);
@@ -462,8 +522,8 @@ export const tileLook = (
  * des-invierte (probado en Ghostty con un diagnóstico de cuatro variantes; esta y la de Box con llave
  * invierten la ficha entera).
  */
-export const tileHover = (chip: ChipView) => ({
-  scope: `ring-tile-${chip.id}`,
+export const tileHover = (chip: ChipView, scope = 'ring') => ({
+  scope: `${scope}-tile-${chip.id}`,
   inverse: true,
   bold: true,
 });
@@ -471,7 +531,7 @@ export const tileHover = (chip: ChipView) => ({
 /** El ícono de una ficha: imagen sólo si la terminal las dibuja; si no, el glifo centrado. */
 const ChipIcon = (
   el: Elements,
-  m: RingPaneModel,
+  m: StripPaneModel,
   chip: ChipView,
   size: { cols: number; rows: number },
   look: ChipLook,
@@ -483,7 +543,7 @@ const ChipIcon = (
   if (Image && chip.icon.png && hasShape(zone))
     return (
       <Image
-        key={`ring-icon-${chip.id}`}
+        key={`${scopeOf(m)}-icon-${chip.id}`}
         source={iconSource(m.iconDir, chipPng(chip, color, look, zone))}
         columns={zone.cols}
         rows={zone.rows}
@@ -497,7 +557,7 @@ const ChipIcon = (
     <Text
       color={tile.glyph}
       backgroundColor={tile.fill}
-      hover={tileHover(chip)}
+      hover={tileHover(chip, scopeOf(m))}
       bold
     >
       {marked && <Text color={tile.hex}>▸</Text>}
@@ -514,9 +574,10 @@ const ChipIcon = (
  * una fila cada uno, el del ícono y el del indicador: un botón no puede tener dos renglones). La
  * abierta lleva el relleno más fuerte y ▾ debajo.
  */
-const Chips = (el: Elements, m: RingPaneModel, width: number) => {
+const Chips = (el: Elements, m: StripPaneModel, width: number) => {
   const { Box, Button, Text } = el;
   const tone = fills(m.light);
+  const scope = scopeOf(m);
   const size = chipSize(width, m.view.chips.length);
   return (
     <Box columnGap={size.gap} justifyContent="center" width={width}>
@@ -535,7 +596,7 @@ const Chips = (el: Elements, m: RingPaneModel, width: number) => {
               ? COLORS.delivered
               : tile.dot
             : tile.hex;
-        const hover = tileHover(chip);
+        const hover = tileHover(chip, scope);
         const health = healthIndicator(chip, m.tick, m.iconFont);
         // Toda la ficha es UN botón: cada renglón es un botón `plain` con el mismo clic, su texto mide
         // el ancho de la ficha y lleva su mismo fondo (ningún renglón se ve distinto en reposo), y el
@@ -546,7 +607,7 @@ const Chips = (el: Elements, m: RingPaneModel, width: number) => {
           </Button>
         );
         const indicator = row(
-          `ring-chip-${chip.id}`,
+          `${scope}-chip-${chip.id}`,
           <Text
             color={health?.color ?? indicatorColor}
             backgroundColor={tile.fill}
@@ -557,24 +618,27 @@ const Chips = (el: Elements, m: RingPaneModel, width: number) => {
           </Text>,
         );
         const top = row(
-          `ring-chip-${chip.id}-top`,
+          `${scope}-chip-${chip.id}-top`,
           <Text backgroundColor={tile.fill} hover={hover}>
             {' '.repeat(size.box)}
           </Text>,
         );
         const icon = image
           ? ChipIcon(el, m, chip, size, look)
-          : row(`ring-chip-${chip.id}-icon`, ChipIcon(el, m, chip, size, look));
+          : row(
+              `${scope}-chip-${chip.id}-icon`,
+              ChipIcon(el, m, chip, size, look),
+            );
         return (
           <Box
-            key={`ring-actor-${chip.id}`}
+            key={`${scope}-actor-${chip.id}`}
             flexDirection="column"
             width={size.box}
             flexShrink={0}
           >
             {/* Todas iguales: margen, ícono e indicador, con el mismo alto en todo estado. */}
             <Box
-              key={`ring-tile-${chip.id}`}
+              key={`${scope}-tile-${chip.id}`}
               flexDirection="column"
               backgroundColor={tile.fill}
               width={size.box}
@@ -599,14 +663,14 @@ const Chips = (el: Elements, m: RingPaneModel, width: number) => {
 const OpenAction = (
   { Button, Text }: Elements,
   chip: ChipView,
-  m: RingPaneModel,
+  m: StripPaneModel,
 ) => {
   const open = chip.open;
   if (!open) return null;
   if ('command' in open && open.canRun)
     return (
       <Button
-        key={`ring-open-${chip.id}`}
+        key={`${scopeOf(m)}-open-${chip.id}`}
         label={`abrir ${ic('↗')}`}
         variant="primary"
         onPress={() => m.onOpen(open.command)}
@@ -657,7 +721,7 @@ const rowsOf = (chip: ChipView): [string, string][] => {
 const Detail = (
   el: Elements,
   chip: ChipView,
-  m: RingPaneModel,
+  m: StripPaneModel,
   width: number,
 ) => {
   const { Box, Text } = el;
@@ -713,7 +777,7 @@ const Detail = (
       {rows.length > 0 && (
         <Box flexDirection="column" marginTop={1}>
           {rows.map(([key, value]) => (
-            <Box key={`ring-field-${key}`} width={inner}>
+            <Box key={`${scopeOf(m)}-field-${key}`} width={inner}>
               <Box width={LABEL_WIDTH} flexShrink={0}>
                 <Text dimColor>{key}</Text>
               </Box>
@@ -758,8 +822,13 @@ const Detail = (
   );
 };
 
-/** El bloque desplegado: cabecera, línea en vivo, fichas y la ficha abierta. */
-const Block = (el: Elements, m: RingPaneModel, width: number) => {
+/** El bloque desplegado: cabecera (la de un combate o la de un sparring), línea en vivo, fichas y la ficha abierta. */
+const Block = <M extends StripPaneModel>(
+  el: Elements,
+  m: M,
+  width: number,
+  header: (el: Elements, m: M, width: number) => JSX.Element,
+) => {
   const { Box } = el;
   const chip = m.view.chips.find((c) => c.id === m.selected);
   const inner = width - 2;
@@ -772,7 +841,7 @@ const Block = (el: Elements, m: RingPaneModel, width: number) => {
       paddingTop={1}
       width={width}
     >
-      {Header(el, m, inner)}
+      {header(el, m, inner)}
       {LiveCard(el, m, inner)}
       {Chips(el, m, inner)}
       {chip && Detail(el, chip, m, inner)}
@@ -792,32 +861,53 @@ export const RingRow = (
   m: RingPaneModel,
   width: number,
   indent = 0,
+) => Section(el, m, width, indent, `Revisión #${m.view.pr}`, Header);
+
+/**
+ * La sección de un sparring activo, como la de un combate: «▸ Sparring <slug>» en su banda y,
+ * desplegada, su ronda, su último veredicto, sus repos con su PR y la tira de árbitro, rudo y juez.
+ */
+export const SparringRow = (
+  el: Elements,
+  m: SparringPaneModel,
+  width: number,
+) => Section(el, m, width, 0, `Sparring ${m.view.slug}`, SparringHeader);
+
+/** El título con banda (indicador y tiempo de hoy a la derecha) y, desplegado, el bloque. */
+const Section = <M extends StripPaneModel>(
+  el: Elements,
+  m: M,
+  width: number,
+  indent: number,
+  title: string,
+  header: (el: Elements, m: M, width: number) => JSX.Element,
 ) => {
   const { Box, Button, Text } = el;
   const { view } = m;
+  const scope = scopeOf(m);
   const tone = fills(m.light);
   const minutes = Math.round(view.todayMs / 60_000);
   const badge = pointBadge(view, m.tick, m.iconFont);
   return (
-    <Box key="ring-section" flexDirection="column" width={width}>
+    <Box key={`${scope}-section`} flexDirection="column" width={width}>
       <Box
-        key="ring-title"
+        key={`${scope}-title`}
         backgroundColor={tone.band}
         justifyContent="space-between"
         paddingLeft={Math.max(1, indent)}
         paddingRight={1}
         width={width}
       >
-        <Button key="ring-row" plain onPress={() => m.onRow()}>
+        <Button key={`${scope}-row`} plain onPress={() => m.onRow()}>
           <Text color={COLORS.blue}>{`${ic(m.isOpen ? '▾' : '▸')} `}</Text>
-          <Text bold>{`Revisión #${view.pr}`}</Text>
+          <Text bold>{title}</Text>
         </Button>
         <Text>
           {badge && <Text color={badge.color}>{`${badge.text} `}</Text>}
           <Text dimColor>{duration(minutes) || ''}</Text>
         </Text>
       </Box>
-      {m.isOpen && Block(el, m, width)}
+      {m.isOpen && Block(el, m, width, header)}
     </Box>
   );
 };

package/plugin/hooks/ring.ts

@@ -83,15 +83,11 @@ export const lookOf = (chip: ChipView): ChipLook => {
   return 'quiet';
 };
 
-export type RingView = {
-  slug: string;
-  pr: number;
-  prUrl: string;
-  /** Rounds de la defensa del título; `null` mientras no hay. */
-  rounds: { fought: number; total: number } | null;
-  /** La última round-bell: su PR si se sabe, si no su número de round. */
-  bell: { pr: number | null; url: string | null; round: number } | null;
-  chronicleUrl: string | null;
+/**
+ * Lo que comparten un combate y un sparring: la tira de fichas, la línea en vivo y si alguien
+ * trabaja o te espera. Sale de `deriveStrip`.
+ */
+export type StripView = {
   /** Alguien trabaja ahora (gira el spinner). */
   running: boolean;
   /** Una decisión espera al humano (el spinner se vuelve ■ ámbar). */
@@ -115,8 +111,21 @@ export type RingView = {
   health: 'warn' | 'fail' | null;
 };
 
-/** Los actores del ring, en el orden de la tira. */
-export const CORE_CHIPS: { id: RingActorId & IconName; name: string }[] = [
+export type RingView = StripView & {
+  slug: string;
+  pr: number;
+  prUrl: string;
+  /** Rounds de la defensa del título; `null` mientras no hay. */
+  rounds: { fought: number; total: number } | null;
+  /** La última round-bell: su PR si se sabe, si no su número de round. */
+  bell: { pr: number | null; url: string | null; round: number } | null;
+  chronicleUrl: string | null;
+};
+
+export type ActorChip = { id: RingActorId & IconName; name: string };
+
+/** Los actores de un combate, en el orden de la tira. */
+export const CORE_CHIPS: ActorChip[] = [
   { id: 'arbitro', name: 'árbitro' },
   { id: 'luchador', name: 'luchador' },
   { id: 'esquinero', name: 'esquinero' },
@@ -125,7 +134,17 @@ export const CORE_CHIPS: { id: RingActorId & IconName; name: string }[] = [
   { id: 'juez', name: 'juez' },
 ];
 
-const CORE_IDS: string[] = CORE_CHIPS.map((chip) => chip.id);
+/** Los de un sparring: el árbitro lo abre, el rudo escribe el borrador y el juez dicta. */
+export const SPARRING_CHIPS: ActorChip[] = [
+  { id: 'arbitro', name: 'árbitro' },
+  { id: 'rudo', name: 'rudo' },
+  { id: 'juez', name: 'juez' },
+];
+
+/** Todos los actores del ring: ningún monitor puede llamarse así. */
+const CORE_IDS: string[] = [
+  ...new Set([...CORE_CHIPS, ...SPARRING_CHIPS].map((chip) => chip.id)),
+];
 const STATES = ['active', 'waiting', 'done', 'failed'];
 const OPEN_STATES = ['active', 'waiting'];
 /** Un «activo» sin cierre después de esto se da por perdido (la sesión murió a medio trabajo). */
@@ -497,13 +516,22 @@ const todayOf = (events: RingEvent[], now: number, running: boolean) => {
   return (running ? now : Math.max(...today)) - Math.min(...today);
 };
 
-/** El combate → lo que pinta el panel: cabecera, línea en vivo y la tira de chips. */
-export const deriveRing = (bout: RingBout, now: number): RingView => {
+/**
+ * Los eventos de un feed en vivo → la tira de fichas (los actores dados y los monitores), la línea en
+ * vivo y quién trabaja. Lo comparten el combate y el sparring.
+ */
+export const deriveStrip = (
+  events: RingEvent[],
+  actors: ActorChip[],
+  monitors: RingMonitor[],
+  commands: string[],
+  now: number,
+): StripView => {
   const bySource = new Map<string, RingEvent[]>();
-  for (const e of bout.events)
+  for (const e of events)
     bySource.set(sourceOf(e), [...(bySource.get(sourceOf(e)) ?? []), e]);
   const chips = [
-    ...CORE_CHIPS.map((chip) =>
+    ...actors.map((chip) =>
       chipOf(
         {
           id: chip.id,
@@ -516,7 +544,7 @@ export const deriveRing = (bout: RingBout, now: number): RingView => {
         null,
       ),
     ),
-    ...bout.monitors.map((m) =>
+    ...monitors.map((m) =>
       chipOf(
         {
           id: m.id,
@@ -526,7 +554,7 @@ export const deriveRing = (bout: RingBout, now: number): RingView => {
         },
         bySource.get(`monitor:${m.id}`) ?? [],
         now,
-        openFor(m, bout.commands),
+        openFor(m, commands),
       ),
     ),
   ];
@@ -549,26 +577,7 @@ export const deriveRing = (bout: RingBout, now: number): RingView => {
         : lookOf(lead) === 'hit'
           ? 'hit'
           : 'idle';
-  const bellEvent = [...bout.events]
-    .reverse()
-    .find((e) => e.actor === 'campana' && e.pr);
-  const hasBell = bout.bells > 0 || !!bellEvent;
   return {
-    slug: bout.slug,
-    pr: bout.pr,
-    prUrl: `https://github.com/${bout.slug}/pull/${bout.pr}`,
-    rounds: bout.defense && {
-      fought: bout.defense.fought,
-      total: bout.defense.limit,
-    },
-    bell: hasBell
-      ? {
-          pr: bellEvent?.pr ?? bout.bellPr?.pr ?? null,
-          url: bellEvent?.url ?? bout.bellPr?.url ?? null,
-          round: bout.bells,
-        }
-      : null,
-    chronicleUrl: bout.playByPlayUrl,
     running: working.length > 0,
     waiting,
     live: lead?.label
@@ -584,7 +593,7 @@ export const deriveRing = (bout: RingBout, now: number): RingView => {
           severity: lead.severity,
         }
       : null,
-    todayMs: todayOf(bout.events, now, working.length > 0),
+    todayMs: todayOf(events, now, working.length > 0),
     chips,
     health: chips.some((c) => c.health?.level === 'fail')
       ? 'fail'
@@ -593,3 +602,29 @@ export const deriveRing = (bout: RingBout, now: number): RingView => {
         : null,
   };
 };
+
+/** El combate → lo que pinta el panel: cabecera, línea en vivo y la tira de chips. */
+export const deriveRing = (bout: RingBout, now: number): RingView => {
+  const bellEvent = [...bout.events]
+    .reverse()
+    .find((e) => e.actor === 'campana' && e.pr);
+  const hasBell = bout.bells > 0 || !!bellEvent;
+  return {
+    slug: bout.slug,
+    pr: bout.pr,
+    prUrl: `https://github.com/${bout.slug}/pull/${bout.pr}`,
+    rounds: bout.defense && {
+      fought: bout.defense.fought,
+      total: bout.defense.limit,
+    },
+    bell: hasBell
+      ? {
+          pr: bellEvent?.pr ?? bout.bellPr?.pr ?? null,
+          url: bellEvent?.url ?? bout.bellPr?.url ?? null,
+          round: bout.bells,
+        }
+      : null,
+    chronicleUrl: bout.playByPlayUrl,
+    ...deriveStrip(bout.events, CORE_CHIPS, bout.monitors, bout.commands, now),
+  };
+};

package/plugin/hooks/sparring.ts

@@ -0,0 +1,139 @@
+import type { RingEvent, RingSparring, RingSparringRepo } from '../types';
+import type { StripView } from './ring';
+import { deriveStrip, SPARRING_CHIPS } from './ring';
+
+/**
+ * Los sparrings del plugin `ring` en Ringside: de `sparring.json` y su `live.jsonl` sale una sección
+ * parecida a la de un combate, con su tira de actores (árbitro, rudo, juez), sus repos con su PR, la
+ * ronda y el último veredicto. Todo aquí es puro.
+ */
+
+/** Los veredictos que cierran un sparring: después ya no se pinta. */
+export const FINAL_VERDICTS = ['ko', 'discard'];
+
+/**
+ * Un sparring sin tocar en este tiempo ya no es «activo» aunque nadie haya dictado: el timebox de un
+ * sparring es de 3 h como mucho, y el juez lo prueba el mismo día. Tocarlo = cualquier escritura de
+ * `sparring.json`, `card.md` o `live.jsonl` (un comando del sparring, el rudo, una pregunta).
+ */
+export const SPARRING_FRESH_MS = 12 * 3_600_000;
+
+/** Lo que Ringside lee de `sparring.json`; todo opcional porque un archivo malo no tumba el panel. */
+export type SparringFile = {
+  slug?: unknown;
+  verdict?: { call?: unknown; note?: unknown } | null;
+  history?: unknown;
+  repos?: unknown;
+  sessions?: unknown;
+};
+
+/** Un sparring tal como se encontró: su archivo y cuándo se tocó por última vez (ms). */
+export type FoundSparring = { state: SparringFile; touched: number };
+
+const text = (value: unknown): string | null =>
+  typeof value === 'string' && value.trim() ? value.trim() : null;
+
+/** ¿Sigue en pelea? Sin veredicto final y tocado dentro de `SPARRING_FRESH_MS`. */
+export const isActiveSparring = (
+  state: SparringFile,
+  touched: number,
+  now: number,
+): boolean =>
+  !!text(state.slug) &&
+  !FINAL_VERDICTS.includes(String(state.verdict?.call ?? '')) &&
+  now - touched < SPARRING_FRESH_MS;
+
+const reposOf = (state: SparringFile) =>
+  Array.isArray(state.repos)
+    ? (state.repos as Record<string, unknown>[]).filter(
+        (entry) => !!entry && typeof entry === 'object',
+      )
+    : [];
+
+const sessionIds = (state: SparringFile): string[] =>
+  Array.isArray(state.sessions)
+    ? (state.sessions as { id?: unknown }[])
+        .map((session) => session?.id)
+        .filter((id): id is string => typeof id === 'string')
+    : [];
+
+const within = (dir: string, path: string): boolean =>
+  path === dir || path.startsWith(`${dir.replace(/\/+$/, '')}/`);
+
+/**
+ * Qué sparrings activos muestra esta sesión: los que ella registró (corrió `sparring.mjs` en ellos);
+ * si no registró ninguno, los que trabajan en su carpeta (algún `repos[].worktree` la contiene). Del
+ * más reciente al más viejo.
+ */
+export const sparringsFor = <T extends FoundSparring>(
+  found: T[],
+  {
+    sessionId,
+    root,
+    now,
+  }: { sessionId: string | null; root: string; now: number },
+): T[] => {
+  const active = found
+    .filter((s) => isActiveSparring(s.state, s.touched, now))
+    .sort((a, b) => b.touched - a.touched);
+  const own = active.filter(
+    (s) => !!sessionId && sessionIds(s.state).includes(sessionId),
+  );
+  if (own.length) return own;
+  return active.filter((s) =>
+    reposOf(s.state).some(
+      (entry) =>
+        typeof entry.worktree === 'string' && within(entry.worktree, root),
+    ),
+  );
+};
+
+/** La ronda que se pelea: los veredictos dictados + 1 (los de antes de `history`, por su veredicto). */
+export const roundOf = (state: SparringFile): number => {
+  const history = Array.isArray(state.history)
+    ? state.history.length
+    : state.verdict
+      ? 1
+      : 0;
+  return history + 1;
+};
+
+/** `sparring.json` + los eventos de su feed → lo que lleva el snapshot. */
+export const sparringOf = (
+  state: SparringFile,
+  events: RingEvent[],
+): RingSparring => {
+  const call = text(state.verdict?.call);
+  return {
+    slug: text(state.slug) ?? '',
+    repos: reposOf(state).map(
+      (entry): RingSparringRepo => ({
+        repo: text(entry.repo) ?? '?',
+        pr: typeof entry.pr === 'number' ? entry.pr : null,
+        url: text(entry.url),
+      }),
+    ),
+    round: roundOf(state),
+    verdict: call ? { call, note: text(state.verdict?.note) ?? '' } : null,
+    events,
+  };
+};
+
+export type SparringView = StripView & {
+  slug: string;
+  repos: RingSparringRepo[];
+  round: number;
+  verdict: { call: string; note: string } | null;
+};
+
+/** El sparring → lo que pinta su sección: la tira de árbitro, rudo y juez, sus repos y la ronda. */
+export const deriveSparring = (
+  sparring: RingSparring,
+  now: number,
+): SparringView => ({
+  slug: sparring.slug,
+  repos: sparring.repos,
+  round: sparring.round,
+  verdict: sparring.verdict,
+  ...deriveStrip(sparring.events, SPARRING_CHIPS, [], [], now),
+});