@hienlh/ppm 0.9.57 → 0.9.58

package/src/server/routes/chat.ts

@@ -75,17 +75,44 @@ chatRoutes.get("/sessions", async (c) => {
   try {
     const projectPath = c.get("projectPath");
     const providerId = c.req.query("providerId");
-    const sessions = await chatService.listSessions(providerId, projectPath);
-    // Enrich with pin status
+    const limit = Math.min(parseInt(c.req.query("limit") ?? "50", 10) || 50, 200);
+    const offset = parseInt(c.req.query("offset") ?? "0", 10) || 0;
+
+    const sessions = await chatService.listSessions(providerId, projectPath, { limit, offset });
     const pinnedIds = getPinnedSessionIds();
-    const enriched = sessions.map((s) => ({ ...s, pinned: pinnedIds.has(s.id) }));
-    // Sort: pinned first (by pinned_at implicit via Set order), then unpinned by createdAt
+
+    // On first page, fetch pinned sessions that may be outside the current page
+    let pinnedSessions: typeof sessions = [];
+    if (offset === 0 && pinnedIds.size > 0) {
+      const pageIds = new Set(sessions.map((s) => s.id));
+      const missingPinnedIds = [...pinnedIds].filter((id) => !pageIds.has(id));
+      if (missingPinnedIds.length > 0) {
+        // Fetch individual pinned sessions by ID via SDK
+        const claudeProvider = providerRegistry.get("claude") as any;
+        if (claudeProvider?.getSessionInfoById) {
+          const results = await Promise.all(
+            missingPinnedIds.map((id) => claudeProvider.getSessionInfoById(id, projectPath)),
+          );
+          pinnedSessions = results.filter((s: any): s is NonNullable<typeof s> => s != null);
+        }
+      }
+    }
+
+    // Merge and enrich with pin status
+    const merged = [...pinnedSessions, ...sessions];
+    const seen = new Set<string>();
+    const deduped = merged.filter((s) => { if (seen.has(s.id)) return false; seen.add(s.id); return true; });
+    const enriched = deduped.map((s) => ({ ...s, pinned: pinnedIds.has(s.id) }));
+
+    // Sort: pinned first, then by createdAt desc
     enriched.sort((a, b) => {
       if (a.pinned && !b.pinned) return -1;
       if (!a.pinned && b.pinned) return 1;
       return new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime();
     });
-    return c.json(ok(enriched));
+
+    const hasMore = sessions.length >= limit;
+    return c.json(ok({ sessions: enriched, hasMore }));
   } catch (e) {
     return c.json(err((e as Error).message), 500);
   }

package/src/services/account.service.ts

@@ -77,6 +77,8 @@ const acctHotState = ((globalThis as any)[ACCT_HOT_KEY] ??= {
 
 class AccountService {
   private pendingStates = new Map<string, { verifier: string; createdAt: number }>();
+  /** Per-account mutex: dedup concurrent refresh calls so only one OAuth request fires at a time. */
+  private pendingRefreshes = new Map<string, Promise<void>>();
 
   private toAccount(row: AccountRow): Account {
     let profileData: OAuthProfileData | null = null;
@@ -517,16 +519,42 @@ class AccountService {
 
   /**
    * Refresh an OAuth access token using the stored refresh token.
+   * Uses a per-account mutex to prevent concurrent refresh calls from racing
+   * (Anthropic rotates refresh tokens — only one call per token is valid).
+   * Also skips the OAuth call if the DB token was already refreshed by another session.
    * @param disableOnFail - if true, disable the account when refresh fails (default: true).
    *   Background/startup refresh should pass false to avoid disabling accounts prematurely.
    */
   async refreshAccessToken(accountId: string, disableOnFail = true): Promise<void> {
+    // Dedup: if a refresh is already in progress for this account, wait for it instead of racing
+    const pending = this.pendingRefreshes.get(accountId);
+    if (pending) {
+      console.log(`[accounts] Refresh already in progress for ${accountId} — waiting for it`);
+      return pending;
+    }
+
+    const promise = this._doRefreshAccessToken(accountId, disableOnFail);
+    this.pendingRefreshes.set(accountId, promise);
+    try {
+      await promise;
+    } finally {
+      this.pendingRefreshes.delete(accountId);
+    }
+  }
+
+  private async _doRefreshAccessToken(accountId: string, disableOnFail: boolean): Promise<void> {
     const account = this.getWithTokens(accountId);
     if (!account) throw new Error(`Account ${accountId} not found`);
     // Skip refresh for temporary accounts (no refresh token)
     if (!account.refreshToken || account.refreshToken === "") {
       throw new Error(`Account ${accountId} has no refresh token (temporary account)`);
     }
+    // Skip if token was already refreshed by another session (still fresh)
+    const nowS = Math.floor(Date.now() / 1000);
+    if (account.expiresAt && account.expiresAt - nowS > 60) {
+      console.log(`[accounts] Token for ${account.email ?? accountId} is already fresh (expires in ${account.expiresAt - nowS}s) — skipping OAuth refresh`);
+      return;
+    }
     const res = await fetch(OAUTH_TOKEN_URL, {
       method: "POST",
       headers: { "Content-Type": "application/json" },
@@ -542,6 +570,12 @@ class AccountService {
       console.error(`[accounts] Refresh failed for ${accountId}: ${res.status} ${errorBody}`);
       // invalid_grant or invalid_request = refresh token permanently dead → clear it so account becomes temporary
       if (errorBody.includes("invalid_grant") || errorBody.includes("invalid_request")) {
+        // Double-check: another session might have already refreshed between our read and the OAuth call
+        const recheckAccount = this.getWithTokens(accountId);
+        if (recheckAccount?.expiresAt && recheckAccount.expiresAt - Math.floor(Date.now() / 1000) > 60) {
+          console.log(`[accounts] Refresh failed with invalid_grant but DB token is now fresh — another session refreshed it`);
+          return;
+        }
         console.log(`[accounts] Clearing invalid refresh token for ${account.email ?? accountId} — account is now temporary`);
         updateAccount(accountId, { refresh_token: encrypt("") });
       }

package/src/services/chat.service.ts

@@ -29,12 +29,12 @@ class ChatService {
     return provider.resumeSession(sessionId);
   }
 
-  async listSessions(providerId?: string, dir?: string): Promise<SessionInfo[]> {
+  async listSessions(providerId?: string, dir?: string, opts?: { limit?: number; offset?: number }): Promise<SessionInfo[]> {
     if (providerId) {
       const provider = providerRegistry.get(providerId);
       if (!provider) throw new Error(`Provider "${providerId}" not found`);
       if (dir && provider.listSessionsByDir) {
-        return provider.listSessionsByDir(dir);
+        return provider.listSessionsByDir(dir, opts);
       }
       return provider.listSessions();
     }
@@ -44,7 +44,7 @@ class ChatService {
       const provider = providerRegistry.get(info.id);
       if (provider) {
         if (dir && provider.listSessionsByDir) {
-          all.push(...await provider.listSessionsByDir(dir));
+          all.push(...await provider.listSessionsByDir(dir, opts));
         } else {
           all.push(...await provider.listSessions());
         }

package/src/types/chat.ts

@@ -26,7 +26,7 @@ export interface AIProvider {
   onToolApproval?: (callback: ToolApprovalHandler) => void;
   abortQuery?(sessionId: string): void;
   getMessages?(sessionId: string): Promise<ChatMessage[]>;
-  listSessionsByDir?(dir: string): Promise<SessionInfo[]>;
+  listSessionsByDir?(dir: string, opts?: { limit?: number; offset?: number }): Promise<SessionInfo[]>;
   ensureProjectPath?(sessionId: string, path: string): void;
   setForkSource?(sessionId: string, sourceSessionId: string): void;
   forkAtMessage?(sessionId: string, messageId: string, opts?: { title?: string; dir?: string }): Promise<{ sessionId: string }>;
@@ -66,6 +66,11 @@ export interface SessionInfo {
   pinned?: boolean;
 }
 
+export interface SessionListResponse {
+  sessions: SessionInfo[];
+  hasMore: boolean;
+}
+
 export interface LimitBucket {
   utilization: number;
   resetsAt: string;

package/src/web/components/chat/chat-history-bar.tsx

@@ -8,7 +8,7 @@ import { AISettingsSection } from "@/components/settings/ai-settings-section";
 import { UsageDetailPanel } from "./usage-badge";
 import { TeamActivityPanel } from "./team-activity-panel";
 import { ProviderBadge } from "./provider-selector";
-import type { SessionInfo } from "../../../types/chat";
+import type { SessionInfo, SessionListResponse } from "../../../types/chat";
 import type { UsageInfo } from "../../../types/chat";
 import type { TeamMessageItem } from "@/hooks/use-chat";
 
@@ -107,8 +107,11 @@ export function ChatHistoryBar({
   const [searchQuery, setSearchQuery] = useState("");
   const [editingId, setEditingId] = useState<string | null>(null);
   const [editingTitle, setEditingTitle] = useState("");
+  const [hasMore, setHasMore] = useState(false);
+  const [loadingMore, setLoadingMore] = useState(false);
   const editInputRef = useRef<HTMLInputElement>(null);
   const openTab = useTabStore((s) => s.openTab);
+  const PAGE_SIZE = 50;
 
   const togglePanel = (panel: PanelType) => {
     setActivePanel((prev) => prev === panel ? null : panel);
@@ -118,8 +121,9 @@ export function ChatHistoryBar({
     if (!projectName) return;
     setLoading(true);
     try {
-      const data = await api.get<SessionInfo[]>(`${projectUrl(projectName)}/chat/sessions`);
-      setSessions(data);
+      const data = await api.get<SessionListResponse>(`${projectUrl(projectName)}/chat/sessions?limit=${PAGE_SIZE}&offset=0`);
+      setSessions(data.sessions);
+      setHasMore(data.hasMore);
     } catch {
       // silent
     } finally {
@@ -127,6 +131,26 @@ export function ChatHistoryBar({
     }
   }, [projectName]);
 
+  const loadMore = useCallback(async () => {
+    if (!projectName || loadingMore || !hasMore) return;
+    setLoadingMore(true);
+    try {
+      // Offset by count of non-pinned sessions (pinned are injected separately by backend)
+      const unpinnedCount = sessions.filter((s) => !s.pinned).length;
+      const data = await api.get<SessionListResponse>(`${projectUrl(projectName)}/chat/sessions?limit=${PAGE_SIZE}&offset=${unpinnedCount}`);
+      setSessions((prev) => {
+        const existingIds = new Set(prev.map((s) => s.id));
+        const newSessions = data.sessions.filter((s) => !existingIds.has(s.id));
+        return [...prev, ...newSessions];
+      });
+      setHasMore(data.hasMore);
+    } catch {
+      // silent
+    } finally {
+      setLoadingMore(false);
+    }
+  }, [projectName, loadingMore, hasMore, sessions]);
+
   // Load sessions when history panel opens
   useEffect(() => {
     if (activePanel === "history" && sessions.length === 0) load();
@@ -367,78 +391,90 @@ export function ChatHistoryBar({
                 {searchQuery ? "No matching sessions" : "No sessions yet"}
               </div>
             ) : (
-              filteredSessions.map((session) => (
-                <div
-                  key={session.id}
-                  className="flex items-center gap-2 w-full px-3 py-1.5 text-left hover:bg-surface-elevated transition-colors group"
-                >
-                  <ProviderBadge providerId={session.providerId} />
-                  {editingId === session.id ? (
-                    <form
-                      className="flex items-center gap-1 flex-1 min-w-0"
-                      onSubmit={(e) => { e.preventDefault(); saveTitle(); }}
-                    >
-                      <input
-                        ref={editInputRef}
-                        value={editingTitle}
-                        onChange={(e) => setEditingTitle(e.target.value)}
-                        onBlur={saveTitle}
-                        onKeyDown={(e) => { if (e.key === "Escape") cancelEditing(); }}
-                        className="flex-1 min-w-0 bg-surface-elevated text-[11px] text-text-primary px-1 py-0.5 rounded border border-border outline-none focus:border-primary"
-                        autoFocus
-                      />
-                      <button type="submit" className="p-0.5 text-green-500 hover:text-green-400" onClick={(e) => e.stopPropagation()}>
-                        <Check className="size-3" />
-                      </button>
-                      <button type="button" className="p-0.5 text-text-subtle hover:text-text-secondary" onClick={(e) => { e.stopPropagation(); cancelEditing(); }}>
-                        <X className="size-3" />
-                      </button>
-                    </form>
-                  ) : (
-                    <>
-                      <button
-                        onClick={() => openSession(session)}
-                        className="text-[11px] truncate flex-1 text-left flex items-center gap-1"
-                      >
-                        {session.title?.startsWith("[PPM]") && (
-                          <Bot className="size-3 text-muted-foreground shrink-0" />
-                        )}
-                        {session.title?.startsWith("[PPM]")
-                          ? session.title.slice(7)
-                          : session.title || "Untitled"}
-                      </button>
-                      <button
-                        onClick={(e) => togglePin(e, session)}
-                        className={`p-0.5 rounded transition-all ${
-                          session.pinned
-                            ? "text-primary hover:text-primary/70"
-                            : "text-text-subtle hover:text-text-secondary can-hover:opacity-0 can-hover:group-hover:opacity-100"
-                        }`}
-                        title={session.pinned ? "Unpin session" : "Pin session"}
-                      >
-                        {session.pinned ? <PinOff className="size-3" /> : <Pin className="size-3" />}
-                      </button>
-                      <button
-                        onClick={(e) => startEditing(session, e)}
-                        className="p-0.5 rounded text-text-subtle hover:text-text-secondary can-hover:opacity-0 can-hover:group-hover:opacity-100 transition-opacity"
-                        title="Rename session"
-                      >
-                        <Pencil className="size-3" />
-                      </button>
-                      <button
-                        onClick={(e) => deleteSession(e, session)}
-                        className="p-0.5 rounded text-text-subtle hover:text-red-400 hover:bg-red-500/20 can-hover:opacity-0 can-hover:group-hover:opacity-100 transition-opacity"
-                        title="Delete session"
+              <>
+                {filteredSessions.map((session) => (
+                  <div
+                    key={session.id}
+                    className="flex items-center gap-2 w-full px-3 py-1.5 text-left hover:bg-surface-elevated transition-colors group"
+                  >
+                    <ProviderBadge providerId={session.providerId} />
+                    {editingId === session.id ? (
+                      <form
+                        className="flex items-center gap-1 flex-1 min-w-0"
+                        onSubmit={(e) => { e.preventDefault(); saveTitle(); }}
                       >
-                        <Trash2 className="size-3" />
-                      </button>
-                    </>
-                  )}
-                  {editingId !== session.id && session.updatedAt && (
-                    <span className="text-[10px] text-text-subtle shrink-0 w-10 text-right">{formatDate(session.updatedAt)}</span>
-                  )}
-                </div>
-              ))
+                        <input
+                          ref={editInputRef}
+                          value={editingTitle}
+                          onChange={(e) => setEditingTitle(e.target.value)}
+                          onBlur={saveTitle}
+                          onKeyDown={(e) => { if (e.key === "Escape") cancelEditing(); }}
+                          className="flex-1 min-w-0 bg-surface-elevated text-[11px] text-text-primary px-1 py-0.5 rounded border border-border outline-none focus:border-primary"
+                          autoFocus
+                        />
+                        <button type="submit" className="p-0.5 text-green-500 hover:text-green-400" onClick={(e) => e.stopPropagation()}>
+                          <Check className="size-3" />
+                        </button>
+                        <button type="button" className="p-0.5 text-text-subtle hover:text-text-secondary" onClick={(e) => { e.stopPropagation(); cancelEditing(); }}>
+                          <X className="size-3" />
+                        </button>
+                      </form>
+                    ) : (
+                      <>
+                        <button
+                          onClick={() => openSession(session)}
+                          className="text-[11px] truncate flex-1 text-left flex items-center gap-1"
+                        >
+                          {session.title?.startsWith("[PPM]") && (
+                            <Bot className="size-3 text-muted-foreground shrink-0" />
+                          )}
+                          {session.title?.startsWith("[PPM]")
+                            ? session.title.slice(7)
+                            : session.title || "Untitled"}
+                        </button>
+                        <button
+                          onClick={(e) => togglePin(e, session)}
+                          className={`p-0.5 rounded transition-all ${
+                            session.pinned
+                              ? "text-primary hover:text-primary/70"
+                              : "text-text-subtle hover:text-text-secondary can-hover:opacity-0 can-hover:group-hover:opacity-100"
+                          }`}
+                          title={session.pinned ? "Unpin session" : "Pin session"}
+                        >
+                          {session.pinned ? <PinOff className="size-3" /> : <Pin className="size-3" />}
+                        </button>
+                        <button
+                          onClick={(e) => startEditing(session, e)}
+                          className="p-0.5 rounded text-text-subtle hover:text-text-secondary can-hover:opacity-0 can-hover:group-hover:opacity-100 transition-opacity"
+                          title="Rename session"
+                        >
+                          <Pencil className="size-3" />
+                        </button>
+                        <button
+                          onClick={(e) => deleteSession(e, session)}
+                          className="p-0.5 rounded text-text-subtle hover:text-red-400 hover:bg-red-500/20 can-hover:opacity-0 can-hover:group-hover:opacity-100 transition-opacity"
+                          title="Delete session"
+                        >
+                          <Trash2 className="size-3" />
+                        </button>
+                      </>
+                    )}
+                    {editingId !== session.id && session.updatedAt && (
+                      <span className="text-[10px] text-text-subtle shrink-0 w-10 text-right">{formatDate(session.updatedAt)}</span>
+                    )}
+                  </div>
+                ))}
+                {hasMore && !searchQuery && (
+                  <button
+                    onClick={loadMore}
+                    disabled={loadingMore}
+                    className="flex items-center justify-center gap-1 w-full py-1.5 text-[11px] text-text-subtle hover:text-text-secondary hover:bg-surface-elevated transition-colors"
+                  >
+                    {loadingMore ? <Loader2 className="size-3 animate-spin" /> : null}
+                    {loadingMore ? "Loading..." : "Load more"}
+                  </button>
+                )}
+              </>
             )}
           </div>
         </div>

package/src/web/components/chat/chat-history-panel.tsx

@@ -27,8 +27,8 @@ export function ChatHistoryPanel({ projectName }: ChatHistoryPanelProps) {
     setLoading(true);
     setError(null);
     try {
-      const data = await api.get<SessionInfo[]>(`${projectUrl(projectName)}/chat/sessions`);
-      setSessions(data);
+      const data = await api.get<{ sessions: SessionInfo[]; hasMore: boolean }>(`${projectUrl(projectName)}/chat/sessions`);
+      setSessions(data.sessions);
     } catch (e) {
       setError(e instanceof Error ? e.message : "Failed to load sessions");
     } finally {

package/src/web/components/chat/chat-welcome.tsx

@@ -38,8 +38,8 @@ export function ChatWelcome({ projectName, onSelectSession }: ChatWelcomeProps)
     if (!projectName) return;
     setLoading(true);
     try {
-      const data = await api.get<SessionInfo[]>(`${projectUrl(projectName)}/chat/sessions`);
-      setSessions(data.slice(0, FETCH_SESSIONS_LIMIT));
+      const data = await api.get<{ sessions: SessionInfo[]; hasMore: boolean }>(`${projectUrl(projectName)}/chat/sessions?limit=${FETCH_SESSIONS_LIMIT}`);
+      setSessions(data.sessions.slice(0, FETCH_SESSIONS_LIMIT));
     } catch {
       // silently ignore
     } finally {

package/src/web/components/chat/session-picker.tsx

@@ -25,8 +25,8 @@ export function SessionPicker({
     if (!projectName) return;
     setLoading(true);
     try {
-      const data = await api.get<SessionInfo[]>(`${projectUrl(projectName)}/chat/sessions`);
-      setSessions(data);
+      const data = await api.get<{ sessions: SessionInfo[]; hasMore: boolean }>(`${projectUrl(projectName)}/chat/sessions`);
+      setSessions(data.sessions);
     } catch {
       // Silently fail — sessions list is non-critical
     } finally {

package/src/web/components/layout/editor-panel.tsx

@@ -108,8 +108,8 @@ function EmptyPanel({ panelId }: { panelId: string }) {
     if (!activeProject?.name) return;
     setLoadingSessions(true);
     try {
-      const data = await api.get<SessionInfo[]>(`${projectUrl(activeProject.name)}/chat/sessions`);
-      setSessions(data.slice(0, FETCH_SESSIONS_LIMIT));
+      const data = await api.get<{ sessions: SessionInfo[]; hasMore: boolean }>(`${projectUrl(activeProject.name)}/chat/sessions?limit=${FETCH_SESSIONS_LIMIT}`);
+      setSessions(data.sessions.slice(0, FETCH_SESSIONS_LIMIT));
     } catch {
       // silently ignore — empty state still functional without sessions
     } finally {

package/dist/web/assets/keybindings-store-wbHg-S_v.js

@@ -1 +0,0 @@
-import"./react-nm2Ru1Pt.js";import"./api-client-BKIT_Qeg.js";import{W as e}from"./index-CDlrGSwd.js";export{e as useKeybindingsStore};