opencode-subagent-magazine 1.1.2 → 1.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "opencode-subagent-magazine",
-  "version": "1.1.2",
+  "version": "1.2.0",
   "description": "OpenCode TUI plugin monitoring sub-agent invocation status in real time",
   "type": "module",
   "main": "dist/index.js",
@@ -11,7 +11,7 @@
       "types": "./dist/index.d.ts"
     },
     "./tui": {
-      "import": "./src/index.tsx",
+      "import": "./dist/tui.js",
       "config": {
         "enabled": true
       }
@@ -27,7 +27,8 @@
     "opencode-subagent-magazine": "install.mjs"
   },
   "scripts": {
-    "build": "tsc",
+    "build": "tsc && node build.tui.mjs",
+    "build:tui": "node build.tui.mjs",
     "typecheck": "tsc --noEmit",
     "version": "node -e \"require('fs').writeFileSync('src/_version.ts','// auto-generated\\nexport const PLUGIN_VERSION='+JSON.stringify(require('./package.json').version)+';\\n')\"",
     "prepublishOnly": "tsc"
@@ -54,6 +55,8 @@
   "devDependencies": {
     "@opencode-ai/plugin": "^1.14.50",
     "@opencode-ai/sdk": "^1.14.50",
+    "esbuild": "^0.25.0",
+    "esbuild-plugin-solid": "^0.5.0",
     "tsx": "^4.22.3",
     "typescript": "^5.8.0"
   }

package/src/_version.ts

@@ -1,2 +1,2 @@
 // auto-generated
-export const PLUGIN_VERSION="1.1.2";
+export const PLUGIN_VERSION="1.2.0";

package/src/index.tsx

@@ -45,6 +45,8 @@ interface SubEntry {
 }
 
 type Lang = "zh" | "en"
+type SortOrder = "desc" | "asc"
+type ScrollMode = "wheel" | "click"
 
 /** OpenCode built-in tool names that spawn sub-agents or delegate tasks. */
 const SUBAGENT_TOOLS = new Set(["task", "delegate", "call_omo_agent"])
@@ -68,10 +70,15 @@ const I18N: Record<Lang, Record<string, string>> = {
     "cost.label": "费用",
     "scroll.more": "更多",
     "scroll.top": "回顶",
+    "scroll.bottom": "回底",
     "dismiss.label": "标记完成",
     "status.running": "运行中",
     "status.done": "已完成",
     "status.error": "错误",
+    "order.desc": "降序（最新在前）",
+    "order.asc": "升序（最早在前）",
+    "scroll.wheel": "滚轮翻页",
+    "scroll.click": "点击翻页",
   },
   en: {
     "panel.title": "SubAgent",
@@ -87,10 +94,15 @@ const I18N: Record<Lang, Record<string, string>> = {
     "cost.label": "cost",
     "scroll.more": "more",
     "scroll.top": "Top",
+    "scroll.bottom": "Bottom",
     "dismiss.label": "dismiss",
     "status.running": "running",
     "status.done": "done",
     "status.error": "error",
+    "order.desc": "Desc (newest first)",
+    "order.asc": "Asc (oldest first)",
+    "scroll.wheel": "Wheel Scroll",
+    "scroll.click": "Click Scroll",
   },
 }
 
@@ -247,8 +259,7 @@ function safeErrorMsg(err: unknown): string {
 // Sidebar component
 // ===================================================================
 
-// 模块级缓存：保留各 session 的最新 entryMap，不随组件内 session 切换而丢失。
-// 当用户在子 session 内部时，handleSessionEnd 可通过此缓存找到父 session 的 entries。
+// 模块级缓存：各 session 的 entry 状态独立存储，不随当前视图切换而清除。
 const globalEntryCache = new Map<string, Map<string, SubEntry>>()
 
 function SubAgentPanel(props: {
@@ -256,6 +267,8 @@ function SubAgentPanel(props: {
   api: TuiPluginApi
   lang: () => Lang
   maxEntries: () => number
+  sortOrder: () => SortOrder
+  scrollMode: () => ScrollMode
   sessionId: string
 }): JSX.Element {
   const t = (key: string) => I18N[props.lang()][key] ?? key
@@ -347,8 +360,8 @@ function SubAgentPanel(props: {
     setEntryMapRaw((prev) => {
       const next = typeof arg === "function" ? (arg as Function)(prev) : arg
 
-      // 检测是否有 entry 从 running 变为 done/error → 立即写 KV
-      // 避免 session 切换时 KV 仍是旧状态，导致 scan 用 Date.now() 覆盖正确的 endedAt
+      // entry 状态落定（done/error）时立即持久化到 KV，跳过常规 debounce，
+      // 确保跨视图的状态一致性。
       let needsImmediateFlush = false
       for (const [id, entry] of next) {
         const prevEntry = prev.get(id)
@@ -369,7 +382,7 @@ function SubAgentPanel(props: {
         persistEntries(props.sessionId, next)
       }
 
-      // 同步到全局缓存，确保跨 session 查找时数据可用
+      // 同步到模块级缓存，供其他视图读取当前 session 的最新状态
       globalEntryCache.set(props.sessionId, new Map(next))
 
       return next
@@ -386,6 +399,8 @@ function SubAgentPanel(props: {
   const [hoveredOpen, setHoveredOpen] = createSignal<string | undefined>(undefined)
   const [hoveredDismiss, setHoveredDismiss] = createSignal<string | undefined>(undefined)
   const [hoveredTop, setHoveredTop] = createSignal(false)
+  const [hoveredMoreAbove, setHoveredMoreAbove] = createSignal(false)
+  const [hoveredMoreBelow, setHoveredMoreBelow] = createSignal(false)
   const [scrollOffset, setScrollOffset] = createSignal(
     (() => { try { return loadSessionData()[props.sessionId]?.scroll ?? 0 } catch { return 0 } })()
   )
@@ -723,14 +738,13 @@ function SubAgentPanel(props: {
       return changed ? next : prev
     })
 
-    // 跨 session 完成事件：用户正在查看子 session 内部时，其他子代理 done。
-    // 上面的 setEntryMap 在子 session 的 entries 中找不到父 session 的 entry。
-    // 通过全局缓存（切换前保留的父 session entries）查找并更新，再同步回 KV。
+    // 当子代理所属的父 session 与当前视图不同时，通过模块级缓存定位
+    // 并更新父 session 的 entry 状态，随后写回 KV。
     try {
       const sessionObj = props.api.state.session.get(sid)
       const parentSid = sessionObj?.parentID
       if (parentSid && parentSid !== props.sessionId) {
-        // 优先全局缓存——切换 session 时不会被替换，始终保留父 session 的最新 entries
+        // 优先从模块级缓存获取父 session 的 entries，不受当前视图切换影响
         const parentCache = globalEntryCache.get(parentSid)
         const nowTs = Date.now()
         let found = false
@@ -739,7 +753,7 @@ function SubAgentPanel(props: {
           found = tryMatchAndUpdate(parentCache, sid, status, nowTs)
         }
 
-        // 缓存未命中时回退到 KV（极端情况：session 切换前缓存未建立）
+        // 缓存未命中时回退到 KV 读取
         if (!found) {
           const data = loadSessionData()
           const rec = data[parentSid]
@@ -747,7 +761,7 @@ function SubAgentPanel(props: {
             const fallbackMap = new Map(rec.entries.map((e: SubEntry) => [e.id, e]))
             found = tryMatchAndUpdate(fallbackMap, sid, status, nowTs)
             if (found) {
-              // 回退命中了也要写回 KV，并回填缓存
+              // 回退命中后写入 KV 并回填缓存
               data[parentSid] = { ...rec, ts: nowTs, entries: [...fallbackMap.values()] }
               saveSessionData(data)
               globalEntryCache.set(parentSid, fallbackMap)
@@ -755,7 +769,7 @@ function SubAgentPanel(props: {
           }
         }
 
-        // KV 同步：以全局缓存（最新的内存状态）为准写回 KV
+        // 将模块级缓存中的最新状态同步到 KV
         if (found && parentCache) {
           const data = loadSessionData()
           data[parentSid] = { ...data[parentSid], ts: nowTs, entries: [...parentCache.values()] }
@@ -878,7 +892,7 @@ function SubAgentPanel(props: {
         // scan uses setEntryMapRaw — ephemeral data, not persisted to kv.
         // Only event-driven changes (handlePartUpdated, handleSessionEnd) persist.
         setEntryMapRaw((prev) => {
-          // 优先全局缓存——handleSessionEnd 修复2 已同步更新，无 KV 读写延迟
+          // 优先从模块级缓存加载，KV 仅作缓存未命中时的回退
           const next = switched
             ? new Map(globalEntryCache.get(sid) ?? loadEntries(sid))
             : new Map(prev)
@@ -1022,7 +1036,11 @@ function SubAgentPanel(props: {
   // ── derived signals ──
   // Stable list — only changes when entryMap changes
   const entryList = createMemo(() => {
-    return [...entryMap().values()].sort((a, b) => b.startedAt - a.startedAt)
+    const entries = [...entryMap().values()]
+    if (props.sortOrder() === "desc") {
+      return entries.sort((a, b) => b.startedAt - a.startedAt)
+    }
+    return entries.sort((a, b) => a.startedAt - b.startedAt)
   })
 
   const max = props.maxEntries
@@ -1036,6 +1054,48 @@ function SubAgentPanel(props: {
   const hiddenAbove = createMemo(() => clampedOffset())
   const hiddenBelow = createMemo(() => Math.max(0, entryList().length - clampedOffset() - max()))
 
+  // Drop hover state when ↑ more disappears (hiddenAbove hits zero)
+  createEffect(() => {
+    if (hiddenAbove() === 0) setHoveredMoreAbove(false)
+  })
+
+  // Reset scroll on sort order change: jump to newest in view
+  let sortInitialized = false
+  createEffect(() => {
+    props.sortOrder()
+    if (!sortInitialized) { sortInitialized = true; return }
+    const total = untrack(() => entryList().length)
+    const m = untrack(() => max())
+    const target = props.sortOrder() === "desc" ? 0 : Math.max(0, total - m)
+    setScrollOffset(target)
+    setTimeout(() => {
+      try { persistScroll(props.sessionId, target) } catch {}
+    }, 0)
+  })
+
+  // When new entries arrive while viewing the newest end, keep the view at newest
+  let prevEntryCount = 0
+  createEffect(() => {
+    const total = entryList().length
+    if (prevEntryCount === 0) { prevEntryCount = total; return }
+    if (total === prevEntryCount) return
+
+    const m = max()
+    const wasAtNewest = props.sortOrder() === "desc"
+      ? untrack(() => scrollOffset() === 0)
+      : untrack(() => scrollOffset() >= prevEntryCount - m)
+
+    prevEntryCount = total
+
+    if (wasAtNewest) {
+      const target = props.sortOrder() === "desc" ? 0 : Math.max(0, total - m)
+      setScrollOffset(target)
+      setTimeout(() => {
+        try { persistScroll(props.sessionId, target) } catch {}
+      }, 0)
+    }
+  })
+
   const entries = createMemo(() => {
     const nowVal = now()
     return entryList().map((e) => ({
@@ -1195,6 +1255,7 @@ function SubAgentPanel(props: {
         >
           <box
             onMouseScroll={(e) => {
+              if (props.scrollMode() === "click") return
               const total = entryList().length
               const m = max()
               if (total <= m) return
@@ -1207,8 +1268,28 @@ function SubAgentPanel(props: {
             }}
           >
             <Show when={hiddenAbove() > 0}>
-              <text style={{ fg: pal().muted }}>
-                {"  "}&uarr; {hiddenAbove()} {t("scroll.more")}
+              <text
+                onMouseOver={() => setHoveredMoreAbove(true)}
+                onMouseOut={() => setHoveredMoreAbove(false)}
+                onMouseUp={() => {
+                  const total = entryList().length
+                  const m = max()
+                  if (total <= m) return
+                  const next = Math.max(0, scrollOffset() - m)
+                  if (next === 0) {
+                    setTimeout(() => {
+                      setScrollOffset(next)
+                      try { persistScroll(props.sessionId, next) } catch {}
+                    }, 0)
+                  } else {
+                    setScrollOffset(next)
+                    try { persistScroll(props.sessionId, next) } catch {}
+                  }
+                }}
+              >
+                <span style={{ fg: hoveredMoreAbove() ? pal().warning : pal().muted }}>
+                  {"  "}&uarr; {hiddenAbove()} {t("scroll.more")}
+                </span>
               </text>
             </Show>
             <For each={visibleList()}>
@@ -1396,23 +1477,52 @@ function SubAgentPanel(props: {
               )
             }}
             </For>
-            <Show when={hiddenBelow() > 0 || scrollOffset() > 0}>
+            <Show when={hiddenBelow() > 0 || (props.sortOrder() === "desc" ? scrollOffset() > 0 : entryList().length > max() && clampedOffset() < entryList().length - max())}>
               {(() => {
                 const showMore = hiddenBelow() > 0
-                const showTop = scrollOffset() > 0
+                const showTop = props.sortOrder() === "desc"
+                  ? scrollOffset() > 0
+                  : entryList().length > max() && clampedOffset() < entryList().length - max()
                 const left = showMore ? `  \u2193 ${hiddenBelow()} ${t("scroll.more")}` : "  "
-                const right = `\u2191 ${t("scroll.top")}`
+                const right = props.sortOrder() === "desc"
+                  ? `\u2191 ${t("scroll.top")}`
+                  : `\u2193 ${t("scroll.bottom")}`
                 const pad = showTop ? Math.max(1, panelWidth() - visualWidth(left) - visualWidth(right)) : 0
                 return (
                   <box flexDirection="row">
-                    <text style={{ fg: pal().muted }}>{left}</text>
+                    <text
+                      onMouseOver={() => showMore && setHoveredMoreBelow(true)}
+                      onMouseOut={() => setHoveredMoreBelow(false)}
+                      onMouseUp={() => {
+                        if (!showMore) return
+                        const total = entryList().length
+                        const m = max()
+                        if (total <= m) return
+                        setScrollOffset((prev) => Math.min(total - m, prev + m))
+                        try { persistScroll(props.sessionId, scrollOffset()) } catch {}
+                        setHoveredMoreBelow(false)
+                      }}
+                    >
+                      <span style={{ fg: showMore && hoveredMoreBelow() ? pal().warning : pal().muted }}>
+                        {left}
+                      </span>
+                    </text>
                     {showTop ? (
                       <>
                         <text style={{ fg: pal().muted }}>{" ".repeat(pad)}</text>
                         <text
                           onMouseOver={() => setHoveredTop(true)}
                           onMouseOut={() => setHoveredTop(false)}
-                          onMouseUp={() => { setScrollOffset(0); setHoveredTop(false) }}
+                          onMouseUp={() => {
+                            const total = entryList().length
+                            const m = max()
+                            if (props.sortOrder() === "desc") {
+                              setScrollOffset(0)
+                            } else {
+                              setScrollOffset(Math.max(0, total - m))
+                            }
+                            setHoveredTop(false)
+                          }}
                         >
                           <span style={{ fg: hoveredTop() ? pal().warning : pal().muted }}>{right}</span>
                         </text>
@@ -1438,6 +1548,10 @@ interface SharedSignals {
   setLang: (l: Lang) => void
   maxEntries: () => number
   setMaxEntries: (n: number) => void
+  sortOrder: () => SortOrder
+  setSortOrder: (o: SortOrder) => void
+  scrollMode: () => ScrollMode
+  setScrollMode: (m: ScrollMode) => void
   sessionId: string
 }
 
@@ -1453,6 +1567,8 @@ function createSidebarSlot(api: TuiPluginApi, sig: SharedSignals): TuiSlotPlugin
             api={api}
             lang={sig.lang}
             maxEntries={sig.maxEntries}
+            sortOrder={sig.sortOrder}
+            scrollMode={sig.scrollMode}
             sessionId={input.session_id}
           />
         )
@@ -1472,8 +1588,14 @@ const tui: TuiPlugin = async (api: TuiPluginApi) => {
   const [maxEntries, setMaxEntries] = createSignal(
     parseInt(String(api.kv.get(`${KV_PREFIX}.max_entries`, "10")), 10) || 10
   )
+  const [sortOrder, setSortOrder] = createSignal<SortOrder>(
+    String(api.kv.get(`${KV_PREFIX}.order`, "desc")) === "asc" ? "asc" : "desc"
+  )
+  const [scrollMode, setScrollMode] = createSignal<ScrollMode>(
+    String(api.kv.get(`${KV_PREFIX}.scroll_mode`, "wheel")) === "click" ? "click" : "wheel"
+  )
 
-  const signals: SharedSignals = { lang, setLang, maxEntries, setMaxEntries, sessionId: "" }
+  const signals: SharedSignals = { lang, setLang, maxEntries, setMaxEntries, sortOrder, setSortOrder, scrollMode, setScrollMode, sessionId: "" }
 
   api.slots.register(createSidebarSlot(api, signals))
 
@@ -1505,6 +1627,60 @@ const tui: TuiPlugin = async (api: TuiPluginApi) => {
         ))
       },
     },
+    {
+      title: "SubAgent Magazine: Sort Order",
+      value: "subagent-order",
+      description: "Set sub-agent entry sort order (desc / asc)",
+      slash: { name: "subagent-order" },
+      onSelect: (dialog) => {
+        const t = (k: string) => I18N[lang()][k] ?? k
+        dialog?.replace(() => (
+          <api.ui.DialogSelect
+            title="Sort Order / 排序方式"
+            options={[
+              { title: t("order.desc"), value: "desc" },
+              { title: t("order.asc"), value: "asc" },
+            ]}
+            onSelect={(opt) => {
+              const o = opt.value as SortOrder
+              setSortOrder(o)
+              api.kv.set(`${KV_PREFIX}.order`, o)
+              api.ui.toast({
+                message: o === "desc" ? t("order.desc") : t("order.asc"),
+              })
+              dialog?.clear()
+            }}
+          />
+        ))
+      },
+    },
+    {
+      title: "SubAgent Magazine: Scroll Mode",
+      value: "subagent-scroll",
+      description: "Set scroll mode (wheel / click)",
+      slash: { name: "subagent-scroll" },
+      onSelect: (dialog) => {
+        const t = (k: string) => I18N[lang()][k] ?? k
+        dialog?.replace(() => (
+          <api.ui.DialogSelect
+            title="Scroll Mode / 滚动模式"
+            options={[
+              { title: t("scroll.wheel"), value: "wheel" },
+              { title: t("scroll.click"), value: "click" },
+            ]}
+            onSelect={(opt) => {
+              const m = opt.value as ScrollMode
+              setScrollMode(m)
+              api.kv.set(`${KV_PREFIX}.scroll_mode`, m)
+              api.ui.toast({
+                message: m === "wheel" ? t("scroll.wheel") : t("scroll.click"),
+              })
+              dialog?.clear()
+            }}
+          />
+        ))
+      },
+    },
     {
       title: "SubAgent Magazine: Max Entries",
       value: "subagent-max",