@oharness/server 0.9.2 → 0.10.0

package/dist/page/client/shell.js

@@ -8,6 +8,9 @@ export const SHELL = String.raw `
 
 const projectBtn = document.getElementById("project");
 let projects = [];
+/** Session directories that are worktrees, each naming the project it came from. */
+let worktrees = [];
+const worktreeAt = (cwd) => worktrees.find((one) => one.path === cwd);
 
 /** The last path segment, which is what the directory is called. */
 function projectName(dir) {
@@ -25,6 +28,7 @@ function paintProject() {
   // it too, or it goes on advertising the tree the user just left.
   const cwdEl = document.getElementById("empty-cwd");
   if (cwdEl && active) cwdEl.textContent = active.name;
+  if (active) void paintStarters(active.path);
   // A directory added while the chip was open belongs on its list.
   refreshWorkspace();
 }
@@ -50,6 +54,7 @@ function repaintPanel() {
 async function loadProjects() {
   const body = await getJson("/projects");
   projects = body.projects || [];
+  worktrees = body.worktrees || [];
   projectOrder = body.order || [];
   paintProject();
   // A project's pin and its place decide how the session list is grouped, so
@@ -294,6 +299,12 @@ const IS_WIN = /win/i.test(navigator.platform || navigator.userAgent || "");
 /** The rows the current query left on screen, in the order they are drawn. */
 let paletteRows = [];
 let paletteCursor = 0;
+/**
+ * Whether the palette was opened from the sidebar's "Search sessions": then it
+ * lists sessions and nothing else, and every one of them rather than the
+ * recent eight — the question asked was "where is that conversation".
+ */
+let paletteSessionsOnly = false;
 
 /** A nav item's own icon, so the palette names things the way the sidebar does. */
 function navIcon(id) {
@@ -315,6 +326,7 @@ const enLabel = (key) => (STRINGS.en && STRINGS.en[key]) || "";
 function paletteItems() {
   const items = [];
   const query = paletteField.value.trim();
+  if (paletteSessionsOnly) return sessionItems(sessionRows);
   const actions = t("palette.actions");
   const here = (projects.find((project) => project.current) || {}).path || currentCwd;
 
@@ -342,6 +354,7 @@ function paletteItems() {
   for (const [id, key] of [
     ["nav-artifacts", "nav.artifacts"],
     ["nav-sessions", "nav.sessions"],
+    ["nav-usage", "nav.usage"],
     ["nav-models", "nav.models"],
     ["nav-routines", "nav.routines"],
     ["nav-settings", "nav.settings"],
@@ -359,21 +372,7 @@ function paletteItems() {
   // Unfiltered, the list is a preview of the most recent work and the actions
   // above it still have to be visible. Once there is a query, every session in
   // every tree is fair game — that is what the field is for.
-  const sessions = t("palette.sessions");
-  for (const session of query ? sessionRows : sessionRows.slice(0, 8)) {
-    items.push({
-      kind: "session",
-      group: sessions,
-      icon: () => svgIcon("chat"),
-      label: session.title || t("session.untitled"),
-      sub: [projectName(session.cwd || ""), ago(session.updatedAt)].filter(Boolean).join(" · "),
-      keywords: session.cwd || "",
-      run: () => {
-        if (session.current) return void setNav(null);
-        void openSession(session.id, session.cwd);
-      },
-    });
-  }
+  items.push(...sessionItems(query ? sessionRows : sessionRows.slice(0, 8)));
 
   const named = t("palette.projects");
   for (const project of query ? projects : projects.slice(0, 5)) {
@@ -394,6 +393,23 @@ function paletteItems() {
   return items;
 }
 
+/** Palette rows for sessions, each reopening its own transcript. */
+function sessionItems(rows) {
+  const group = t("palette.sessions");
+  return rows.map((session) => ({
+    kind: "session",
+    group,
+    icon: () => svgIcon("chat"),
+    label: session.title || t("session.untitled"),
+    sub: [projectName(session.cwd || ""), ago(session.updatedAt)].filter(Boolean).join(" · "),
+    keywords: session.cwd || "",
+    run: () => {
+      if (session.current) return void setNav(null);
+      void openSession(session.id, session.cwd);
+    },
+  }));
+}
+
 /** Same word-by-word match the pickers use, over the row's hidden aliases too. */
 const paletteMatch = (item, query) =>
   matchesQuery(
@@ -454,12 +470,14 @@ function movePalette(step) {
   if (active) active.scrollIntoView({ block: "nearest" });
 }
 
-function openPalette() {
+function openPalette(sessionsOnly = false) {
   // One modal at a time. A permission request is a question the agent is
   // blocked on; a palette over it would answer neither.
   if (document.querySelector("dialog[open]")) return;
   closeAttachMenu();
   closeRowMenu();
+  paletteSessionsOnly = sessionsOnly === true;
+  paletteField.placeholder = t(paletteSessionsOnly ? "palette.sessionsPlaceholder" : "palette.placeholder");
   paletteField.value = "";
   paletteCursor = 0;
   paintPalette();
@@ -471,7 +489,7 @@ function openPalette() {
 // The desktop shell reaches the palette through this: a menu accelerator is
 // handled before the page ever sees the keystroke, so the menu item calls the
 // same function the key would have.
-window.openCommandPalette = openPalette;
+window.openCommandPalette = () => openPalette();
 
 paletteField.addEventListener("input", () => {
   paletteCursor = 0;
@@ -520,7 +538,8 @@ document.addEventListener("keydown", (e) => {
   openPalette();
 });
 
-document.getElementById("nav-search").addEventListener("click", openPalette);
+document.getElementById("nav-search").addEventListener("click", () => openPalette());
+document.getElementById("side-search").addEventListener("click", () => openPalette(true));
 // The chord as this machine actually spells it, in the one place a mouse user
 // will see it.
 document.getElementById("palette-hint").textContent = IS_MAC ? "⌘K" : "Ctrl K";
@@ -540,43 +559,151 @@ function applyStrings() {
   for (const node of document.querySelectorAll("[data-t-aria-label]")) {
     node.setAttribute("aria-label", ts(node.dataset.tAriaLabel));
   }
+  // The rail shows icons only, so each names itself to a screen reader in the
+  // words its hidden label carries; the hover label below reads the same.
+  for (const item of document.querySelectorAll("#rail .nav-item")) {
+    const label = item.querySelector("[data-t]");
+    if (label) item.setAttribute("aria-label", label.textContent);
+  }
   document.documentElement.lang = LOCALE;
 }
 
+/*
+ * The rail's names, beside the icon the pointer is on.
+ *
+ * Not the title attribute: the browser shows that after a second's pause, in
+ * its own style, and an icon that only says what it is if you wait is one
+ * people click to find out. One label for the whole rail, placed against the
+ * button, because the rail clips anything that tries to hang out of it.
+ */
+const railTip = document.createElement("div");
+railTip.className = "rail-tip";
+railTip.setAttribute("aria-hidden", "true");
+document.body.appendChild(railTip);
+function showRailTip(item) {
+  const name = item.getAttribute("aria-label");
+  if (!name) return;
+  const box = item.getBoundingClientRect();
+  railTip.textContent = name;
+  railTip.style.left = box.right + 8 + "px";
+  railTip.style.top = box.top + box.height / 2 + "px";
+  railTip.classList.add("on");
+}
+const hideRailTip = () => railTip.classList.remove("on");
+const rail = document.getElementById("rail");
+rail.addEventListener("mouseover", (event) => {
+  const item = event.target.closest(".nav-item");
+  if (item) showRailTip(item);
+  else hideRailTip();
+});
+rail.addEventListener("mouseleave", hideRailTip);
+rail.addEventListener("focusin", (event) => {
+  const item = event.target.closest(".nav-item");
+  if (item && item.matches(":focus-visible")) showRailTip(item);
+});
+rail.addEventListener("focusout", hideRailTip);
+rail.addEventListener("click", hideRailTip);
+
 /**
- * What the empty state offers to do, grouped by the kind of work it is.
+ * What the empty state offers to do.
  *
- * One chip is drawn from each group, so the three on screen always span
- * writing code, getting through the day's work, and taking the thing to
- * market — three variations on "read my repo" would teach a new person that
- * this is a code-reading tool and nothing else. Each id names a label and a
- * "…prompt" string; the label is what fits on
- * a chip, the prompt is the sentence the chip actually sends.
+ * The server decides which kind: a project with no memory gets a rotating pool
+ * of everyday offers, and one the agent has notes on gets three written from
+ * those notes (see ../../starters.ts). Each chip's label is what fits on it,
+ * and the sentence it actually sends rides along in data-p.
  */
-const STARTERS = [
-  ["explain", "bugs", "tests", "review", "faster"],
-  ["plan", "docs", "digest", "automate", "backlog"],
-  ["landing", "launch", "pitch", "position", "changelog"],
-];
+const FIXED_STARTERS = ["trip", "email", "research", "savings", "japanTrip"];
+const VISIBLE_STARTERS = 3;
+const STARTER_ROTATION_MS = 6000;
+/** Which project the chips on screen were drawn for, and the newest ask. */
+let startersFor = "";
+let startersAsk = 0;
+let starterOffset = 0;
+let starterTimer;
+
+function starterChip(label, prompt) {
+  const button = el("button", "", label);
+  button.type = "button";
+  button.dataset.p = prompt;
+  // The label is a chip; the title is the sentence it will actually send.
+  button.title = prompt;
+  return button;
+}
+
+function animateStarters(box) {
+  box.classList.remove("fresh");
+  void box.offsetWidth;
+  box.classList.add("fresh");
+}
+
+function stopStarterRotation() {
+  clearInterval(starterTimer);
+  starterTimer = undefined;
+}
+
+function drawFixedStarters(box, animate = false) {
+  const ids = Array.from({ length: VISIBLE_STARTERS }, (_, index) =>
+    FIXED_STARTERS[(starterOffset + index) % FIXED_STARTERS.length]);
+  box.replaceChildren(...ids.map((id) => starterChip(t("starter." + id), t("starter." + id + ".prompt"))));
+  if (animate) animateStarters(box);
+}
+
+function startStarterRotation(box) {
+  stopStarterRotation();
+  if (FIXED_STARTERS.length <= VISIBLE_STARTERS) return;
+  starterTimer = setInterval(() => {
+    // Do not move a choice out from under a mouse pointer or keyboard focus.
+    if (!box.offsetParent || box.matches(":hover") || box.matches(":focus-within")) return;
+    starterOffset = (starterOffset + 1) % FIXED_STARTERS.length;
+    drawFixedStarters(box, true);
+  }, STARTER_ROTATION_MS);
+}
 
 /**
- * Draw one chip per group. The sentence rides along in data-p, and the click
- * is wired at the end of boot with the rest of them: a chip that submits before
- * the session it would submit to has loaded is worse than one that waits.
+ * Ask for the project's chips and draw them. Skipped when the project on
+ * screen has not changed, so a repaint of the project button does not pay for
+ * another round trip. The answer never waits on a model: a project whose set
+ * is not written yet gets the fixed three now, and the written set arrives
+ * later as a "starters" event (see startersArrived).
  */
-function paintStarters() {
+async function paintStarters(cwd) {
   const box = document.getElementById("starters");
-  if (!box) return;
+  if (!box || !cwd || cwd === startersFor) return;
+  stopStarterRotation();
+  startersFor = cwd;
+  starterOffset = 0;
+  const ask = ++startersAsk;
   box.replaceChildren();
-  for (const group of STARTERS) {
-    const id = group[Math.floor(Math.random() * group.length)];
-    const button = el("button", "", t("starter." + id));
-    button.type = "button";
-    button.dataset.p = t("starter." + id + ".prompt");
-    // The label is a chip; the title is the sentence it will actually send.
-    button.title = button.dataset.p;
-    box.appendChild(button);
+  let body;
+  try {
+    body = await getJson("/starters?cwd=" + encodeURIComponent(cwd) + "&locale=" + encodeURIComponent(LOCALE));
+  } catch {
+    body = { kind: "fixed" };
   }
+  // A switch made while this was being written owns the box now.
+  if (ask !== startersAsk) return;
+  if (body && body.kind === "written" && Array.isArray(body.starters)) {
+    box.replaceChildren(...body.starters.map((item) => starterChip(item.label, item.prompt)));
+  } else {
+    drawFixedStarters(box);
+    startStarterRotation(box);
+  }
+}
+
+/**
+ * A set written in the background for a project, pushed when it lands.
+ *
+ * Swapped in only where it still fits: the same project and language on
+ * screen, and the empty state still showing — nobody's chip is replaced while
+ * they are reading a conversation, and the next visit reads it from disk.
+ */
+function startersArrived(event) {
+  const box = document.getElementById("starters");
+  if (!box || !event || event.cwd !== startersFor || event.locale !== LOCALE || !Array.isArray(event.starters)) return;
+  if (!box.offsetParent) return;
+  stopStarterRotation();
+  box.replaceChildren(...event.starters.map((item) => starterChip(item.label, item.prompt)));
+  animateStarters(box);
 }
 
 /**
@@ -628,9 +755,52 @@ if (IS_DESKTOP && window.oharness.updates) {
   window.oharness.updates.state().then(paintUpdateHint, () => {});
 }
 
+/**
+ * A prompt from a link on the website — oharness://new?prompt=… — opened as a
+ * new session with the text in the composer, and nothing more.
+ *
+ * The main process checked and cleaned the text (desktop/deep-link.js), but
+ * it came from whatever page the person was on, so this page treats it as
+ * someone else's suggestion: it is never sent, no permission is changed and
+ * no card is answered. It sits in the box until the person reads it and
+ * presses send, or deletes it. A new session rather than the open one, so the
+ * suggestion never lands in the middle of a conversation as if it belonged
+ * there; and a draft already in the box is only replaced when the person says
+ * so, because the box is shared by every tab and the draft may be the only
+ * copy of what they were writing.
+ *
+ * Not before boot has finished: switching sessions while the first one is
+ * still being opened leaves the two fighting over the page. Boot takes the
+ * one that launched the app at the end; the nudge covers every later click.
+ */
+let deepLinkReady = false;
+
+async function takeDeepLink() {
+  if (!deepLinkReady || !IS_DESKTOP || !window.oharness.deepLink) return;
+  let text;
+  try {
+    text = await window.oharness.deepLink.take();
+  } catch {
+    return;
+  }
+  if (typeof text !== "string" || !text) return;
+  const draft = input.value.trim();
+  if (draft && draft !== text && !confirm(t("deepLink.replaceDraft"))) return;
+  await switchTo({ action: "new" });
+  input.value = text;
+  // Called rather than an input event, which would also open the command
+  // menu for a prompt that starts with "/" — one Enter from running it.
+  autosize();
+  paintMirror();
+  input.focus();
+  input.setSelectionRange(input.value.length, input.value.length);
+}
+if (IS_DESKTOP && window.oharness.deepLink) {
+  window.oharness.deepLink.onArrived(() => void takeDeepLink());
+}
+
 void (async () => {
   applyStrings();
-  paintStarters();
   // The language is here because it is the one thing that decides what to
   // translate next, and the shell because a desktop window and a browser tab
   // are different products to the person using them.
@@ -685,18 +855,26 @@ void (async () => {
   await loadSidePanels();
   await loadProjects();
 
-  for (const button of document.querySelectorAll("#starters button")) {
-    button.addEventListener("click", () => {
-      input.value = button.dataset.p;
-      paintMirror();
-      document.getElementById("composer").requestSubmit();
-    });
-  }
+  // Wired here, after the session has loaded: a chip that submits before the
+  // session it would submit to exists is worse than one that waits. Delegated,
+  // because the chips are redrawn on every project switch. Absent when the tab
+  // opened on a conversation: its first entry took the invitation off the
+  // page, and a throw here stopped everything after it, the session list too.
+  document.getElementById("starters")?.addEventListener("click", (event) => {
+    const button = event.target.closest("#starters button");
+    if (!button) return;
+    stopStarterRotation();
+    input.value = button.dataset.p;
+    paintMirror();
+    document.getElementById("composer").requestSubmit();
+  });
   await loadSessions();
   await refreshRoutineCount();
   await refreshPluginPages();
   await refreshModelCount();
   await loadAccount();
   input.focus();
+  deepLinkReady = true;
+  await takeDeepLink();
 })();`;
 //# sourceMappingURL=shell.js.map

package/dist/page/client/shell.js.map

@@ -1 +1 @@
-{"version":3,"file":"shell.js","sourceRoot":"","sources":["../../../src/page/client/shell.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAurBzB,CAAC"}
+{"version":3,"file":"shell.js","sourceRoot":"","sources":["../../../src/page/client/shell.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAy2BzB,CAAC"}