Add a per-user lead agent and make the right pane task-focused

web/src/todo.ts

@@ -1,9 +1,8 @@
 import { get, post, type ByreEvent, type Project, type Schemas } from "./api.js";
 import { errorText, h, replace, showAlert } from "./dom.js";
 import { markdown } from "./markdown.js";
-import { openTranscript } from "./panes.js";
 import { models } from "./task.js";
-import { currentSession, on, onEach, state } from "./state.js";
+import { currentSession, findTask, focusTask, on, onEach, state } from "./state.js";
 
 type Todo = Schemas["Todo"];
 type TodoItem = Schemas["TodoItem"];
@@ -15,9 +14,15 @@ export function mountTodo(root: HTMLElement): () => void {
   const starting = new Set<string>();
   let disposed = false;
 
+  const project = () => {
+    const task = state.selectedTaskId ? findTask(state.selectedTaskId) : undefined;
+    return state.projects.find((p) => p.id === task?.project_id);
+  };
+
   const render = () => {
     const scrollTop = root.querySelector(".todo-view")?.scrollTop ?? 0;
-    replace(root, h("div", { class: "todo-view" }, ...state.projects.map((p) => projectBlock(p, todos.get(p.id), starting, start))));
+    const p = project();
+    replace(root, h("div", { class: "todo-view" }, p ? projectBlock(p, todos.get(p.id), starting, start) : h("div", { class: "empty" }, "No task selected.")));
     root.querySelector(".todo-view")!.scrollTop = scrollTop;
   };
 
@@ -34,7 +39,8 @@ export function mountTodo(root: HTMLElement): () => void {
   };
 
   const refresh = () => {
-    for (const p of state.projects) {
+    const p = project();
+    if (p) {
       void load(p.id);
     }
   };
@@ -45,8 +51,7 @@ export function mountTodo(root: HTMLElement): () => void {
     render();
     try {
       const task = await post("/api/projects/{projectId}/todo/tasks", { path: { projectId: project.id }, body: { title: item.title, model: models[0] } });
-      location.hash = `#/task/${task.id}`;
-      openTranscript();
+      focusTask(task.id);
     } catch (err) {
       void showAlert(errorText(err));
     }
@@ -72,7 +77,14 @@ export function mountTodo(root: HTMLElement): () => void {
       }
     }),
     on("projects", refresh),
-    onEach(["tasks", "sessions", "selection"], render),
+    on("selection", () => {
+      render();
+      const p = project();
+      if (p && !todos.has(p.id)) {
+        void load(p.id);
+      }
+    }),
+    onEach(["tasks", "sessions"], render),
   ];
 
   render();
@@ -122,7 +134,14 @@ function projectBlock(project: Project, todo: Todo | string | undefined, startin
       const sess = currentSession(task.id);
       action = h(
         "a",
-        { class: "todo-task", href: `#/task/${task.id}`, onclick: openTranscript },
+        {
+          class: "todo-task",
+          href: `#/task/${task.id}`,
+          onclick: (e: MouseEvent) => {
+            e.preventDefault();
+            focusTask(task.id);
+          },
+        },
         h("span", { class: `dot ${sess?.state ?? "none"}`, title: sess?.state ?? "no session" }),
         sess?.state ?? "no agent",
       );