@hienlh/ppm 0.8.55 → 0.8.57

package/src/services/proxy.service.ts

@@ -60,6 +60,12 @@ class ProxyService {
 
     // Ensure token is fresh for OAuth accounts
     let token = account.accessToken;
+    if (!token) {
+      return new Response(
+        JSON.stringify({ type: "error", error: { type: "authentication_error", message: "Account has no access token (decryption may have failed)" } }),
+        { status: 401, headers: { "Content-Type": "application/json" } },
+      );
+    }
     if (token.startsWith("sk-ant-oat")) {
       const fresh = await accountService.ensureFreshToken(account.id);
       if (fresh) token = fresh.accessToken;
@@ -108,14 +114,22 @@ class ProxyService {
       } else if (upstream.status === 401) {
         accountSelector.onAuthError(account.id);
         console.log(`[proxy] 401 from Anthropic — account ${account.email ?? account.id} auth error`);
+      } else if (upstream.status >= 400) {
+        console.log(`[proxy] ${upstream.status} from Anthropic — account ${account.email ?? account.id} (OAuth=${token.startsWith("sk-ant-oat")})`);
       } else if (upstream.status >= 200 && upstream.status < 300) {
         accountSelector.onSuccess(account.id);
       }
 
       // Stream response back as-is (preserves SSE for streaming)
       const responseHeaders = new Headers();
-      // Forward key response headers
-      for (const key of ["content-type", "x-request-id", "request-id"]) {
+      // Forward all relevant response headers from Anthropic
+      for (const key of [
+        "content-type", "x-request-id", "request-id",
+        "anthropic-ratelimit-requests-limit", "anthropic-ratelimit-requests-remaining",
+        "anthropic-ratelimit-requests-reset", "anthropic-ratelimit-tokens-limit",
+        "anthropic-ratelimit-tokens-remaining", "anthropic-ratelimit-tokens-reset",
+        "retry-after",
+      ]) {
         const val = upstream.headers.get(key);
         if (val) responseHeaders.set(key, val);
       }
@@ -127,9 +141,10 @@ class ProxyService {
         headers: responseHeaders,
       });
     } catch (e) {
-      console.error(`[proxy] Error forwarding to Anthropic:`, (e as Error).message);
+      const msg = e instanceof Error ? e.message : String(e);
+      console.error(`[proxy] Error forwarding to Anthropic:`, msg);
       return new Response(
-        JSON.stringify({ type: "error", error: { type: "api_error", message: (e as Error).message } }),
+        JSON.stringify({ type: "error", error: { type: "api_error", message: msg || "Unknown proxy error" } }),
         { status: 502, headers: { "Content-Type": "application/json" } },
       );
     }

package/src/services/supervisor.ts

@@ -328,6 +328,16 @@ async function selfReplace(): Promise<{ success: boolean; error?: string }> {
   const currentSupervisorPid = process.pid;
 
   try {
+    // Kill server + tunnel children FIRST to free the port for the new supervisor
+    log("INFO", "Stopping server and tunnel before spawning new supervisor");
+    if (serverChild) { try { serverChild.kill(); } catch {} serverChild = null; }
+    if (tunnelChild) { try { tunnelChild.kill(); } catch {} tunnelChild = null; }
+    // Clear health timers so we don't try to respawn killed children
+    if (healthTimer) { clearInterval(healthTimer); healthTimer = null; }
+    if (tunnelProbeTimer) { clearInterval(tunnelProbeTimer); tunnelProbeTimer = null; }
+    // Brief wait for port release
+    await Bun.sleep(500);
+
     // Spawn new supervisor using saved argv
     const cmd = originalArgv.slice();
     const logFd = openSync(LOG_FILE, "a");
@@ -346,7 +356,10 @@ async function selfReplace(): Promise<{ success: boolean; error?: string }> {
         const data = JSON.parse(readFileSync(STATUS_FILE, "utf-8"));
         if (data.supervisorPid && data.supervisorPid !== currentSupervisorPid) {
           log("INFO", `New supervisor detected (PID: ${data.supervisorPid}), old exiting`);
-          shutdown();
+          // Children already killed, just clear remaining timers and exit
+          if (heartbeatTimer) clearInterval(heartbeatTimer);
+          if (upgradeCheckTimer) clearInterval(upgradeCheckTimer);
+          if (upgradeDelayTimer) clearTimeout(upgradeDelayTimer);
           process.exit(0);
         }
       } catch {}

package/src/web/components/chat/usage-badge.tsx

@@ -97,7 +97,7 @@ function BucketRow({ label, bucket }: { label: string; bucket?: LimitBucket }) {
       <div className="flex items-center justify-between">
         <span className="text-xs font-medium text-text-primary">{label}</span>
         {reset && (
-          <span className="text-[10px] text-text-subtle">↻ {reset}</span>
+          <span className="text-[10px] text-text-subtle" title="Resets in">↻ {reset}</span>
         )}
       </div>
       <div className="flex items-center gap-2">
@@ -115,6 +115,28 @@ function BucketRow({ label, bucket }: { label: string; bucket?: LimitBucket }) {
   );
 }
 
+function formatExpiry(expiresAt: number): string {
+  const diff = expiresAt - Date.now();
+  if (diff <= 0) return "expired";
+  const mins = Math.ceil(diff / 60_000);
+  const h = Math.floor(mins / 60);
+  const d = Math.floor(h / 24);
+  if (d > 0) return `${d}d ${h % 24}h`;
+  if (h > 0) return `${h}h ${mins % 60}m`;
+  return `${mins}m`;
+}
+
+/** Derive a human-readable token status from account info */
+function tokenStatus(info?: AccountInfo): { label: string; tip: string; color: string } {
+  if (!info) return { label: "unknown", tip: "No account info available", color: "text-text-subtle" };
+  if (!info.expiresAt) return { label: "key", tip: "API key (no expiry)", color: "text-text-subtle" };
+  const expired = info.expiresAt * 1000 < Date.now(); // expiresAt is seconds
+  if (expired && info.hasRefreshToken) return { label: "expired", tip: "Token expired but has refresh token — will auto-renew", color: "text-amber-500" };
+  if (expired) return { label: "expired", tip: "Token expired, no refresh token", color: "text-red-500" };
+  if (info.hasRefreshToken) return { label: "long-lived", tip: "OAuth token with refresh — long-lived", color: "text-green-500" };
+  return { label: "temp", tip: "Temporary token without refresh — will expire", color: "text-amber-500" };
+}
+
 function formatLastUpdated(ts: number | null | undefined): string | null {
   if (!ts) return null;
   const secs = Math.round((Date.now() - ts) / 1000);
@@ -193,11 +215,21 @@ function AccountUsageCard({ entry, isActive, accountInfo, onToggle, onExport, on
           {entry.isOAuth ? "No usage data yet" : "Usage tracking not available for API keys"}
         </p>
       )}
-      {usage.lastFetchedAt && (
-        <p className="text-[9px] text-text-subtle">
-          Updated: {formatLastUpdated(new Date(usage.lastFetchedAt).getTime())}
-        </p>
-      )}
+      {/* Footer: updated · expires · type */}
+      {(() => {
+        const ts = tokenStatus(accountInfo);
+        return (
+          <div className="flex items-center gap-1.5 text-[9px] text-text-subtle flex-wrap">
+            {usage.lastFetchedAt && (
+              <span title="Last usage data update">↻ {formatLastUpdated(new Date(usage.lastFetchedAt).getTime())}</span>
+            )}
+            {accountInfo?.expiresAt && accountInfo.expiresAt * 1000 > Date.now() && (
+              <span title="Token expires in">⏱ {formatExpiry(accountInfo.expiresAt * 1000)}</span>
+            )}
+            <span className={ts.color} title={ts.tip}>© {ts.label}</span>
+          </div>
+        );
+      })()}
     </div>
   );
 }

package/src/web/components/settings/proxy-settings-section.tsx

@@ -127,76 +127,78 @@ export function ProxySettingsSection() {
         <div className="space-y-2 rounded-md border p-3 bg-muted/30">
           <h4 className="text-[11px] font-medium">Connection Info</h4>
 
-          {/* Local endpoint */}
+          {/* Base URL */}
           <div className="space-y-1">
-            <Label className="text-[10px] text-muted-foreground">Local Endpoint</Label>
+            <Label className="text-[10px] text-muted-foreground">Base URL</Label>
             <div className="flex gap-1.5 items-center">
               <code className="text-[10px] font-mono bg-muted px-1.5 py-0.5 rounded flex-1 truncate">
-                {`${window.location.origin}/proxy/v1/messages`}
+                {hasTunnel && settings.tunnelUrl
+                  ? `${settings.tunnelUrl}/proxy`
+                  : `${window.location.origin}/proxy`}
               </code>
               <Button
                 variant="ghost"
                 size="sm"
                 className="h-6 px-1.5 cursor-pointer shrink-0"
-                onClick={() => copyToClipboard(`${window.location.origin}/proxy/v1/messages`, "local")}
+                onClick={() => copyToClipboard(
+                  hasTunnel && settings.tunnelUrl
+                    ? `${settings.tunnelUrl}/proxy`
+                    : `${window.location.origin}/proxy`,
+                  "baseurl",
+                )}
               >
-                {copied === "local" ? "Copied!" : <Copy className="size-3" />}
+                {copied === "baseurl" ? "Copied!" : <Copy className="size-3" />}
               </Button>
             </div>
           </div>
 
-          {/* Tunnel endpoint */}
-          {hasTunnel && settings.proxyEndpoint && (
-            <div className="space-y-1">
-              <Label className="text-[10px] text-muted-foreground">Public Endpoint (Tunnel)</Label>
-              <div className="flex gap-1.5 items-center">
-                <code className="text-[10px] font-mono bg-muted px-1.5 py-0.5 rounded flex-1 truncate">
-                  {settings.proxyEndpoint}
-                </code>
-                <Button
-                  variant="ghost"
-                  size="sm"
-                  className="h-6 px-1.5 cursor-pointer shrink-0"
-                  onClick={() => copyToClipboard(settings.proxyEndpoint!, "tunnel")}
-                >
-                  {copied === "tunnel" ? "Copied!" : <Copy className="size-3" />}
-                </Button>
-              </div>
-            </div>
-          )}
-
           {!hasTunnel && (
             <p className="text-[10px] text-muted-foreground">
               Start a Cloudflare tunnel (Share) to get a public URL.
             </p>
           )}
 
-          {/* Usage example */}
+          {/* Claude Code CLI usage */}
+          <div className="space-y-1 pt-1">
+            <Label className="text-[10px] text-muted-foreground">Claude Code CLI</Label>
+            <div className="relative">
+              <pre className="text-[9px] font-mono bg-muted p-2 rounded overflow-x-auto whitespace-pre">
+{`ANTHROPIC_BASE_URL=${hasTunnel && settings.tunnelUrl ? settings.tunnelUrl + "/proxy" : window.location.origin + "/proxy"} \\
+ANTHROPIC_API_KEY=${settings.authKey} \\
+claude`}
+              </pre>
+              <Button
+                variant="ghost"
+                size="sm"
+                className="absolute top-1 right-1 h-5 px-1 cursor-pointer"
+                onClick={() => copyToClipboard(
+                  `ANTHROPIC_BASE_URL=${hasTunnel && settings.tunnelUrl ? settings.tunnelUrl + "/proxy" : window.location.origin + "/proxy"} ANTHROPIC_API_KEY=${settings.authKey} claude`,
+                  "claude-cli",
+                )}
+              >
+                {copied === "claude-cli" ? "Copied!" : <Copy className="size-2.5" />}
+              </Button>
+            </div>
+          </div>
+
+          {/* Generic env vars */}
           <div className="space-y-1 pt-1">
-            <Label className="text-[10px] text-muted-foreground">Usage Example</Label>
+            <Label className="text-[10px] text-muted-foreground">Environment Variables</Label>
             <div className="relative">
               <pre className="text-[9px] font-mono bg-muted p-2 rounded overflow-x-auto whitespace-pre">
-{`# Set as base URL in your tool
-ANTHROPIC_BASE_URL=${hasTunnel && settings.proxyEndpoint ? settings.tunnelUrl + "/proxy" : window.location.origin + "/proxy"}
-ANTHROPIC_API_KEY=${settings.authKey}
-
-# Or use curl
-curl ${hasTunnel && settings.proxyEndpoint ? settings.proxyEndpoint : window.location.origin + "/proxy/v1/messages"} \\
-  -H "x-api-key: ${settings.authKey}" \\
-  -H "content-type: application/json" \\
-  -H "anthropic-version: 2023-06-01" \\
-  -d '{"model":"claude-sonnet-4-6","max_tokens":1024,"messages":[{"role":"user","content":"Hello"}]}'`}
+{`export ANTHROPIC_BASE_URL=${hasTunnel && settings.tunnelUrl ? settings.tunnelUrl + "/proxy" : window.location.origin + "/proxy"}
+export ANTHROPIC_API_KEY=${settings.authKey}`}
               </pre>
               <Button
                 variant="ghost"
                 size="sm"
                 className="absolute top-1 right-1 h-5 px-1 cursor-pointer"
                 onClick={() => copyToClipboard(
-                  `ANTHROPIC_BASE_URL=${hasTunnel ? settings.tunnelUrl + "/proxy" : window.location.origin + "/proxy"}\nANTHROPIC_API_KEY=${settings.authKey}`,
-                  "example",
+                  `export ANTHROPIC_BASE_URL=${hasTunnel && settings.tunnelUrl ? settings.tunnelUrl + "/proxy" : window.location.origin + "/proxy"}\nexport ANTHROPIC_API_KEY=${settings.authKey}`,
+                  "envvars",
                 )}
               >
-                {copied === "example" ? "Copied!" : <Copy className="size-2.5" />}
+                {copied === "envvars" ? "Copied!" : <Copy className="size-2.5" />}
               </Button>
             </div>
           </div>

package/dist/web/assets/keybindings-store-B-BLLKiZ.js

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