@skillcdn/console 0.1.8 → 0.1.10

package/src/cli/format.ts

@@ -1,15 +1,18 @@
 import type {
   RestArtifact,
+  RestCategory,
   RestDecision,
   RestDocument,
   RestDocumentSummary,
   RestDocuments,
+  RestGoal,
   RestProject,
   RestRun,
   RestSkills,
   RestTask,
   RestVersion,
   RestVersionSummary,
+  RestWork,
 } from "../schemas.js";
 
 // What the command prints: one line per thing in a list, a few lines for one thing in full.
@@ -47,6 +50,12 @@ export function formatTaskLine(task: RestTask): string {
   if (task.assignee !== null) {
     notes.push(`assigned to ${task.assignee.login}`);
   }
+  if (task.category !== null) {
+    notes.push(task.category.key);
+  }
+  if (task.dueOn !== null) {
+    notes.push(`due ${task.dueOn}`);
+  }
   if (task.openDecisions > 0) {
     notes.push(`${plural(task.openDecisions, "decision")} waiting`);
   }
@@ -56,6 +65,28 @@ export function formatTaskLine(task: RestTask): string {
   return `#${task.number}  ${task.state}  ${task.priority}  ${task.title}  (${notes.join("; ")})`;
 }
 
+/** The plan and what happened, as a line each, only where there is something to say. */
+function scheduleLines(task: RestTask): string[] {
+  const lines: string[] = [];
+  const plan = [
+    task.category === null ? undefined : `category: ${task.category.key}`,
+    task.goalId === null ? undefined : `goal: ${task.goalId}`,
+    task.startsOn === null ? undefined : `starts: ${task.startsOn}`,
+    task.dueOn === null ? undefined : `due: ${task.dueOn}`,
+  ].filter((part) => part !== undefined);
+  if (plan.length > 0) {
+    lines.push(plan.join("  "));
+  }
+  const happened = [
+    task.startedAt === null ? undefined : `started: ${task.startedAt}`,
+    task.doneAt === null ? undefined : `done: ${task.doneAt}`,
+  ].filter((part) => part !== undefined);
+  if (happened.length > 0) {
+    lines.push(happened.join("  "));
+  }
+  return lines;
+}
+
 /** One task in full; with the decisions about it and the runs on it, when given. */
 export function formatTask(
   task: RestTask,
@@ -66,6 +97,7 @@ export function formatTask(
     `#${task.number} ${task.title}`,
     `state: ${task.state}  priority: ${task.priority}  owner: ${task.owner.login}  assignee: ${task.assignee?.login ?? "nobody"}`,
     `id: ${task.id}${task.parentId === null ? "" : `  part of: ${task.parentId}`}`,
+    ...scheduleLines(task),
   ];
   if (task.links.length > 0) {
     lines.push("links:");
@@ -165,6 +197,62 @@ export function formatSkills(skills: RestSkills): string {
   return lines.join("\n");
 }
 
+/** How far a goal is, from its tasks: the done, the at work, and the rest, in one phrase. */
+function progressOf(goal: RestGoal): string {
+  const counts = goal.taskCounts;
+  const total = counts.idea + counts.ready + counts.in_progress + counts.in_review + counts.done;
+  const working = counts.in_progress + counts.in_review;
+  return `${counts.done}/${total} done${working === 0 ? "" : `, ${working} in progress`}${counts.dropped === 0 ? "" : `, ${counts.dropped} dropped`}`;
+}
+
+/** One goal: its id, its state, its title, when it is due, and how far it is. */
+export function formatGoalLine(goal: RestGoal): string {
+  const notes = [goal.dueOn === null ? "no target day" : `due ${goal.dueOn}`, progressOf(goal)];
+  return `${goal.id}  ${goal.state}  ${goal.title}  (${notes.join("; ")})`;
+}
+
+/** One goal in full; with the tasks that work towards it, when given. */
+export function formatGoal(goal: RestGoal, tasks?: readonly RestTask[]): string {
+  const lines = [
+    `goal ${goal.id}: ${goal.title}`,
+    `state: ${goal.state}  due: ${goal.dueOn ?? "none"}  set by: ${goal.createdBy.login}`,
+    `progress: ${progressOf(goal)}`,
+  ];
+  if (goal.body.trim().length > 0) {
+    lines.push("", goal.body.trimEnd());
+  }
+  if (tasks !== undefined) {
+    lines.push("", tasks.length === 0 ? "tasks: none" : "tasks:");
+    for (const task of tasks) {
+      lines.push(`  ${formatTaskLine(task)}`);
+    }
+  }
+  return lines.join("\n");
+}
+
+/** One category: its key, what people call it, and its colour. */
+export function formatCategoryLine(category: RestCategory): string {
+  return `${category.key}  ${category.name}  (${category.color})`;
+}
+
+/** What is on a person's plate: their open tasks by project, and the decisions waiting. */
+export function formatWork(work: RestWork): string {
+  const lines: string[] = [];
+  if (work.tasks.length === 0) {
+    lines.push("No open task is assigned to you.");
+  } else {
+    lines.push("tasks assigned to you:");
+    for (const { project, task } of work.tasks) {
+      lines.push(`  ${project.key}  ${formatTaskLine(task)}`);
+    }
+  }
+  lines.push("", work.decisions.length === 0 ? "decisions waiting: none" : "decisions waiting:");
+  for (const { project, decision } of work.decisions) {
+    lines.push(`  ${project.key}  ${formatDecisionLine(decision)}`);
+  }
+  return lines.join("\n");
+}
+
 export function formatDecisionLine(decision: RestDecision): string {
   const state = decision.answer === null ? "waiting" : `answered ${decision.answer.option}`;
   return `${decision.id}  ${state}  ${decision.question}  (asked by ${asker(decision)})`;

package/src/cli/help.ts

@@ -51,6 +51,22 @@ const MARKDOWN = `Markdown, up to ${MAX_BODY_LENGTH} characters`;
 const DOCUMENT_PATH = `a path of lowercase letters, digits and hyphens, with slashes between its folders (guides/onboarding), up to ${MAX_DOCUMENT_PATH_LENGTH} characters; it does not change once written`;
 const DOCUMENT_REFUSALS = ["document.not_found: no page has that path in this project"];
 
+const DAY = "a day as 2026-10-24, today, tomorrow, or +7 for seven days from today";
+const TASK_FIELD_FLAGS =
+  "[--state <state>] [--priority <priority>] [--category <key>] [--goal <id>] [--starts <day>] [--due <day>] [--assignee <login|me>] [--parent <number|id>]";
+const TASK_FIELD_LIMITS = [
+  `starts, due: ${DAY}; the due day is not before the start`,
+  "category: the key of one of the workspace's categories (console categories); goal: the id of one of the project's goals (console goals)",
+  "assignee: a login of the workspace, or me; parent: a task of the project",
+];
+const TASK_FIELD_REFUSALS = [
+  "task.invalid_category: no category has that key",
+  "task.invalid_goal: the goal is not one of this project",
+  "task.invalid_dates: the due day is before the start",
+  "task.invalid_assignee: the person may not work in the project",
+  "task.invalid_parent: the parent is not a task of the project, or would make a loop",
+];
+
 export const COMMAND_HELP: Readonly<Record<string, CommandHelp>> = {
   login: {
     usage: "login --url <origin> [--agent <name>] [--token-stdin]",
@@ -82,18 +98,52 @@ export const COMMAND_HELP: Readonly<Record<string, CommandHelp>> = {
       "Says which project this directory works in: writes .skillcdn-console.json here, which the commands read from this directory or one above it, and which is meant to be committed. --project <key> on any command, or CONSOLE_PROJECT in the environment, wins over it.",
     refusals: ["project.not_found: no project has the key, or it is not yours to see"],
   },
+  work: {
+    usage: "work",
+    about:
+      "What is on your plate across the projects you may see: the open tasks assigned to you, the sooner due first, each with its project; and the decisions waiting for a person. Needs no project.",
+  },
   tasks: {
-    usage: "tasks [--state <state>]",
+    usage:
+      "tasks [--state <state>] [--open] [--mine] [--category <key>] [--goal <id>] [--due <day|today|week|overdue>]",
     about:
-      "The tasks on the board, newest first: number, state, priority, title, who owns and works on each, and what waits on it. States: idea, ready, in_progress, in_review, done, dropped.",
+      "The tasks on the board, newest first: number, state, priority, title, who owns and works on each, its category and its due day, and what waits on it. --open keeps the ones not done or dropped, --mine those assigned to you, --category and --goal those sorted into one, --due those due by a day: today, within the week, or overdue (the open ones past their day). States: idea, ready, in_progress, in_review, done, dropped.",
   },
   task: {
+    usage: `task <number|id>  |  task new <title> [--body <markdown>|--file <path>] ${TASK_FIELD_FLAGS}  |  task edit <number|id> [--title <title>] [--body <markdown>|--file <path>] ${TASK_FIELD_FLAGS}`,
+    about:
+      "One task in full, with its plan (category, goal, start and due days), what happened to it (when it was started and done, which the board keeps itself), the decisions about it and the runs on it; or a new task written down; or a task changed, only in what the flags say, where none clears a field (priorities: low, normal, high, urgent).",
+    limits: [
+      `title: one line, up to ${MAX_TITLE_LENGTH} characters`,
+      `body: ${MARKDOWN}`,
+      ...TASK_FIELD_LIMITS,
+    ],
+    refusals: ["task.not_found: no task has that number or id", ...TASK_FIELD_REFUSALS],
+  },
+  goals: {
+    usage: "goals",
+    about:
+      "The roadmap of the project: its goals, the active first, each with its id, its state (planned, active, done, dropped), its target day, and how far it is, counted from the tasks that work towards it.",
+  },
+  goal: {
     usage:
-      "task <number|id>  |  task new <title> [--body <markdown>|--file <path>] [--state <state>] [--priority <priority>]",
+      'goal <id>  |  goal new "<title>" [--body <markdown>|--file <path>] [--state <state>] [--due <day>]  |  goal edit <id> [--title <title>] [--body <markdown>|--file <path>] [--state <state>] [--due <day|none>]',
     about:
-      "One task in full, with the decisions about it and the runs on it; or a new task written down (priorities: low, normal, high, urgent).",
-    limits: [`title: one line, up to ${MAX_TITLE_LENGTH} characters`, `body: ${MARKDOWN}`],
-    refusals: ["task.not_found: no task has that number or id"],
+      "One goal in full, with the tasks that work towards it; or a goal set on the roadmap, for an owner of the project; or one changed, only in what the flags say. A task works towards a goal through its --goal.",
+    limits: [
+      `title: one line, up to ${MAX_TITLE_LENGTH} characters`,
+      `body: ${MARKDOWN}`,
+      `due: ${DAY}`,
+    ],
+    refusals: [
+      "goal.not_found: no goal of this project has that id",
+      "auth.forbidden: only an owner of the project sets its roadmap",
+    ],
+  },
+  categories: {
+    usage: "categories",
+    about:
+      "The categories tasks are sorted into, the same in every project: each with its key, which --category takes, its name and its colour. An administrator keeps them on the console's Categories page.",
   },
   skills: {
     usage: "skills",
@@ -283,7 +333,19 @@ const SECTIONS: readonly { readonly title: string; readonly commands: readonly s
   },
   {
     title: "The board",
-    commands: ["tasks", "task", "decisions", "decision", "runs", "run", "skills"],
+    commands: [
+      "work",
+      "tasks",
+      "task",
+      "goals",
+      "goal",
+      "categories",
+      "decisions",
+      "decision",
+      "runs",
+      "run",
+      "skills",
+    ],
   },
   { title: "Working", commands: ["take", "report", "hand-in", "ask", "finish", "fail", "abandon"] },
   {

package/src/client.ts

@@ -1,6 +1,7 @@
 import {
   AUTH_ROUTES,
   CLAIM_PATH,
+  categoryPath,
   connectPath,
   personTokensPath,
   projectPath,
@@ -10,6 +11,10 @@ import {
 import {
   type RestAnswerInput,
   type RestArtifactInput,
+  type RestCategories,
+  type RestCategory,
+  type RestCategoryInput,
+  type RestCategoryPatch,
   type RestClaim,
   type RestConnectInput,
   type RestConnection,
@@ -22,6 +27,10 @@ import {
   type RestDocumentInput,
   type RestDocuments,
   type RestEvents,
+  type RestGoal,
+  type RestGoalInput,
+  type RestGoalPatch,
+  type RestGoals,
   type RestMe,
   type RestMember,
   type RestMemberInput,
@@ -50,6 +59,9 @@ import {
   type RestTokens,
   type RestVersion,
   type RestVersions,
+  type RestWork,
+  restCategoriesSchema,
+  restCategorySchema,
   restClaimSchema,
   restConnectionSchema,
   restConnectRequestSchema,
@@ -59,6 +71,8 @@ import {
   restDocumentsSchema,
   restErrorSchema,
   restEventsSchema,
+  restGoalSchema,
+  restGoalsSchema,
   restMemberSchema,
   restMembersSchema,
   restMeSchema,
@@ -75,6 +89,7 @@ import {
   restTokensSchema,
   restVersionSchema,
   restVersionsSchema,
+  restWorkSchema,
 } from "./schemas.js";
 import type { TaskState } from "./vocabulary.js";
 
@@ -135,6 +150,21 @@ export interface EventFilter {
   readonly document?: string | undefined;
 }
 
+/** What the board is narrowed to: one state, the open ones, a category, a goal, an assignee, or what is due by a day. */
+export interface TaskFilter {
+  readonly state?: TaskState | undefined;
+  /** True for the tasks not done or dropped; false for the rest. */
+  readonly open?: boolean | undefined;
+  /** The key of a category. */
+  readonly category?: string | undefined;
+  /** The id of a goal. */
+  readonly goal?: string | undefined;
+  /** The id of the person the tasks are assigned to. */
+  readonly assignee?: string | undefined;
+  /** A day (`2026-10-20`): the tasks due on it or before it. */
+  readonly dueBy?: string | undefined;
+}
+
 /** What a folder's listing, or a search, of the documents is narrowed to. */
 export interface DocumentFilter {
   /** The folder to list, `""` or left out for the root. */
@@ -159,7 +189,7 @@ export interface ProjectClient {
   addMember(input: RestMemberInput): Promise<RestMember>;
   updateMember(personId: string, patch: RestMemberPatch): Promise<RestMember>;
   removeMember(personId: string): Promise<void>;
-  tasks(filter?: { readonly state?: TaskState }, signal?: AbortSignal): Promise<RestTasks>;
+  tasks(filter?: TaskFilter, signal?: AbortSignal): Promise<RestTasks>;
   /** One task, by its id or by its number. */
   task(ref: string, signal?: AbortSignal): Promise<RestTask>;
   createTask(input: RestTaskInput): Promise<RestTask>;
@@ -221,6 +251,12 @@ export interface ProjectClient {
   attachFile(path: string, input: FileUpload): Promise<RestDocument>;
   /** Where the bytes of a file attached to a document are read, by the file's id. */
   documentFileUrl(path: string, fileId: string): string;
+  /** The roadmap (ADR-0019): the goals, the active first, each with its tasks counted by state. */
+  goals(signal?: AbortSignal): Promise<RestGoals>;
+  goal(id: string, signal?: AbortSignal): Promise<RestGoal>;
+  /** Sets a goal; for an owner, with a session or a token. */
+  createGoal(input: RestGoalInput): Promise<RestGoal>;
+  updateGoal(id: string, patch: RestGoalPatch): Promise<RestGoal>;
 }
 
 export interface ConsoleClient {
@@ -238,6 +274,15 @@ export interface ConsoleClient {
   project(key: string): ProjectClient;
   /** The workspace's own events, the ones about no project, after event number `after`. */
   events(after: number, signal?: AbortSignal): Promise<RestEvents>;
+  /** The categories tasks are sorted into (ADR-0019), by name. */
+  categories(signal?: AbortSignal): Promise<RestCategories>;
+  /** Makes a category; for an administrator signed in. */
+  createCategory(input: RestCategoryInput): Promise<RestCategory>;
+  updateCategory(key: string, patch: RestCategoryPatch): Promise<RestCategory>;
+  /** Removes a category no task uses; for an administrator signed in. */
+  removeCategory(key: string): Promise<void>;
+  /** What is on the asker's plate across the projects they may see: their open tasks, and the decisions waiting. */
+  work(signal?: AbortSignal): Promise<RestWork>;
   /** The tokens of whoever asks. */
   tokens(signal?: AbortSignal): Promise<RestTokens>;
   /** The tokens of another person: for an administrator. */
@@ -370,7 +415,14 @@ export function createClient(options: ClientOptions = {}): ConsoleClient {
       tasks: (filter = {}, signal) =>
         request(
           "GET",
-          withQuery(at("tasks"), { state: filter.state }),
+          withQuery(at("tasks"), {
+            state: filter.state,
+            open: flag(filter.open),
+            category: filter.category,
+            goal: filter.goal,
+            assignee: filter.assignee,
+            dueBy: filter.dueBy,
+          }),
           undefined,
           restTasksSchema,
           signal,
@@ -485,6 +537,13 @@ export function createClient(options: ClientOptions = {}): ConsoleClient {
         request("POST", `${base}${at("docs", path)}/files`, formOf(input), restDocumentSchema),
       documentFileUrl: (path, fileId) =>
         `${base}${at("docs", path)}/files/${encodeURIComponent(fileId)}`,
+      goals: (signal) =>
+        request("GET", `${base}${at("goals")}`, undefined, restGoalsSchema, signal),
+      goal: (id, signal) =>
+        request("GET", `${base}${at("goals", id)}`, undefined, restGoalSchema, signal),
+      createGoal: (input) => request("POST", `${base}${at("goals")}`, input, restGoalSchema),
+      updateGoal: (id, patch) =>
+        request("PATCH", `${base}${at("goals", id)}`, patch, restGoalSchema),
     };
   };
 
@@ -507,6 +566,15 @@ export function createClient(options: ClientOptions = {}): ConsoleClient {
         restEventsSchema,
         signal,
       ),
+    categories: (signal) =>
+      request("GET", `${base}${REST_ROUTES.categories}`, undefined, restCategoriesSchema, signal),
+    createCategory: (input) =>
+      request("POST", `${base}${REST_ROUTES.categories}`, input, restCategorySchema),
+    updateCategory: (key, patch) =>
+      request("PATCH", `${base}${categoryPath(key)}`, patch, restCategorySchema),
+    removeCategory: (key) => request("DELETE", `${base}${categoryPath(key)}`, undefined, undefined),
+    work: (signal) =>
+      request("GET", `${base}${REST_ROUTES.work}`, undefined, restWorkSchema, signal),
     tokens: (signal) =>
       request("GET", `${base}${REST_ROUTES.tokens}`, undefined, restTokensSchema, signal),
     createToken: (input) =>

package/src/components/board.tsx

@@ -1,10 +1,30 @@
 import type { ReactNode } from "react";
-import { type RestTask, TASK_STATES, type TaskState } from "../api.js";
-import { useWords } from "../i18n/index.js";
-import { Avatar, Badge, cx, PriorityBadge } from "./ui.js";
+import {
+  type RestCategory,
+  type RestGoal,
+  type RestPerson,
+  type RestRun,
+  type RestTask,
+  TASK_STATES,
+  type TaskState,
+} from "../api.js";
+import { useLanguage, useWords } from "../i18n/index.js";
+import type { BoardFilter } from "../router.js";
+import {
+  Avatar,
+  Badge,
+  Button,
+  CategoryBadge,
+  cx,
+  DueBadge,
+  formatInstant,
+  PriorityBadge,
+} from "./ui.js";
 
-// The board: one column per state, the tasks in it, newest first. It takes its data as props
-// and nothing from the network; what it is told on a click goes back up.
+// The board: one column per state, the tasks in it, the sooner due first and the newest after.
+// A card says what a person needs at a glance and nothing more: the number and the title, the
+// category, what is due, who is on it, what blocks it, and whose agent is at it. It takes its
+// data as props and nothing from the network; what it is told on a click goes back up.
 
 export interface BoardProps {
   readonly tasks: readonly RestTask[];
@@ -13,18 +33,32 @@ export interface BoardProps {
   readonly onOpen: (task: RestTask) => void;
   /** Called when a person moves a task to another column. Left out, the board is read-only. */
   readonly onMove?: ((task: RestTask, state: TaskState) => void) | undefined;
+  /** The runs of the project, for a card to name the agent at work on its task. */
+  readonly runs?: readonly RestRun[] | undefined;
+  /** The day to count due days from; the browser's today when left out. */
+  readonly today?: string | undefined;
   /** What a column shows when it has nothing; the way to write the first task, for example. */
   readonly empty?: ReactNode;
 }
 
+/** The open run on a task, when an agent is at work on it: whose, and since when. */
+function runOn(task: RestTask, runs: readonly RestRun[] | undefined): RestRun | undefined {
+  return runs?.find(
+    (run) => run.taskId === task.id && (run.status === "running" || run.status === "waiting"),
+  );
+}
+
 export function TaskCard(props: {
   readonly task: RestTask;
   readonly href: string;
   readonly onOpen: (task: RestTask) => void;
   readonly onMove?: ((task: RestTask, state: TaskState) => void) | undefined;
+  readonly run?: RestRun | undefined;
+  readonly today?: string | undefined;
 }) {
   const words = useWords();
-  const { task } = props;
+  const { tag } = useLanguage();
+  const { task, run } = props;
   return (
     <article className="sc-card" aria-label={`#${task.number} ${task.title}`}>
       <a
@@ -40,20 +74,28 @@ export function TaskCard(props: {
         <span className="sc-card-number">#{task.number}</span> {task.title}
       </a>
       <div className="sc-card-meta">
+        {task.category !== null && <CategoryBadge category={task.category} />}
         <PriorityBadge priority={task.priority} />
+        {task.dueOn !== null && (
+          <DueBadge dueOn={task.dueOn} state={task.state} today={props.today} />
+        )}
         {task.openDecisions > 0 && (
           <Badge tone="warning" title={words.board.decisionsTitle}>
             {words.board.decisions(task.openDecisions)}
           </Badge>
         )}
         {task.openRuns > 0 && (
-          <Badge tone="accent" title={words.board.agentAtWorkTitle}>
-            {words.board.agentAtWork}
+          <Badge
+            tone="accent"
+            title={
+              run === undefined
+                ? words.board.agentAtWorkTitle
+                : words.board.agentSince(run.agent, formatInstant(run.startedAt, tag))
+            }
+          >
+            {run === undefined ? words.board.agentAtWork : run.agent}
           </Badge>
         )}
-        {task.links.length > 0 && (
-          <Badge tone="neutral">{words.board.links(task.links.length)}</Badge>
-        )}
         <span className="sc-card-spacer" />
         {task.assignee !== null && <Avatar person={task.assignee} size="sm" />}
       </div>
@@ -76,12 +118,26 @@ export function TaskCard(props: {
   );
 }
 
+/** The order a column reads in: what is due soonest first, what has no day after, the newest first among those. */
+export function byDue(a: RestTask, b: RestTask): number {
+  if (a.dueOn !== b.dueOn) {
+    if (a.dueOn === null) {
+      return 1;
+    }
+    if (b.dueOn === null) {
+      return -1;
+    }
+    return a.dueOn.localeCompare(b.dueOn);
+  }
+  return b.number - a.number;
+}
+
 export function Board(props: BoardProps) {
   const words = useWords();
   return (
     <div className="sc-board">
       {TASK_STATES.map((state) => {
-        const tasks = props.tasks.filter((task) => task.state === state);
+        const tasks = props.tasks.filter((task) => task.state === state).sort(byDue);
         return (
           <section
             key={state}
@@ -100,6 +156,8 @@ export function Board(props: BoardProps) {
                   href={props.taskHref(task)}
                   onOpen={props.onOpen}
                   onMove={props.onMove}
+                  run={runOn(task, props.runs)}
+                  today={props.today}
                 />
               ))}
               {tasks.length === 0 && state === "idea" && props.empty}
@@ -110,3 +168,138 @@ export function Board(props: BoardProps) {
     </div>
   );
 }
+
+/** What the filter keeps of the board: a category or none, a goal or none, a person, one's own. */
+export function filterTasks(
+  tasks: readonly RestTask[],
+  filter: BoardFilter,
+  me?: RestPerson | undefined,
+): RestTask[] {
+  return tasks.filter((task) => {
+    if (filter.category !== undefined && (task.category?.key ?? "") !== filter.category) {
+      return false;
+    }
+    if (filter.goal !== undefined && (task.goalId ?? "") !== filter.goal) {
+      return false;
+    }
+    if (filter.person !== undefined && task.assignee?.id !== filter.person) {
+      return false;
+    }
+    if (filter.mine === true && (me === undefined || task.assignee?.id !== me.id)) {
+      return false;
+    }
+    return true;
+  });
+}
+
+export interface BoardFiltersProps {
+  readonly filter: BoardFilter;
+  readonly categories: readonly RestCategory[];
+  readonly goals: readonly RestGoal[];
+  readonly people: readonly RestPerson[];
+  /** Whoever is looking, for "mine". */
+  readonly me?: RestPerson | undefined;
+  /** How many tasks the filter keeps, of how many. */
+  readonly shown: number;
+  readonly total: number;
+  /** Called with the filter as it is to be: the composition shows the board at its address. */
+  readonly onChange: (filter: BoardFilter) => void;
+}
+
+/** The ways to narrow the board, each a change of its address (ADR-0010). */
+export function BoardFilters(props: BoardFiltersProps) {
+  const words = useWords().board.filters;
+  const { filter } = props;
+  const narrowed = Object.keys(filter).length > 0;
+  const goals = props.goals.filter((goal) => goal.state !== "dropped");
+  const change = (patch: BoardFilter, drop?: keyof BoardFilter) => {
+    const next: Record<string, unknown> = { ...filter, ...patch };
+    if (drop !== undefined) {
+      delete next[drop];
+    }
+    props.onChange(next as BoardFilter);
+  };
+  return (
+    <form
+      className="sc-filters"
+      aria-label={words.aria}
+      onSubmit={(event) => event.preventDefault()}
+    >
+      <label className="sc-field sc-field-inline">
+        <span className="sc-visually-hidden">{words.anyCategory}</span>
+        <select
+          className="sc-input"
+          value={filter.category ?? "*"}
+          onChange={(event) =>
+            event.target.value === "*"
+              ? change({}, "category")
+              : change({ category: event.target.value })
+          }
+        >
+          <option value="*">{words.anyCategory}</option>
+          <option value="">{words.noCategory}</option>
+          {props.categories.map((category) => (
+            <option key={category.key} value={category.key}>
+              {category.name}
+            </option>
+          ))}
+        </select>
+      </label>
+      {goals.length > 0 && (
+        <label className="sc-field sc-field-inline">
+          <span className="sc-visually-hidden">{words.anyGoal}</span>
+          <select
+            className="sc-input"
+            value={filter.goal ?? "*"}
+            onChange={(event) =>
+              event.target.value === "*" ? change({}, "goal") : change({ goal: event.target.value })
+            }
+          >
+            <option value="*">{words.anyGoal}</option>
+            <option value="">{words.noGoal}</option>
+            {goals.map((goal) => (
+              <option key={goal.id} value={goal.id}>
+                {goal.title}
+              </option>
+            ))}
+          </select>
+        </label>
+      )}
+      <label className="sc-field sc-field-inline">
+        <span className="sc-visually-hidden">{words.everyone}</span>
+        <select
+          className="sc-input"
+          value={filter.mine === true ? "mine" : (filter.person ?? "*")}
+          onChange={(event) => {
+            const value = event.target.value;
+            if (value === "*") {
+              change({ mine: undefined, person: undefined });
+              return;
+            }
+            if (value === "mine") {
+              change({ mine: true, person: undefined });
+              return;
+            }
+            change({ person: value, mine: undefined });
+          }}
+        >
+          <option value="*">{words.everyone}</option>
+          {props.me !== undefined && <option value="mine">{words.mine}</option>}
+          {props.people
+            .filter((person) => person.id !== props.me?.id)
+            .map((person) => (
+              <option key={person.id} value={person.id}>
+                {person.login}
+              </option>
+            ))}
+        </select>
+      </label>
+      <span className="sc-filters-count sc-muted">{words.showing(props.shown, props.total)}</span>
+      {narrowed && (
+        <Button variant="ghost" size="sm" onClick={() => props.onChange({})}>
+          {words.clear}
+        </Button>
+      )}
+    </form>
+  );
+}