@kevin5251984/guild 0.2.17 → 0.2.19

package/src/public/chat.html

@@ -8,7 +8,7 @@
     <link rel="icon" href="/favicon-32.png" type="image/png" sizes="32x32" />
     <link rel="icon" href="/favicon-16.png" type="image/png" sizes="16x16" />
     <title>Guild — 大廳</title>
-    <link rel="stylesheet" href="/chat.css?v=press-enamel" />
+    <link rel="stylesheet" href="/chat.css?v=quest-nest" />
     <script src="/i18n.js"></script>
     <script src="/md.js"></script>
   </head>
@@ -341,6 +341,15 @@
         const glyph = Array.from(String(name).replace(/\s+/g, ""))[0] || "?";
         return glyph;
       }
+      function portraitUrl(bot) {
+        const url = bot && typeof bot.portrait === "string" ? bot.portrait.trim() : "";
+        return url.indexOf("/generated/") === 0 ? url : "";
+      }
+      function avatarFace(bot) {
+        const src = portraitUrl(bot);
+        if (src) return '<img alt="" src="' + escapeHtml(src) + '">';
+        return escapeHtml(initials((bot && (bot.name || bot.handle)) || "?"));
+      }
       function escapeHtml(value) {
         return String(value)
           .replace(/&/g, "&amp;")
@@ -1128,6 +1137,12 @@
           hour12: true,
         });
       }
+      function formatMsgWhen(iso) {
+        const day = formatMsgDay(iso);
+        const clock = formatMsgClock(iso);
+        if (day && clock) return day + " " + clock;
+        return clock || day || "";
+      }
       function formatMsgDay(iso) {
         if (!iso) return "";
         const when = new Date(iso);
@@ -1266,11 +1281,15 @@
         const foot = opts.party
           ? opts.party
           : "<em>" + escapeHtml(opts.preview || "") + "</em>";
-        return (
-          '<li><a class="nav-row' +
+        const cls =
+          "nav-row" +
           (opts.on ? " on" : "") +
           (opts.unread ? " unread" : "") +
           (opts.notice ? " notice" : "") +
+          (opts.branch ? " nav-branch" : "");
+        const inner =
+          '<a class="' +
+          cls +
           '" href="' +
           opts.href +
           '">' +
@@ -1282,8 +1301,9 @@
           right +
           "</span>" +
           foot +
-          "</span></a></li>"
-        );
+          "</span></a>";
+        if (opts.bare) return inner;
+        return "<li>" + inner + "</li>";
       }
       function partyStackHtml(members) {
         const bots = Array.isArray(members) ? members : [];
@@ -1293,7 +1313,7 @@
               '<span class="avatar" style="background:' +
               hue(bot.handle) +
               '">' +
-              escapeHtml(initials(bot.name)) +
+              avatarFace(bot) +
               "</span>",
           )
           .join("");
