@skillcdn/console 0.4.2 → 0.4.4

package/src/components/projects.tsx

@@ -99,61 +99,6 @@ export function ProjectRoleBadge(props: { readonly role: ProjectRole }) {
   );
 }
 
-export interface ProjectListProps {
-  readonly projects: readonly RestProject[];
-  /** The link to a project's board, as the composition routes it. */
-  readonly projectHref: (project: RestProject) => string;
-  readonly onOpen: (project: RestProject) => void;
-  readonly empty?: ReactNode;
-}
-
-export function ProjectList(props: ProjectListProps) {
-  const words = useWords().projects;
-  if (props.projects.length === 0) {
-    return <>{props.empty ?? null}</>;
-  }
-  return (
-    <ul className="sc-projects" aria-label={words.list}>
-      {props.projects.map((project) => (
-        <li key={project.id} className="sc-project">
-          <div className="sc-project-head">
-            <ProjectMark project={project} size="md" />
-            <a
-              className="sc-project-name"
-              href={props.projectHref(project)}
-              onClick={(event) => {
-                if (event.button === 0 && !event.metaKey && !event.ctrlKey && !event.shiftKey) {
-                  event.preventDefault();
-                  props.onOpen(project);
-                }
-              }}
-            >
-              {project.name}
-            </a>
-            <code className="sc-project-key">{project.key}</code>
-            <ProjectRoleBadge role={project.role} />
-            {project.visibility === "private" ? (
-              <Badge tone="neutral">{words.private}</Badge>
-            ) : (
-              <Badge tone="warning">{words.public}</Badge>
-            )}
-          </div>
-          {project.description.length > 0 && (
-            <p className="sc-project-description">{project.description}</p>
-          )}
-          {project.openDecisions > 0 && (
-            <p className="sc-project-meta">
-              <Badge tone="warning" kind="count">
-                {words.decisionsWaiting(project.openDecisions)}
-              </Badge>
-            </p>
-          )}
-        </li>
-      ))}
-    </ul>
-  );
-}
-
 export interface ProjectFormProps {
   /** The project to change; left out, the form makes a new one, with a key. */
   readonly project?: RestProject | undefined;

package/src/components/task-view.tsx

@@ -1,3 +1,4 @@
+import { agentLabel } from "../agent-name.js";
 import type {
   RestAnswerInput,
   RestCategory,
@@ -83,7 +84,8 @@ export interface TaskViewProps {
   readonly error?: string | undefined;
   readonly onChange: (task: RestTask, patch: RestTaskInput) => void;
   readonly onMove: (task: RestTask, state: TaskState) => void;
-  readonly onRaiseDecision: (input: RestDecisionInput) => void;
+  /** Called with a decision raised about the task, and the files put on it (ADR-0055). */
+  readonly onRaiseDecision: (input: RestDecisionInput, files: readonly File[]) => void;
   readonly onAnswer: (decision: RestDecision, input: RestAnswerInput) => void;
   /** Called to grow a decision's record with what followed. */
   readonly onUpdateDecision?:
@@ -325,6 +327,12 @@ export function TaskView(props: TaskViewProps) {
                 <PersonChip person={task.owner} />
               </dd>
             </div>
+            {task.agent != null && (
+              <div>
+                <dt>{words.task.writtenThrough}</dt>
+                <dd>{agentLabel(task.agent)}</dd>
+              </div>
+            )}
             <div>
               <dt>{words.task.workers}</dt>
               <dd>

package/src/components/ui.tsx

@@ -108,7 +108,10 @@ export function Avatar(props: {
   const remote = useRemotePictureSrc();
   const size = props.size ?? "md";
   const initial = personName(props.person).slice(0, 1).toUpperCase();
-  if (props.person.avatar === null) {
+  const src = props.person.avatar === null ? undefined : remote(props.person.avatar);
+  // A picture that would not load gives way to the initial, and never to a broken image.
+  const [failed, setFailed] = useState<string | undefined>(undefined);
+  if (src === undefined || src === failed) {
     return (
       <span
         className={cx("sc-avatar", "sc-avatar-initial", `sc-avatar-${size}`)}
@@ -121,11 +124,12 @@ export function Avatar(props: {
   return (
     <img
       className={cx("sc-avatar", `sc-avatar-${size}`)}
-      src={remote(props.person.avatar)}
+      src={src}
       alt=""
       loading="lazy"
       decoding="async"
       referrerPolicy="no-referrer"
+      onError={() => setFailed(src)}
     />
   );
 }

package/src/connect-page.tsx

@@ -10,7 +10,7 @@ import { Callout, Spinner } from "./components/ui.js";
 import type { ConsoleData } from "./data.js";
 import { useWords } from "./i18n/index.js";
 import { connectHref, type Navigation, PATHS } from "./router.js";
-import { useAction } from "./use-action.js";
+import { errorWords, useAction } from "./use-action.js";
 
 // The page where a person connects their agent (ADR-0011): the code typed when the address
 // does not carry one, what asks under it, the approval, and what came of it. Part of the
@@ -24,7 +24,8 @@ export interface ConnectPageProps {
 }
 
 export function ConnectPage(props: ConnectPageProps) {
-  const words = useWords().connect;
+  const pack = useWords();
+  const words = pack.connect;
   const { data, navigation } = props;
   const code = props.code === undefined ? undefined : normalizeConnectCode(props.code);
   const [request, setRequest] = useState<RestConnectRequest | undefined>(undefined);
@@ -55,13 +56,11 @@ export function ConnectPage(props: ConnectPageProps) {
         setProblem(
           failure instanceof ApiError && failure.code === "connect.not_found"
             ? words.noSuchCode
-            : failure instanceof ApiError
-              ? failure.message
-              : words.couldNotAsk,
+            : errorWords(failure, words.couldNotAsk, pack),
         );
       });
     return () => controller.abort();
-  }, [code, connectRequest, words]);
+  }, [code, connectRequest, pack, words]);
 
   const head = (
     <div className="sc-page-head">

package/src/console.tsx

@@ -22,6 +22,7 @@ import {
   type RestDecisionInput,
   type RestDecisionPatch,
   type RestEvent,
+  type RestMe,
   type RestMyDecisions,
   type RestPluginDetail,
   type RestProject,
@@ -47,18 +48,17 @@ import { DecisionForm } from "./components/decision-form.js";
 import { DecisionCard, DecisionList, type DecisionListProps } from "./components/decision-list.js";
 import { EventFeed, type EventFeedProps } from "./components/event-feed.js";
 import { GoalForm, GoalList, type GoalListProps, GoalView, goalMonth } from "./components/goals.js";
+import { HomeGrid, type HomeGridProps } from "./components/home.js";
 import { MyDecisions } from "./components/my-decisions.js";
 import { PackTokenWays } from "./components/pack-token.js";
 import { PAGE_SIZE } from "./components/paged.js";
 import { ListingForm, PeopleList, type PeopleListProps } from "./components/people.js";
-import { PluginFrame, PluginWidgets } from "./components/plugin-frame.js";
+import { PluginFrame } from "./components/plugin-frame.js";
 import { PluginSettingsList, PluginSettingsView } from "./components/plugin-settings.js";
 import {
   MemberList,
   type MemberListProps,
   ProjectForm,
-  ProjectList,
-  type ProjectListProps,
   ProjectMark,
 } from "./components/projects.js";
 import { type RemotePictureSrc, RemotePicturesContext } from "./components/remote-pictures.js";
@@ -100,6 +100,7 @@ import { type ConsoleData, useConsoleData } from "./data.js";
 import { monthOf, today } from "./dates.js";
 import { DocsPage } from "./docs-page.js";
 import {
+  browserPack,
   chooseLanguage,
   DEFAULT_LANGUAGES,
   LanguageContext,
@@ -157,7 +158,7 @@ export interface ConsoleComponents {
   readonly TokenList: ComponentType<TokenListProps>;
   readonly PeopleList: ComponentType<PeopleListProps>;
   readonly SkillList: ComponentType<SkillListProps>;
-  readonly ProjectList: ComponentType<ProjectListProps>;
+  readonly HomeGrid: ComponentType<HomeGridProps>;
   readonly MemberList: ComponentType<MemberListProps>;
   readonly Calendar: ComponentType<CalendarProps>;
   readonly GoalList: ComponentType<GoalListProps>;
@@ -175,7 +176,7 @@ export const DEFAULT_COMPONENTS: ConsoleComponents = {
   TokenList,
   PeopleList,
   SkillList,
-  ProjectList,
+  HomeGrid,
   MemberList,
   Calendar,
   GoalList,
@@ -356,6 +357,14 @@ function useFollowLinks(navigation: Navigation): void {
 }
 
 /** The key of the project a route is on, or nothing. */
+/** The files chosen or pasted on a page, as the client sends them: each by its name, its bytes and its type where the browser knows one. */
+const uploadsOf = (files: readonly File[]): FileUpload[] =>
+  files.map((file) => ({
+    name: file.name,
+    bytes: file,
+    ...(file.type === "" ? {} : { contentType: file.type }),
+  }));
+
 const projectOf = (route: Route): string | undefined =>
   "project" in route ? route.project : undefined;
 
@@ -376,6 +385,21 @@ function holdsToken(data: ConsoleData): boolean {
   return data.me !== undefined && data.me.agent !== null;
 }
 
+/**
+ * The language to keep for a person the pages see for the first time (ADR-0065): the one their
+ * browser asks for, so that a plugin or an agent can write for them while they are away. Nothing
+ * for a person who has a language, for nobody, and where the pages only fall back on a language.
+ */
+export function languageToKeep(
+  me: RestMe | undefined,
+  browser: readonly string[],
+  packs: readonly LanguagePack[],
+): string | undefined {
+  return me?.person !== null && me?.person !== undefined && me.language === null
+    ? browserPack(browser, packs)?.tag
+    : undefined;
+}
+
 /**
  * The pages a console that holds a token does not offer: the tokens themselves, and the
  * approval of an agent's connection, which makes one; a person's own doing on the console's
@@ -405,21 +429,11 @@ function ProjectsPage(props: {
   readonly making: boolean;
 }) {
   const words = useWords().projects;
+  const homeWords = useWords().home;
   const { data, components, navigation, client, language } = props;
   const me = data.me;
-  /** The plugins' widgets at a place of this page (ADR-0054), for the person's roles. */
-  const widgets = (place: "home:top" | "home:bottom") =>
-    me === undefined ? null : (
-      <PluginWidgets
-        plugins={data.plugins}
-        place={place}
-        me={me}
-        language={language}
-        client={client}
-        navigation={navigation}
-        nameOf={(name) => pluginWordOf(name, language)}
-      />
-    );
+  // The person arranges the page (ADR-0061): the projects and the widgets, tiles on one grid.
+  const [arranging, setArranging] = useState(false);
   const { busy, error, act } = useAction();
   const href = (project: RestProject) => projectHref(project.key);
   // A project is made by an administrator (ADR-0045): a member sees the list alone, the form's
@@ -430,14 +444,22 @@ function ProjectsPage(props: {
     <>
       <div className="sc-page-head">
         <h1 className="sc-page-title">{words.title}</h1>
-        {administrator && !making && (
-          <LinkButton href={PATHS.newProject} variant="primary">
-            {words.newProject}
-          </LinkButton>
+        {!arranging && (
+          <div className="sc-page-actions">
+            {me !== undefined && me.person !== null && (
+              <Button size="sm" variant="ghost" onClick={() => setArranging(true)}>
+                {homeWords.edit}
+              </Button>
+            )}
+            {administrator && !making && (
+              <LinkButton href={PATHS.newProject} variant="primary">
+                {words.newProject}
+              </LinkButton>
+            )}
+          </div>
         )}
       </div>
       {error !== undefined && <Callout tone="danger">{error}</Callout>}
-      {widgets("home:top")}
       {making && (
         <section className="sc-panel sc-panel-form" aria-label={words.form.aria}>
           <ProjectForm
@@ -457,10 +479,30 @@ function ProjectsPage(props: {
           />
         </section>
       )}
-      <components.ProjectList
+      <components.HomeGrid
         projects={data.projects}
+        plugins={data.plugins}
+        home={me?.home}
+        editing={arranging}
+        onSave={(home) => data.actions.updateMe({ home })}
+        onDone={() => setArranging(false)}
         projectHref={href}
         onOpen={(project) => navigation.go(href(project))}
+        nameOf={(name) => pluginWordOf(name, language)}
+        renderWidget={(tile, size) =>
+          me === undefined ? null : (
+            <PluginFrame
+              plugin={tile.plugin}
+              widget={tile.widget.key}
+              size={size}
+              me={me}
+              language={language}
+              client={client}
+              navigation={navigation}
+              title={pluginWordOf(tile.widget.name, language)}
+            />
+          )
+        }
         empty={
           <EmptyState
             title={words.empty.title}
@@ -473,7 +515,6 @@ function ProjectsPage(props: {
           />
         }
       />
-      {widgets("home:bottom")}
     </>
   );
 }
@@ -508,7 +549,7 @@ function PluginPage(props: {
   return (
     <>
       {pages.length > 1 && (
-        <nav className="sc-subtabs" aria-label={pluginWordOf(plugin.name, language)}>
+        <nav className="sc-page-tabs" aria-label={pluginWordOf(plugin.name, language)}>
           {pages.map((candidate) => (
             <a
               key={candidate.key}
@@ -564,9 +605,9 @@ function PluginSettingsPage(props: {
       setDetail(await client.plugin(key).get());
       setFailure(undefined);
     } catch (error) {
-      setFailure(error instanceof ApiError ? error.message : words.common.somethingWentWrong);
+      setFailure(errorWords(error, words.common.somethingWentWrong, words));
     }
-  }, [client, key, words.common.somethingWentWrong]);
+  }, [client, key, words]);
   useEffect(() => {
     setDetail(undefined);
     void read();
@@ -863,9 +904,9 @@ function TaskPage(props: {
         })
       }
       onMove={(target, state) => void act(() => data.actions.updateTask(target.id, { state }))}
-      onRaiseDecision={(input) =>
+      onRaiseDecision={(input, files) =>
         void act(async () => {
-          await data.actions.raiseDecision(input);
+          await data.actions.raiseDecision(input, uploadsOf(files));
           navigation.replace(here);
         })
       }
@@ -889,14 +930,7 @@ function TaskPage(props: {
       }
       onComment={(draft) =>
         void act(async () => {
-          await data.actions.comment(task.id, {
-            body: draft.body,
-            files: draft.files.map((file) => ({
-              name: file.name,
-              bytes: file,
-              ...(file.type === "" ? {} : { contentType: file.type }),
-            })),
-          });
+          await data.actions.comment(task.id, { body: draft.body, files: uploadsOf(draft.files) });
           setComments(await taskComments(task.id));
         })
       }
@@ -1311,6 +1345,7 @@ function ProjectPage(props: {
           tasks={tasksById}
           taskHref={href}
           docHref={toDoc}
+          fileHref={(fileId) => projectPath(key, "files", fileId)}
           decisionHref={(decision) => decisionHref(key, decision.id)}
           page={route.page}
           pageHref={(page) => decisionsHref(key, page)}
@@ -1337,9 +1372,9 @@ function ProjectPage(props: {
             deciders={data.members.map((member) => member.person)}
             me={data.me?.person ?? undefined}
             busy={busy}
-            onSubmit={(input: RestDecisionInput) =>
+            onSubmit={(input: RestDecisionInput, files: readonly File[]) =>
               void act(async () => {
-                const made = await data.actions.raiseDecision(input);
+                const made = await data.actions.raiseDecision(input, uploadsOf(files));
                 navigation.replace(decisionHref(key, made.id));
               })
             }
@@ -1366,6 +1401,7 @@ function ProjectPage(props: {
             task={decision.taskId === null ? undefined : tasksById.get(decision.taskId)}
             taskHref={href}
             docHref={toDoc}
+            fileHref={(fileId) => projectPath(key, "files", fileId)}
             onAnswer={onAnswer}
             onUpdate={onUpdate}
             busy={busy}
@@ -2301,6 +2337,7 @@ function MyDecisionsPage(props: { readonly data: ConsoleData }) {
           addressed={{ items: addressed.items, more: addressed.more, onMore: addressed.readMore }}
           raised={{ items: raised.items, more: raised.more, onMore: raised.readMore }}
           decisionHref={decisionHref}
+          fileHref={(projectKey, fileId) => projectPath(projectKey, "files", fileId)}
           onAnswer={onAnswer}
           busy={busy || addressed.busy || raised.busy}
         />
@@ -2502,6 +2539,12 @@ function WorkspacePage(props: {
               ? (person, status) => void act(() => data.actions.updatePerson(person.id, { status }))
               : undefined
           }
+          onChangeManager={
+            administrator
+              ? (person, managerId) =>
+                  void act(() => data.actions.updatePerson(person.id, { managerId }))
+              : undefined
+          }
           onUnlist={
             administrator
               ? (listing) => void act(() => data.actions.removeListing(listing.id))
@@ -2575,6 +2618,7 @@ export function createConsole(config: ConsoleConfig = {}): ConsoleApp {
   const languages = config.languages ?? DEFAULT_LANGUAGES;
   const pages = config.pages ?? [];
 
+  // biome-ignore lint/correctness/noComponentHookFactories: createConsole runs once, when a console is built, never during a render; App is that console's one root component, closing over its config.
   function App(props: { readonly initialPath?: string | undefined }) {
     const { location, navigation } = useNavigation(props.initialPath);
     useFollowLinks(navigation);
@@ -2587,7 +2631,7 @@ export function createConsole(config: ConsoleConfig = {}): ConsoleApp {
     const failure = signInFailureOf(location.search);
     const title = data.me?.workspace.name ?? fallbackTitle;
     const viaToken = holdsToken(data);
-    // The language: the person's choice, else the browser's, else the first the console speaks.
+    // The language: the person's own, else the browser's, else the first the console speaks.
     const chosen = data.me?.language;
     const pack = useMemo(
       () =>
@@ -2600,6 +2644,17 @@ export function createConsole(config: ConsoleConfig = {}): ConsoleApp {
     );
     const words = pack.messages;
 
+    const toKeep = languageToKeep(
+      data.me,
+      typeof navigator === "undefined" ? [] : navigator.languages,
+      languages,
+    );
+    useEffect(() => {
+      if (toKeep !== undefined) {
+        void data.actions.updateMe({ language: toKeep }).catch(() => undefined);
+      }
+    }, [toKeep, data.actions]);
+
     // An address that moved is shown at its new one, in its place.
     useEffect(() => {
       if (route.name === "moved") {
@@ -2627,7 +2682,7 @@ export function createConsole(config: ConsoleConfig = {}): ConsoleApp {
                 title={words.common.couldNotReach}
                 action={<Button onClick={data.reload}>{words.common.tryAgain}</Button>}
               >
-                {data.error}
+                {errorWords(data.failure, data.error, words)}
               </Callout>
             )}
           </div>
@@ -2659,6 +2714,7 @@ export function createConsole(config: ConsoleConfig = {}): ConsoleApp {
           href: PATHS.decisions,
           label: words.nav.myDecisions,
           current: route.name === "my-decisions",
+          count: data.me?.decisions?.waiting,
         },
         {
           href: PATHS.people,

package/src/data.ts

@@ -125,7 +125,8 @@ export interface ConsoleActions {
     page: { readonly limit: number; readonly offset: number },
     signal?: AbortSignal,
   ): Promise<RestGoals>;
-  raiseDecision(input: RestDecisionInput): Promise<RestDecision>;
+  /** Raises a decision in the project; with `files`, the files put on it (ADR-0055). */
+  raiseDecision(input: RestDecisionInput, files?: readonly FileUpload[]): Promise<RestDecision>;
   answerDecision(id: string, input: RestAnswerInput): Promise<RestDecision>;
   /** Answers a decision of any project the person may see, by its project's key: for the person's own page of decisions (ADR-0042). */
   answerDecisionIn(projectKey: string, id: string, input: RestAnswerInput): Promise<RestDecision>;
@@ -172,7 +173,7 @@ export interface ConsoleActions {
   createListing(input: RestListingInput): Promise<RestListing>;
   /** Takes a listing away that nobody signed in with; for an administrator. */
   removeListing(id: string): Promise<void>;
-  /** Keeps the person's own choice of language (ADR-0012). */
+  /** Keeps the person's language (ADR-0065) or their front page. */
   updateMe(patch: RestMePatch): Promise<RestMe>;
   /** Changes the workspace's settings (ADR-0035); for an administrator. `me` says them from then on. */
   updateWorkspace(patch: RestWorkspacePatch): Promise<RestWorkspace>;
@@ -213,8 +214,10 @@ export interface ConsoleActions {
 export interface ConsoleData {
   /** Who is signed in and what the board is called; `undefined` until the server has answered. */
   readonly me: RestMe | undefined;
-  /** What went wrong asking who is signed in, for a person. */
+  /** What went wrong asking who is signed in, for a person, in English. */
   readonly error: string | undefined;
+  /** The failure itself, for a page to say in the person's language (`errorWords`). */
+  readonly failure?: unknown;
   /** True once the workspace has been loaded for the first time: the projects, the people, the tokens. */
   readonly loaded: boolean;
   /** The projects the person may see, by name. */
@@ -356,6 +359,7 @@ const wordsOf = (failure: unknown, fallback: string): string =>
 export function useConsoleData(client: ConsoleClient, projectKey: string | undefined): ConsoleData {
   const [me, setMe] = useState<RestMe | undefined>(undefined);
   const [error, setError] = useState<string | undefined>(undefined);
+  const [failure, setFailure] = useState<unknown>(undefined);
   const [loaded, setLoaded] = useState(false);
   const [projects, setProjects] = useState<readonly RestProject[]>([]);
   const [people, setPeople] = useState<readonly RestPerson[]>([]);
@@ -382,6 +386,20 @@ export function useConsoleData(client: ConsoleClient, projectKey: string | undef
 
   const reload = useCallback(() => setGeneration((current) => current + 1), []);
 
+  /**
+   * Asks again who is signed in, for what moves with the board: the decisions waiting for the
+   * person, said beside My decisions. What fails stays as it was.
+   */
+  const refreshMe = useCallback(
+    async (signal?: AbortSignal) => {
+      const answer = await client.me(signal);
+      if (signal?.aborted !== true) {
+        setMe(answer);
+      }
+    },
+    [client],
+  );
+
   /** Loads the workspace's lists again. What fails stays as it was. */
   const refreshWorkspace = useCallback(
     async (signal?: AbortSignal) => {
@@ -446,12 +464,14 @@ export function useConsoleData(client: ConsoleClient, projectKey: string | undef
     const controller = new AbortController();
     const { signal } = controller;
     setError(undefined);
+    setFailure(undefined);
     const run = async () => {
       let answer: RestMe;
       try {
         answer = await client.me(signal);
       } catch (failure) {
         if (!signal.aborted) {
+          setFailure(failure);
           setError(wordsOf(failure, "The server could not be reached."));
         }
         return;
@@ -477,6 +497,7 @@ export function useConsoleData(client: ConsoleClient, projectKey: string | undef
         setLoaded(true);
       } catch (failure) {
         if (!signal.aborted) {
+          setFailure(failure);
           setError(wordsOf(failure, "The workspace could not be loaded."));
         }
       }
@@ -571,6 +592,11 @@ export function useConsoleData(client: ConsoleClient, projectKey: string | undef
           if (event.kind.startsWith("project.")) {
             refreshWorkspace(signal).catch(() => undefined);
           }
+          // A decision raised or answered here may be one of the person's own: the count beside
+          // My decisions follows it.
+          if (event.kind.startsWith("decision.")) {
+            refreshMe(signal).catch(() => undefined);
+          }
         }, RELOAD_DELAY_MS);
       };
       for (const kind of EVENT_KINDS) {
@@ -584,7 +610,7 @@ export function useConsoleData(client: ConsoleClient, projectKey: string | undef
       source?.close();
       setLive(false);
     };
-  }, [client, projectKey, signedIn, generation, refreshProject, refreshWorkspace]);
+  }, [client, projectKey, signedIn, generation, refreshProject, refreshWorkspace, refreshMe]);
 
   const actions = useMemo<ConsoleActions>(() => {
     /** The project the page is on, for an action that needs one. */
@@ -684,16 +710,19 @@ export function useConsoleData(client: ConsoleClient, projectKey: string | undef
         scope().tasks({ archived: false, ...searchWordsOf(query), ...page }, signal),
       findGoals: (query, page, signal) =>
         scope().goals({ open: true, ...searchWordsOf(query), ...page }, signal),
-      async raiseDecision(input) {
-        const decision = await scope().raiseDecision(input);
-        await refreshProject();
+      async raiseDecision(input, files) {
+        const decision = await scope().raiseDecision(input, files);
+        await Promise.all([refreshProject(), refreshMe().catch(() => undefined)]);
+        return decision;
+      },
+      async answerDecisionIn(projectKey, id, input) {
+        const decision = await client.project(projectKey).answerDecision(id, input);
+        await refreshMe().catch(() => undefined);
         return decision;
       },
-      answerDecisionIn: (projectKey, id, input) =>
-        client.project(projectKey).answerDecision(id, input),
       async answerDecision(id, input) {
         const decision = await scope().answerDecision(id, input);
-        await refreshProject();
+        await Promise.all([refreshProject(), refreshMe().catch(() => undefined)]);
         return decision;
       },
       async updateDecision(id, patch) {
@@ -834,11 +863,12 @@ export function useConsoleData(client: ConsoleClient, projectKey: string | undef
         setLoaded(false);
       },
     };
-  }, [client, projectKey, refreshProject, refreshWorkspace]);
+  }, [client, projectKey, refreshProject, refreshWorkspace, refreshMe]);
 
   return {
     me,
     error,
+    failure,
     loaded,
     projects,
     people,

package/src/docs-page.tsx

@@ -30,7 +30,7 @@ import {
   taskHref,
 } from "./router.js";
 import { projectPath } from "./routes.js";
-import { useAction } from "./use-action.js";
+import { errorWords, useAction } from "./use-action.js";
 
 // The Docs page of a project (ADR-0009): the folder or the page the path names, read on its
 // own since the tree may be large, and read again whenever the project's feed grows; and the
@@ -51,7 +51,8 @@ export interface DocsPageProps {
 type Found = RestDocument | null | undefined;
 
 export function DocsPage(props: DocsPageProps) {
-  const words = useWords().docs;
+  const pack = useWords();
+  const words = pack.docs;
   const { project, path, view, data, navigation } = props;
   const [listing, setListing] = useState<RestDocuments | undefined>(undefined);
   const [document, setDocument] = useState<Found>(undefined);
@@ -105,7 +106,7 @@ export function DocsPage(props: DocsPageProps) {
     };
     load().catch((failure: unknown) => {
       if (!signal.aborted) {
-        setProblem(failure instanceof ApiError ? failure.message : words.couldNotLoad);
+        setProblem(errorWords(failure, words.couldNotLoad, pack));
       }
     });
     return () => controller.abort();
@@ -145,11 +146,11 @@ export function DocsPage(props: DocsPageProps) {
       })
       .catch((failure: unknown) => {
         if (!controller.signal.aborted) {
-          setProblem(failure instanceof ApiError ? failure.message : words.searchFailed);
+          setProblem(errorWords(failure, words.searchFailed, pack));
         }
       });
     return () => controller.abort();
-  }, [actions, query, words]);
+  }, [actions, pack, query, words]);
 
   const toDoc = (target: string) => docHref(key, target);
   const toFolder = (folder: string) => docHref(key, folder);