@hienlh/ppm 0.19.8 → 0.19.11

package/src/providers/codex-app-server/codex-provider.ts

@@ -660,6 +660,10 @@ export class CodexAppServerProvider implements AIProvider {
    * skill, which should show up without a restart, but a picker keystroke must
    * not spawn an app-server.
    */
+  invalidateSkillsCache(): void {
+    this.skillsCache.clear();
+  }
+
   async listSkills(sessionId?: string): Promise<CodexSkill[]> {
     const cwd = (sessionId ? getSessionProjectPath(sessionId) : null) || process.cwd();
     // Reuse the account already bound to the session; resolving afresh here

package/src/server/index.ts

@@ -13,7 +13,7 @@ import { tunnelRoutes } from "./routes/tunnel.ts";
 import { tunnelService } from "../services/tunnel.service.ts";
 import { staticRoutes } from "./routes/static.ts";
 import { projectScopedRouter } from "./routes/project-scoped.ts";
-import { chatUnreadRoutes } from "./routes/chat-unread.ts";
+import { chatGlobalRoutes } from "./routes/chat-global.ts";
 import { postgresRoutes } from "./routes/postgres.ts";
 import { databaseRoutes } from "./routes/database.ts";
 import { fsBrowseRoutes } from "./routes/fs-browse.ts";
@@ -193,7 +193,7 @@ app.route("/api/tunnel", tunnelRoutes);
 import { namedTunnelRoutes } from "./routes/named-tunnel.ts";
 app.route("/api/tunnel/named", namedTunnelRoutes);
 app.route("/api/projects", projectRoutes);
-app.route("/api/chat", chatUnreadRoutes);
+app.route("/api/chat", chatGlobalRoutes);
 app.route("/api/project/:projectName", projectScopedRouter);
 app.route("/api/postgres", postgresRoutes);
 app.route("/api/db", databaseRoutes);

package/src/server/routes/chat-global.ts

@@ -0,0 +1,53 @@
+import { Hono } from "hono";
+import { clearSessionUnreadMany } from "../../services/db.service.ts";
+import { ok, err } from "../../types/api.ts";
+
+/**
+ * Chat routes that are deliberately *not* project-scoped.
+ *
+ * Their state is keyed by session, not by project, so a project segment adds nothing and
+ * actively gets in the way: mounted under `/api/project/:projectName/chat` the project
+ * middleware 404s first, which makes the entries most in need of attention the ones that
+ * cannot be reached — a session whose project was renamed or deleted, or one PPM never
+ * recorded a project for.
+ */
+export const chatGlobalRoutes = new Hono();
+
+/**
+ * GET /chat/sessions/running — every session with a turn in flight, across all projects.
+ *
+ * The project-scoped twin under `/api/project/:projectName/chat` can only ever reconcile the
+ * project the user is looking at, which leaves a stale entry from any other project with
+ * nothing that can clear it. Consumers that ask "is anything running at all" — the screen
+ * wake lock — need the whole picture, so they get it from here.
+ */
+chatGlobalRoutes.get("/sessions/running", async (c) => {
+  try {
+    const { listRunningSessions } = await import("../ws/chat.ts");
+    return c.json(ok(listRunningSessions()));
+  } catch (e) {
+    return c.json(err((e as Error).message), 500);
+  }
+});
+
+/** POST /chat/sessions/read — mark many sessions as read, in one request */
+chatGlobalRoutes.post("/sessions/read", async (c) => {
+  try {
+    const body = await c.req.json<{ sessionIds?: unknown }>();
+    const ids = Array.isArray(body.sessionIds)
+      ? body.sessionIds.filter((v): v is string => typeof v === "string" && v.length > 0)
+      : null;
+    if (!ids) return c.json(err("sessionIds must be an array of session ids"), 400);
+
+    clearSessionUnreadMany(ids);
+    // One broadcast per session, but one request and one DB transaction: "Clear all" used
+    // to be N requests fanned out to every connected device.
+    const { broadcastGlobalEvent } = await import("../ws/chat.ts");
+    for (const id of ids) {
+      broadcastGlobalEvent({ type: "session:unread_changed", sessionId: id, unreadCount: 0, unreadType: null, projectName: "" });
+    }
+    return c.json(ok({ cleared: ids.length }));
+  } catch (e) {
+    return c.json(err((e as Error).message), 500);
+  }
+});

package/src/server/routes/chat.ts

@@ -94,6 +94,9 @@ chatRoutes.delete("/slash-items/cache", (c) => {
   try {
     invalidateCache(c.get("projectPath"));
     invalidateSdkCommands(c.get("projectPath"));
+    for (const { id } of providerRegistry.listAll()) {
+      providerRegistry.get(id)?.invalidateSkillsCache?.();
+    }
     return c.json(ok({ invalidated: true }));
   } catch (e) {
     return c.json(err((e as Error).message), 500);

package/src/server/ws/chat.ts

@@ -259,12 +259,14 @@ export function hasActiveClient(): boolean {
  * background turn would otherwise show no spinner in the tab strip and no
  * indicator in the document title. Reads the in-memory registry only — no DB.
  */
-export function listRunningSessions(projectName?: string): { sessionId: string; phase: SessionPhase }[] {
-  const running: { sessionId: string; phase: SessionPhase }[] = [];
+export function listRunningSessions(
+  projectName?: string,
+): { sessionId: string; phase: SessionPhase; projectName: string }[] {
+  const running: { sessionId: string; phase: SessionPhase; projectName: string }[] = [];
   for (const [sessionId, entry] of activeSessions) {
     if (entry.phase === "idle") continue;
     if (projectName && entry.projectName !== projectName) continue;
-    running.push({ sessionId, phase: entry.phase });
+    running.push({ sessionId, phase: entry.phase, projectName: entry.projectName ?? "" });
   }
   return running;
 }
@@ -854,6 +856,16 @@ async function startSessionConsumer(sessionId: string, providerId: string, conte
               try { (client as any).data.sessionId = newId; } catch { /* ignore */ }
             }
           }
+          // Announce the rename app-wide too. Every later phase change goes out under the
+          // new id, so a client that only hears the global bus — which is every client whose
+          // chat tab is not mounted — would keep the old id marked running for good: its
+          // `idle` is never coming, because nothing is keyed to it any more.
+          broadcastGlobalEvent({
+            type: "session:migrated",
+            oldSessionId: sessionId,
+            newSessionId: newId,
+            projectName: oldEntry?.projectName ?? "",
+          });
           // The consumer must target the new id for every subsequent broadcast —
           // including this session_migrated event — since the entry moved. Without
           // this, a provider that always migrates (e.g. codex: threadId ≠ ppm id)

package/src/types/chat.ts

@@ -57,6 +57,8 @@ export interface AIProvider {
    * codex; absent for Claude, whose skills come from the shared disk discovery.
    */
   listSkills?(sessionId?: string): Promise<import("../providers/codex-app-server/codex-protocol").CodexSkill[]>;
+  /** Drop runtime skill discovery results after a user requests a refresh. */
+  invalidateSkillsCache?(): void;
   /** Provider-specific usage/quota (rate limits). Used by GET /chat/usage. */
   getUsage?(sessionId?: string): Promise<UsageInfo>;
   /** True when a live streaming subprocess exists for this session */

package/src/web/components/chat/codex-usage-panel.tsx

@@ -1,40 +1,20 @@
 import { useState, useEffect, useCallback } from "react";
 import { X, Loader2, RefreshCw } from "lucide-react";
 import { api } from "@/lib/api-client";
+import { AccountUsageBar } from "@/components/settings/accounts/account-bucket-row";
+import { formatResetTime } from "@/components/settings/accounts/account-usage-format";
 import type { UsageInfo } from "../../../types/chat";
 
 interface CodexAccount { id: string; label: string; type: string; planType?: string | null }
-interface Usage { fiveHour?: number; sevenDay?: number }
+type Usage = Pick<UsageInfo, "fiveHour" | "sevenDay" | "session" | "weekly">;
 
-function pctColor(p: number): string {
-  if (p >= 90) return "text-error";
-  if (p >= 70) return "text-warning";
-  return "text-success";
-}
-function barColor(p: number): string {
-  if (p >= 90) return "bg-error";
-  if (p >= 70) return "bg-warning";
-  return "bg-success";
-}
-
-function UsageBar({ label, frac }: { label: string; frac?: number }) {
+function UsageBar({ label, frac, bucket }: {
+  label: string;
+  frac?: number;
+  bucket?: UsageInfo["session"];
+}) {
   const pct = frac != null ? Math.round(frac * 100) : null;
-  return (
-    <div className="space-y-1">
-      <div className="flex items-center justify-between">
-        <span className="text-xs font-medium text-text-primary">{label}</span>
-        <span className={`text-xs font-medium tabular-nums ${pct != null ? pctColor(pct) : "text-text-subtle"}`}>
-          {pct != null ? `${pct}%` : "—"}
-        </span>
-      </div>
-      <div className="h-2 rounded-full bg-border overflow-hidden">
-        <div
-          className={`h-full rounded-full transition-all ${pct != null ? barColor(pct) : ""}`}
-          style={{ width: `${Math.min(pct ?? 0, 100)}%` }}
-        />
-      </div>
-    </div>
-  );
+  return <AccountUsageBar label={label} pct={pct} reset={formatResetTime(bucket)} />;
 }
 
 /** Read-only usage panel opened from the chat toolbar badge (Claude parity).
@@ -89,8 +69,8 @@ export function CodexUsagePanel({ onClose, usage }: { onClose: () => void; usage
               <span className="text-sm text-text-primary truncate flex-1 min-w-0">{usage.activeAccountLabel || "Default login"}</span>
               <span className="text-[10px] uppercase tracking-wide text-text-subtle border border-border rounded px-1">~/.codex</span>
             </div>
-            <UsageBar label="5-Hour" frac={usage.fiveHour} />
-            <UsageBar label="Weekly" frac={usage.sevenDay} />
+            <UsageBar label="5-Hour" frac={usage.fiveHour} bucket={usage.session} />
+            <UsageBar label="Weekly" frac={usage.sevenDay} bucket={usage.weekly} />
           </div>
           <p className="text-[11px] text-text-subtle">Using your default <code>~/.codex</code> login. Add managed accounts in Settings → AI Provider → Codex.</p>
         </>
@@ -105,8 +85,8 @@ export function CodexUsagePanel({ onClose, usage }: { onClose: () => void; usage
               <span className="text-[10px] uppercase tracking-wide text-text-subtle border border-border rounded px-1">{a.type}</span>
               {a.planType && <span className="text-[10px] text-text-subtle">{a.planType}</span>}
             </div>
-            <UsageBar label="5-Hour" frac={u.fiveHour} />
-            <UsageBar label="Weekly" frac={u.sevenDay} />
+            <UsageBar label="5-Hour" frac={u.fiveHour} bucket={u.session} />
+            <UsageBar label="Weekly" frac={u.sevenDay} bucket={u.weekly} />
           </div>
         );
       })}

package/src/web/components/chat/message-input.tsx

@@ -323,9 +323,7 @@ export const MessageInput = memo(function MessageInput({
     setTimeout(() => { getVisibleTextarea()?.focus(); }, 100);
   }, []); // eslint-disable-line react-hooks/exhaustive-deps
 
-  // Load slash items via the shared per-project cache. The list is identical for
-  // every chat tab, and the picker renders nothing until it resolves — fetching it
-  // per tab mount put a 23 KB round trip in front of the first `/` in every tab.
+  // Cache per project/provider/session, with a TTL for externally installed skills.
   const loadSlashItems = useCallback(() => {
     if (!projectName) {
       slashItemsRef.current = [];
@@ -708,6 +706,7 @@ export const MessageInput = memo(function MessageInput({
       if (hasSlash) {
         const slashMatch = textBefore.match(/(?:^|\s)\/(\S*)$/);
         if (slashMatch && slashItemsRef.current.length > 0) {
+          if (!slashPickerOpenRef.current) loadSlashItems();
           const filter = slashMatch[1] ?? "";
           onSlashStateChange?.(true, filter);
           slashPickerOpenRef.current = true;
@@ -731,7 +730,7 @@ export const MessageInput = memo(function MessageInput({
       if (slashPickerOpenRef.current) { onSlashStateChange?.(false, ""); slashPickerOpenRef.current = false; }
       if (filePickerOpenRef.current) { onFileStateChange?.(false, ""); filePickerOpenRef.current = false; }
     },
-    [onSlashStateChange, onFileStateChange],
+    [onSlashStateChange, onFileStateChange, loadSlashItems],
   );
 
   /** Unified onChange for both textareas — updates ref, syncs other textarea, triggers picker */

package/src/web/hooks/use-global-events.ts

@@ -59,7 +59,7 @@ export function useGlobalEvents(enabled: boolean, projectName?: string): void {
         if (projectRef.current) {
           client.send(JSON.stringify({ type: "watch", projectName: projectRef.current }));
         }
-        void syncRunningSessions(projectRef.current);
+        void syncRunningSessions();
         return;
       }
 
@@ -85,6 +85,16 @@ export function useGlobalEvents(enabled: boolean, projectName?: string): void {
         return;
       }
 
+      if (type === "session:migrated") {
+        // The server re-keyed the session, so every phase change from here on carries the new
+        // id and the old one's `idle` will never arrive. Drop it now rather than waiting for
+        // the next reconnect to reconcile it away — a socket that stays up for hours would
+        // hold the screen awake for just as long.
+        const d = data as unknown as { oldSessionId: string; newSessionId: string };
+        useStreamingStore.getState().dropSession(d.oldSessionId);
+        return;
+      }
+
       if (type.startsWith("jira:") || type.startsWith("tunnel:")) {
         window.dispatchEvent(new CustomEvent(type, { detail: data }));
       }
@@ -104,6 +114,6 @@ export function useGlobalEvents(enabled: boolean, projectName?: string): void {
   useEffect(() => {
     if (!enabled || !projectName) return;
     clientRef.current?.send(JSON.stringify({ type: "watch", projectName }));
-    void syncRunningSessions(projectName);
+    void syncRunningSessions();
   }, [enabled, projectName]);
 }

package/src/web/lib/slash-items-cache.ts

@@ -22,7 +22,8 @@ export interface SlashItemsPayload {
  * codex tab and a Claude tab in one project get different lists — and two codex
  * tabs can differ too when they are bound to different accounts.
  */
-const cache = new Map<string, Promise<SlashItemsPayload>>();
+const CACHE_TTL_MS = 60_000;
+const cache = new Map<string, { promise: Promise<SlashItemsPayload>; expiresAt: number }>();
 
 export function fetchSlashItems(
   projectName: string,
@@ -31,7 +32,7 @@ export function fetchSlashItems(
 ): Promise<SlashItemsPayload> {
   const key = `${projectName}\0${providerId ?? ""}\0${sessionId ?? ""}`;
   const cached = cache.get(key);
-  if (cached) return cached;
+  if (cached && Date.now() < cached.expiresAt) return cached.promise;
 
   const query = new URLSearchParams();
   if (providerId) query.set("providerId", providerId);
@@ -43,11 +44,11 @@ export function fetchSlashItems(
     .then((data) => ({ items: data.items ?? [], recentNames: data.recentNames ?? [] }))
     .catch((e) => {
       // Don't cache failures — the next mount should retry.
-      cache.delete(key);
+      if (cache.get(key)?.promise === p) cache.delete(key);
       throw e;
     });
 
-  cache.set(key, p);
+  cache.set(key, { promise: p, expiresAt: Date.now() + CACHE_TTL_MS });
   return p;
 }
 

package/src/web/lib/sync-running-sessions.ts

@@ -1,26 +1,28 @@
-import { api, projectUrl } from "@/lib/api-client";
+import { api } from "@/lib/api-client";
 import { useStreamingStore } from "@/stores/streaming-store";
 
 /**
- * Reconcile a project's streaming indicators (tab-strip spinner, title/favicon)
+ * Reconcile the streaming indicators (tab-strip spinner, title/favicon, screen wake lock)
  * against the server's session registry.
  *
- * Runs on every `/ws/global` (re)connect and on project switch. Two gaps it
- * closes, both of which nothing else can:
- * - a turn running in a tab that is not mounted (tabs mount lazily, so its phase
- *   never reaches this client) → indicator missing;
- * - an `idle` broadcast that landed while the global socket was down → indicator
- *   stuck on until a full page reload.
+ * Runs on every `/ws/global` (re)connect and on project switch. Three gaps it closes, none of
+ * which anything else can:
+ * - a turn running in a tab that is not mounted (tabs mount lazily, so its phase never reaches
+ *   this client) → indicator missing;
+ * - an `idle` broadcast that landed while the global socket was down → indicator stuck on;
+ * - a session the server forgot without ever going idle — a restart mid-turn, an id the
+ *   provider re-keyed → an entry with no `idle` coming at all.
+ *
+ * Deliberately not scoped to a project. The server's list covers every project, so the whole
+ * map is replaced in one shot; a per-project sync could only reach the project on screen and
+ * left everything else to rot.
  */
-export async function syncRunningSessions(projectName: string | undefined): Promise<void> {
-  if (!projectName) return;
+export async function syncRunningSessions(): Promise<void> {
   try {
-    const running = await api.get<{ sessionId: string }[]>(
-      `${projectUrl(projectName)}/chat/sessions/running`,
+    const running = await api.get<{ sessionId: string; projectName: string }[]>(
+      "/api/chat/sessions/running",
     );
-    useStreamingStore
-      .getState()
-      .replaceProjectStreaming(projectName, running.map((s) => s.sessionId));
+    useStreamingStore.getState().replaceAllStreaming(running);
   } catch {
     // Never block boot or a reconnect on an indicator.
   }

package/src/web/stores/streaming-store.ts

@@ -9,13 +9,27 @@ interface StreamingStore {
   /** Mark a session as streaming or idle */
   setStreaming: (sessionId: string, streaming: boolean, projectName?: string) => void;
   /**
-   * Reconcile one project's streaming set against the server's registry, which
-   * is authoritative. Needed because an `idle` broadcast missed while
-   * `/ws/global` was down would otherwise leave a spinner running forever —
-   * nothing else ever clears it. Scoped per project: the running list only
-   * covers one project, so entries from other projects must survive.
+   * Reconcile the whole map against the server's registry, which is authoritative.
+   *
+   * Needed because an `idle` broadcast missed while `/ws/global` was down — a tablet
+   * asleep, a network change, a server restart mid-turn on an upgrade — otherwise leaves an
+   * entry that nothing can ever clear.
+   *
+   * App-wide, not per project. A per-project reconcile could only reach the project the user
+   * happened to be looking at, so a stale entry from any other project survived every sync
+   * and stayed in the map for the life of the page. That was invisible to the favicon and the
+   * title, which filter by project, but not to the screen wake lock, which asks whether
+   * anything at all is running and so never let the screen sleep again.
    */
-  replaceProjectStreaming: (projectName: string, sessionIds: string[]) => void;
+  replaceAllStreaming: (running: { sessionId: string; projectName: string }[]) => void;
+  /**
+   * Forget a session that the server re-keyed under a new id.
+   *
+   * The rename is announced on the global bus because every later phase change uses the new
+   * id: the old one's `idle` is never coming. Codex re-keys every session (its thread id is
+   * not PPM's), and CLI providers do it as soon as they read their real id from the output.
+   */
+  dropSession: (sessionId: string) => void;
 }
 
 export const useStreamingStore = create<StreamingStore>((set) => ({
@@ -29,14 +43,13 @@ export const useStreamingStore = create<StreamingStore>((set) => ({
       else next.delete(sessionId);
       return { sessions: next };
     }),
-  replaceProjectStreaming: (projectName, sessionIds) =>
+  replaceAllStreaming: (running) =>
+    set(() => ({ sessions: new Map(running.map((s) => [s.sessionId, s.projectName])) })),
+  dropSession: (sessionId) =>
     set((state) => {
-      const running = new Set(sessionIds);
+      if (!state.sessions.has(sessionId)) return state;
       const next = new Map(state.sessions);
-      for (const [id, project] of state.sessions) {
-        if (project === projectName && !running.has(id)) next.delete(id);
-      }
-      for (const id of sessionIds) next.set(id, projectName);
+      next.delete(sessionId);
       return { sessions: next };
     }),
 }));
@@ -50,8 +63,8 @@ export const useStreamingStore = create<StreamingStore>((set) => ({
  * whenever any one of them was working: three PWA windows, one busy, three busy-looking
  * icons, and no way to tell which.
  *
- * No new state is needed for this. The map already records the project per session so
- * `replaceProjectStreaming` can reconcile one project without touching another's entries.
+ * No new state is needed for this: the map records the project per session, which the server's
+ * running list supplies on every reconcile.
  */
 export const selectProjectStreaming =
   (projectName: string | undefined) =>