@@ -1343,31 +1363,93 @@
       }
       function renderNav() {
         const q = document.getElementById("filter").value.toLowerCase();
-        const channels = state.channels
-          .filter((ch) => !q || ch.name.toLowerCase().includes(q))
+        const all = state.channels || [];
+        const byId = new Map(all.map((ch) => [ch.id, ch]));
+        const kidsOf = (id) =>
+          all.filter((ch) => ch.parentId === id).slice().sort(byUpdatedAtDesc);
+        const visible = new Set();
+        for (const ch of all) {
+          const hit = !q || String(ch.name || "").toLowerCase().includes(q);
+          if (!hit) continue;
+          let walk = ch;
+          while (walk) {
+            visible.add(walk.id);
+            walk = walk.parentId ? byId.get(walk.parentId) : null;
+          }
+        }
+        function channelBusy(ch) {
+          return Boolean(
+            (state.busyRoom &&
+              state.busyRoom.kind === "channel" &&
+              state.busyRoom.id === ch.id) ||
+              (state.serverLive || []).some(
+                (row) => row.kind === "channel" && row.id === ch.id,
+              ),
+          );
+        }
+        function channelUpdated(ch) {
+          let latest = ch.updatedAt ? Date.parse(ch.updatedAt) : 0;
+          for (const kid of kidsOf(ch.id)) {
+            const child = channelUpdated(kid);
+            const ts = child ? Date.parse(child) : 0;
+            if (ts > latest) latest = ts;
+          }
+          return Number.isFinite(latest) && latest > 0
+            ? new Date(latest).toISOString()
+            : ch.updatedAt;
+        }
+        function branchTree(parentId) {
+          return kidsOf(parentId)
+            .filter((ch) => visible.has(ch.id))
+            .map((ch) => {
+              const nested = branchTree(ch.id);
+              const row = navRowHtml({
+                bare: true,
+                branch: true,
+                href: "#c/" + encodeURIComponent(ch.id),
+                on: state.kind === "channel" && state.id === ch.id,
+                notice: true,
+                name: "↳ " + ch.name,
+                updatedAt: ch.updatedAt,
+                party: partyStackHtml(ch.members),
+                busy: channelBusy(ch),
+                unread: state.unread.has(roomKey("channel", ch.id)),
+              });
+              return nested
+                ? "<li>" + row + '<ul class="nav-branches">' + nested + "</ul></li>"
+                : "<li>" + row + "</li>";
+            })
+            .join("");
+        }
+        const roots = all
+          .filter((ch) => !ch.parentId && visible.has(ch.id))
           .slice()
-          .sort(byUpdatedAtDesc);
-        document.getElementById("channels").innerHTML = channels
+          .sort((a, b) =>
+            byUpdatedAtDesc(
+              { updatedAt: channelUpdated(a) },
+              { updatedAt: channelUpdated(b) },
+            ),
+          );
+        document.getElementById("channels").innerHTML = roots
           .map((ch) => {
-            const busy = Boolean(
-              (state.busyRoom &&
-                state.busyRoom.kind === "channel" &&
-                state.busyRoom.id === ch.id) ||
-                (state.serverLive || []).some(
-                  (row) => row.kind === "channel" && row.id === ch.id,
-                ),
-            );
-            const unread = state.unread.has(roomKey("channel", ch.id));
-            return navRowHtml({
+            const nested = branchTree(ch.id);
+            const row = navRowHtml({
+              bare: true,
               href: "#c/" + encodeURIComponent(ch.id),
               on: state.kind === "channel" && state.id === ch.id,
               notice: true,
               name: ch.name,
-              updatedAt: ch.updatedAt,
+              updatedAt: channelUpdated(ch),
               party: partyStackHtml(ch.members),
-              busy: busy,
-              unread: unread,
+              busy: channelBusy(ch),
+              unread: state.unread.has(roomKey("channel", ch.id)),
             });
+            return (
+              '<li class="nav-quest">' +
+              row +
+              (nested ? '<ul class="nav-branches">' + nested + "</ul>" : "") +
+              "</li>"
+            );
           })
           .join("");
         const bots = state.bots
@@ -1391,7 +1473,7 @@
                 '<span class="avatar" style="background:' +
                 hue(bot.handle) +
                 '">' +
-                escapeHtml(initials(bot.name)) +
+                avatarFace(bot) +
                 "</span>",
               name: bot.name,
               updatedAt: bot.updatedAt,
@@ -1426,7 +1508,7 @@
           '" style="background:' +
           hue(bot.handle) +
           '">' +
-          escapeHtml(initials(bot.name)) +
+          avatarFace(bot) +
           '</button><span class="who"><strong>' +
           escapeHtml(bot.name) +
           "</strong><em>@" +
@@ -1445,9 +1527,9 @@
           document.getElementById("subtitle").textContent = "";
           wrap.hidden = true;
           document.getElementById("members-pop").hidden = true;
-          av.textContent = bot ? initials(bot.name) : "?";
           av.style.background = bot ? hue(bot.handle) : "#333";
           av.classList.remove("hash-av");
+          av.innerHTML = bot ? avatarFace(bot) : "?";
           if (bot) {
             av.setAttribute("href", "#");
             av.setAttribute("data-bot-id", bot.id);
@@ -1480,7 +1562,7 @@
               '<span class="avatar" style="background:' +
               hue(bot.handle) +
               '">' +
-              escapeHtml(initials(bot.name)) +
+              avatarFace(bot) +
               "</span>",
           )
           .join("");
@@ -1624,7 +1706,7 @@
             '" style="background:' +
             hue(bot.handle) +
             '">' +
-            escapeHtml(initials(bot.name)) +
+            avatarFace(bot) +
             "</button>",
           head:
             '<div class="msg-head"><button type="button" class="name"' +
@@ -1848,23 +1930,28 @@
         rail.innerHTML = you
           .map((el) => {
             const id = el.getAttribute("data-id") || "";
+            const when = formatMsgWhen(el.getAttribute("data-at") || "");
             const preview = youPromptPreview(el);
             const top = Math.max(
               6,
               Math.min(track - 6, ((el.offsetTop + el.offsetHeight / 2) / total) * track),
             );
+            const label = [when, preview].filter(Boolean).join(" · ");
             return (
               '<button type="button" class="prompt-tick" data-prompt-jump="' +
               escapeHtml(id) +
               '" style="top:' +
               top +
-              'px"' +
+              'px" aria-label="' +
+              escapeHtml(t("promptJump") + (label ? " · " + label : "")) +
+              '"><span class="prompt-tip">' +
+              (when
+                ? '<time class="prompt-tip-when">' + escapeHtml(when) + "</time>"
+                : "") +
               (preview
-                ? ' data-preview="' + escapeHtml(preview) + '"'
+                ? '<span class="prompt-tip-text">' + escapeHtml(preview) + "</span>"
                 : "") +
-              ' aria-label="' +
-              escapeHtml(t("promptJump") + (preview ? " · " + preview : "")) +
-              '"></button>'
+              "</span></button>"
             );
           })
           .join("");
@@ -1988,6 +2075,15 @@
                     '">' +
                     t("retry") +
                     "</button>" +
+                  (state.kind === "channel" &&
+                  !msg.queued &&
+                  String(msg.id || "").indexOf("pending-") !== 0
+                    ? '<button type="button" data-branch="' +
+                      escapeHtml(msg.id) +
+                      '">' +
+                      t("branch") +
+                      "</button>"
+                    : "") +
                   (msg.queued
                     ? ""
                     : '<button type="button" class="danger" data-msg-del="' +
@@ -2003,6 +2099,8 @@
                   (msg.queued ? " queued" : msg.steer ? " steer" : "") +
                   '" data-id="' +
                   escapeHtml(msg.id) +
+                  '" data-at="' +
+                  escapeHtml(stamp) +
                   '">' +
                   clock +
                   body +
@@ -2021,7 +2119,7 @@
                 '" style="background:' +
                 hue(handle || name) +
                 '">' +
-                escapeHtml(initials(name)) +
+                (bot ? avatarFace(bot) : escapeHtml(initials(name))) +
                 "</button>";
               const head =
                 '<div class="msg-head"><button type="button" class="name"' +
@@ -2122,6 +2220,30 @@
         await loadWorkspace();
         if (state.kind === "channel") await loadMessages();
       }
+      async function closeBranch(id, ch) {
+        if (!id) return;
+        if (!confirm(t("branch.closeConfirm", { name: (ch && ch.name) || id }))) {
+          return;
+        }
+        const merge = confirm(t("branch.closeMerge"));
+        const res = await fetch(
+          "/channels/" + encodeURIComponent(id) + "/close",
+          {
+            method: "POST",
+            headers: { "content-type": "application/json" },
+            body: JSON.stringify({ merge: merge }),
+          },
+        );
+        const body = await res.json().catch(() => ({}));
+        if (!res.ok) throw new Error(body.error || t("branch.closeFailed"));
+        const parentId = (ch && ch.parentId) || body.parentId || "channel-general";
+        if (state.kind === "channel" && state.id === id) {
+          state.id = parentId;
+          setHash();
+        }
+        await loadWorkspace();
+        if (state.kind === "channel") await loadMessages();
+      }
 
 
       function roomMessagesUrl(kind, id, suffix) {
@@ -2471,6 +2593,29 @@
         renderThread();
         renderNav();
       }
+      async function branchFromMessage(id) {
+        if (state.kind !== "channel" || !state.id) return;
+        const msg = state.messages.find((item) => item.id === id);
+        if (!msg) return;
+        const def = String(msg.body || "")
+          .replace(/\s+/g, " ")
+          .trim()
+          .slice(0, 28);
+        const typed = window.prompt(t("branch.name"), def || "");
+        if (typed === null) return;
+        const name = typed.trim() || def;
+        const res = await fetch(
+          "/channels/" + encodeURIComponent(state.id) + "/branches",
+          {
+            method: "POST",
+            headers: { "content-type": "application/json" },
+            body: JSON.stringify({ messageId: id, name: name || undefined }),
+          },
+        );
+        const body = await res.json().catch(() => ({}));
+        if (!res.ok) throw new Error(body.error || "branch failed");
+        location.hash = "#c/" + encodeURIComponent(body.id);
+      }
       async function retryMessage(id, body) {
         if (canStopHere()) {
           stopTurn();
@@ -2499,6 +2644,7 @@
         const payload = {};
         if (typeof body === "string") payload.body = body;
         if (botIds.length === 1) payload.assigneeId = botIds[0];
+        if (botIds.length) payload.mentions = botIds;
         await postChat(
           messagesUrl(id) + "/retry",
           payload,
@@ -2688,6 +2834,12 @@
             await retryMessage(retry.getAttribute("data-retry"));
             return;
           }
+          const branchBtn = event.target.closest("[data-branch]");
+          if (branchBtn) {
+            event.preventDefault();
+            await branchFromMessage(branchBtn.getAttribute("data-branch"));
+            return;
+          }
           const del = event.target.closest("[data-msg-del]");
           if (del) {
             event.preventDefault();
@@ -2807,7 +2959,11 @@
         const nameEl = document.getElementById("channel-md-name");
         nameEl.value = ch ? ch.name : "";
         nameEl.disabled = locked;
-        document.getElementById("channel-md-del").hidden = locked;
+        const del = document.getElementById("channel-md-del");
+        const branched = Boolean(ch && ch.parentId);
+        del.hidden = locked;
+        del.setAttribute("data-i18n", branched ? "branch.close" : "channel.delete");
+        del.textContent = t(branched ? "branch.close" : "channel.delete");
         channelMdDialog.showModal();
       }
       const botMemoryDialog = document.getElementById("bot-memory");
@@ -2997,7 +3153,8 @@
       document.getElementById("channel-md-del").addEventListener("click", async () => {
         const ch = currentChannel();
         try {
-          await deleteChannel(state.id, ch && ch.name);
+          if (ch && ch.parentId) await closeBranch(state.id, ch);
+          else await deleteChannel(state.id, ch && ch.name);
           channelMdDialog.close();
         } catch (err) {
           alert(err.message);
@@ -4385,11 +4542,13 @@
         if (!pending) return;
         const fromCands = (cands || []).map((bot) => bot.id).filter(Boolean);
         const fromReply = replyAuthorId(pending.replyTo);
-        const botIds = fromCands.length
-          ? fromCands
+        const botIds = summoned.length
+          ? summoned
           : fromReply
             ? [fromReply]
-            : botsFromSend(pending.raw) || [];
+            : fromCands.length
+              ? fromCands
+              : botsFromSend(pending.raw) || [];
         const assigneeId = botIds.length === 1 ? botIds[0] : "";
         const ids = botIds;
         const split = splitSendTargets(ids);
@@ -4432,6 +4591,7 @@
         if (replyTo) payload.replyTo = replyTo;
         if (attachments.length) payload.attachments = attachments;
         if (assigneeId) payload.assigneeId = assigneeId;
+        if (botIds && botIds.length) payload.mentions = botIds;
         if (here) {
           state.messages = state.messages.concat([
             {
@@ -4481,7 +4641,7 @@
               '"><span class="avatar sm" style="background:' +
               hue(bot.handle) +
               '">' +
-              escapeHtml(initials(bot.name)) +
+              avatarFace(bot) +
               '</span><span class="assign-copy"><strong>' +
               escapeHtml(bot.name) +
               "</strong><span>@" +
@@ -4547,8 +4707,15 @@
           openAssign(cands, { raw: raw, packed: packed, replyTo: replyTo });
           return;
         }
-        const botIds = botsFromSend(raw);
-        const assigneeId = cands.length === 1 ? cands[0].id : "";
+        const fromReply = replyAuthorId(replyTo);
+        const botIds = summoned.length
+          ? summoned
+          : fromReply
+            ? [fromReply]
+            : botsFromSend(raw);
+        const assigneeId = summoned.length === 1
+          ? summoned[0]
+          : fromReply || (cands.length === 1 ? cands[0].id : "");
         await flushSend(raw, packed, replyTo, botIds, assigneeId);
       });
       function asLibList(value) {
@@ -5537,7 +5704,9 @@
               ? '<span class="traj-av" style="background:' +
                 hue(bot.handle) +
                 '">' +
-                escapeHtml(glyph) +
+                (portraitUrl(bot)
+                  ? '<img alt="" src="' + escapeHtml(portraitUrl(bot)) + '">'
+                  : escapeHtml(glyph)) +
                 "</span>"
               : '<span class="traj-av you">' + escapeHtml(glyph) + "</span>";
             return (

package/src/public/i18n.js

@@ -1,6 +1,10 @@
 /** Guild UI strings. Default follows the browser; packs are zh-Hant and en. */
 var I18N_ROWS = [
   ["title.chat", "Guild — 大廳", "Guild — Hall"],
+  ["title.mobile", "Guild — 外出", "Guild — Away"],
+  ["mobile.hint", "外出時用 Tailscale 連到家裡這台 guildd（埠 7420）。", "Away from the desk: Tailscale onto this machine's guildd (port 7420)."],
+  ["mobile.back", "返回委託", "Back to channels"],
+  ["mobile.recent", "只顯示最近 {n} 則。完整紀錄在大廳。", "Showing the latest {n}. Full log is in the hall."],
   ["title.library", "Guild — 技能庫", "Guild — Skills"],
   ["title.subagents", "Guild — 子代理", "Guild — Subagents"],
   ["title.subagentsAdd", "Guild — 新增子代理", "Guild — Add subagent"],
@@ -24,7 +28,7 @@ var I18N_ROWS = [
   ["search.subagents", "搜尋子代理", "Search subagents"],
   ["search.mcp", "搜尋 MCP", "Search MCP"],
   ["search.models", "搜尋全部模型", "Search all models"],
-  ["search.traj", "搜尋 system / tool / spawn / 結果", "Search system / tool / spawn / result"],
+  ["search.traj", "搜尋 system / tool / spawn / 子代理 / 結果", "Search system / tool / spawn / subagent / result"],
   ["channels", "委託", "Channels"],
   ["dms", "密談", "Whispers"],
   ["newChannel", "新委託", "New channel"],
@@ -63,6 +67,12 @@ var I18N_ROWS = [
   ["edit", "編輯", "Edit"],
   ["reply", "回覆", "Reply"],
   ["retry", "重問", "Retry"],
+  ["branch", "分支", "Branch"],
+  ["branch.name", "子委託名稱", "Name this side quest"],
+  ["branch.close", "結案", "Close quest"],
+  ["branch.closeConfirm", "結案 #{name}？子委託會從側欄拿掉。", "Close #{name}? It leaves the sidebar."],
+  ["branch.closeMerge", "要把紀錄整理後寫回主委託 MEMORY.md 嗎？", "Write the notes back into the parent MEMORY.md?"],
+  ["branch.closeFailed", "結案失敗", "Couldn't close"],
   ["stats", "統計", "Stats"],
   ["stats.title", "回應統計", "Response statistics"],
   ["stats.tokens", "Token", "Tokens"],
@@ -71,7 +81,7 @@ var I18N_ROWS = [
   ["stats.rounds", "模型回合", "Agent rounds"],
   ["stats.cost", "費用", "Cost"],
   ["stats.estimated", "估算", "Estimated"],
-  ["stats.inOut", "輸入 {in} · 輸出 {out}", "in {in} · out {out}"],
+  ["stats.inOut", "輸入 {in} · 快取命中 {cache} · 輸出 {out}", "in {in} · cache {cache} · out {out}"],
   ["askAgain", "重新詢問", "Ask again"],
   ["send", "送出", "Send"],
   ["jumpBottom", "滾到最新", "Jump to latest"],
@@ -95,6 +105,11 @@ var I18N_ROWS = [
   ["busy", "忙碌中", "Busy"],
   ["unread", "未讀", "Unread"],
   ["noMessages", "還沒有紀錄。寫一句話開始。據點裡記得 @handle。", "No log yet. Say something. In a hall, @handle an adventurer."],
+  ["setup.kicker", "第一步", "Step 1"],
+  ["setup.needModel", "還沒接模型。Guild 不能想、也不能跑工具。", "No model yet. Guild cannot think or run tools."],
+  ["setup.needModelBody", "先連接訂閱或填 API key，套用主模型，再回來點名。", "Connect a subscription or paste an API key, apply a default, then come back to @mention someone."],
+  ["setup.subs", "連接訂閱", "Connect a subscription"],
+  ["setup.keys", "填 API key", "Add an API key"],
   ["dm", "密談", "Whisper"],
   ["justNow", "剛剛", "Just now"],
   ["minutesAgo", "{n} 分鐘前", "{n} min ago"],
@@ -140,15 +155,16 @@ var I18N_ROWS = [
   ["remove", "移除", "Remove"],
   ["cancelReply", "取消回覆", "Cancel reply"],
   ["replying", "回覆…", "Replying…"],
-  ["trace", "Trajectory", "Trajectory"],
+  ["trace", "軌跡", "Trajectory"],
   ["trace.steps", "步驟", "Steps"],
   ["trace.long", "長輸出", "Long output"],
   ["trace.pick", "選一筆事件。", "Select an event."],
   ["trace.empty", "沒有事件。送一則訊息後會開始記錄。", "No events yet. Send a message to start the log."],
-  ["trace.log", "append-only log", "append-only log"],
+  ["trace.log", "只追加紀錄", "append-only log"],
   ["trace.derived", "由訊息還原", "rebuilt from messages"],
   ["trace.live", "進行中", "in progress"],
   ["trace.loading", "讀取中…", "Loading…"],
+  ["trace.filter.all", "全部", "All"],
   ["html.preview", "預覽", "Preview"],
   ["html.code", "原始碼", "Code"],
   ["html.expand", "放大預覽", "Expand preview"],
@@ -266,7 +282,7 @@ var I18N_ROWS = [
   ["library.local", "本機", "Host"],
   ["settings.eyebrow", "Hermes-style", "Hermes-style"],
   ["settings.title", "模型", "Models"],
-  ["settings.lede", "訂閱帳號走 OAuth。API key 可同時掛多家供應商，寫入 ~/.guild/models.json。", "Log in with a subscription. API keys can cover several providers and are written to ~/.guild/models.json."],
+  ["settings.lede", "第一次：先連訂閱或填 API key，再套用主模型。沒有模型就不能用。訂閱走 OAuth；API key 寫入 ~/.guild/models.json。", "First time: connect a subscription or paste an API key, then apply a default. Guild does not run without a model. Subscriptions use OAuth. API keys go in ~/.guild/models.json."],
   ["settings.accounts", "連接帳號", "Accounts"],
   ["settings.accountsHint", "用訂閱登入，不必複製金鑰。瀏覽器完成授權後會自動刷新 token。", "Subscription login, no key paste. Tokens refresh after the browser handshake."],
   ["settings.connect", "連接", "Connect"],
@@ -275,6 +291,18 @@ var I18N_ROWS = [
   ["settings.pending", "登入中", "Signing in"],
   ["settings.keys", "API 金鑰供應商", "API key providers"],
   ["settings.keysHint", "點名稱切換供應商。要加新的，點「＋ 新增」。金鑰可用 $ENV 或直接貼上。", "Tap a name to switch. Tap “+ Add” for a new provider. Keys can be $ENV or pasted."],
+  ["settings.keyless", "無需金鑰", "No key needed"],
+  ["settings.opencodeFreeHint", "不用登入、不用註冊、不用環境變數。走 OpenCode Zen 匿名免費層。", "No login, no account, no env var. OpenCode Zen's anonymous free tier."],
+  ["settings.saveKeylessHint", "這家不用金鑰。套用主模型即可。", "No key to save. Apply it as the default."],
+  ["settings.sync", "Sync", "Sync"],
+  ["settings.syncing", "同步並測試中…", "Syncing and probing…"],
+  ["settings.synced", "已同步 {n} 個可用模型", "Synced {n} working models"],
+  ["settings.syncedSkip", "已同步 {ok} 個可用 · 略過 {names}", "Synced {ok} working · skipped {names}"],
+  ["settings.syncedNone", "目錄有了，但沒有模型測得通", "Catalog ok, but no model answered"],
+  ["settings.probeOk", "可用", "Works"],
+  ["settings.probeBusy", "限流", "Busy"],
+  ["settings.probeFail", "無法連線", "Down"],
+  ["settings.syncFailed", "同步失敗", "Couldn't sync"],
   ["settings.noProviders", "還沒有供應商。點「＋ 新增」選一家模板。", "No providers yet. Tap “+ Add” and pick a template."],
   ["settings.addProvider", "新增供應商", "Add provider"],
   ["settings.addChip", "＋ 新增", "+ Add"],
@@ -286,7 +314,7 @@ var I18N_ROWS = [
   ["settings.provider", "供應商", "Provider"],
   ["settings.apply", "套用", "Apply"],
   ["settings.aux", "輔助模型", "Auxiliary models"],
-  ["settings.auxHint", "Vision、Web extract、Compression 等每一列都寫出實際模型。跟主模型時仍顯示名稱，不是空白。", "Each row — Vision, web extract, compression, and the rest — shows the model in use. Inherited rows still name the default."],
+  ["settings.auxHint", "只有 Vision、Web extract、SubAgent 可以另選模型。其餘用途一律跟主模型。", "Only Vision, web extract, and SubAgent can use a different model. Everything else follows the default."],
   ["settings.auxReset", "全部改回主模型", "Reset all to default"],
   ["settings.useMain", "改回跟主模型", "Follow default"],
   ["settings.change", "更改", "Change"],
@@ -297,6 +325,7 @@ var I18N_ROWS = [
   ["settings.noDefault", "尚未設定主模型", "No default model"],
   ["settings.currentMain", "目前主模型：{name}", "Default: {name}"],
   ["settings.delete", "刪除", "Delete"],
+  ["settings.deletedProvider", "已刪除 {name}", "Deleted {name}"],
   ["settings.locale", "介面語言", "Language"],
   ["settings.localeHint", "寫進這個瀏覽器。大廳、編制、工坊、模型共用。", "Saved in this browser. Shared by Hall, Roster, Workshop, and Models."],
   ["settings.oauthCode", "在瀏覽器開啟授權頁，輸入代碼：", "Open the auth page and enter this code:"],
@@ -326,6 +355,8 @@ var I18N_ROWS = [
   ["studio.streetAlt", "Guild 酒館門口", "Guild inn door"],
   ["studio.leave", "出門", "Leave"],
   ["studio.inn", "酒館", "Inn"],
+  ["studio.idle", "待命", "idle"],
+  ["studio.diving", "潛水", "diving"],
   ["studio.streetLine", "夜晚的酒館還開著。點那扇門進去。", "The inn is still open. Tap the door."],
   ["studio.tonight", "今晚", "Tonight"],
   ["studio.hire", "招募冒險者", "Recruit an adventurer"],
@@ -384,6 +415,10 @@ var I18N_ROWS = [
   ["studio.vacant", "空位", "Vacant"],
   ["studio.vacantLine", "空座位。要招冒險者進來嗎？", "Empty seat. Recruit someone?"],
   ["studio.hireChip", "招募", "Hire"],
+  ["studio.genLook", "生成形象", "Generate look"],
+  ["studio.genLookBusy", "畫臉中…", "Drawing…"],
+  ["studio.genLookDone", "新形象好了。", "New look ready."],
+  ["studio.genLookFail", "生圖失敗。到模型頁接 Grok 訂閱或填金鑰再試。", "Image failed. Connect a Grok subscription or add a key on the models page."],
   ["studio.drink", "……今晚在這兒喝酒。", "…drinking here tonight."],
   ["studio.notFound", "找不到這名冒險者", "Adventurer not found"],
   ["studio.editing", "正在編輯 @{handle} · 勾選只屬於這名冒險者", "Editing @{handle} · skills are only for this adventurer"],

package/src/public/index.html

@@ -15,6 +15,7 @@
       rel="stylesheet"
     />
     <link rel="stylesheet" href="/style.css" />
+    <script src="/buddy.js"></script>
   </head>
   <body class="office-page">
     <header class="appbar">
@@ -63,53 +64,7 @@
         const colors = ["#7c6af7", "#5b8def", "#2ea887", "#e07a3d", "#d4537e"];
         return colors[seedOf(key) % colors.length];
       }
-      function px(ctx, x, y, w, h, color) {
-        ctx.fillStyle = color;
-        ctx.fillRect(x, y, w, h);
-      }
-      function drawBuddy(canvas, shirt, seed) {
-        const ctx = canvas.getContext("2d");
-        canvas.width = 16;
-        canvas.height = 24;
-        ctx.imageSmoothingEnabled = false;
-        const skin = ["#f0c8a0", "#e2b184", "#c68642", "#8d5524"][seed % 4];
-        const hair = ["#2a1c12", "#c4a35a", "#1a1a1a", "#6b2d3c", "#3c4a6e"][seed % 5];
-        const outline = "#1b1510";
-        const pants = "#2a3140";
-        const style = seed % 3;
-
-        px(ctx, 4, 12, 8, 7, outline);
-        px(ctx, 5, 13, 6, 5, shirt);
-        px(ctx, 3, 13, 2, 5, shirt);
-        px(ctx, 11, 13, 2, 5, shirt);
-        px(ctx, 3, 18, 2, 1, skin);
-        px(ctx, 11, 18, 2, 1, skin);
-
-        px(ctx, 4, 4, 8, 8, outline);
-        px(ctx, 5, 5, 6, 6, skin);
-        px(ctx, 6, 7, 1, 1, outline);
-        px(ctx, 9, 7, 1, 1, outline);
-        px(ctx, 7, 9, 2, 1, "#c07070");
 
-        if (style === 0) {
-          px(ctx, 4, 3, 8, 3, hair);
-          px(ctx, 4, 5, 2, 3, hair);
-          px(ctx, 10, 5, 2, 3, hair);
-        } else if (style === 1) {
-          px(ctx, 4, 2, 8, 4, hair);
-          px(ctx, 3, 5, 2, 4, hair);
-          px(ctx, 11, 5, 2, 4, hair);
-        } else {
-          px(ctx, 5, 2, 6, 2, hair);
-          px(ctx, 4, 4, 8, 2, hair);
-          px(ctx, 7, 1, 2, 2, hair);
-        }
-
-        px(ctx, 5, 19, 3, 4, pants);
-        px(ctx, 8, 19, 3, 4, pants);
-        px(ctx, 5, 23, 3, 1, outline);
-        px(ctx, 8, 23, 3, 1, outline);
-      }
       function escapeHtml(value) {
         return String(value)
           .replace(/&/g, "&amp;")