@pablozaiden/webapp 0.3.7 → 0.3.9

package/docs/auth.md

@@ -40,6 +40,8 @@ PATCH: (_req, ctx) => {
 
 API keys are user-owned bearer tokens for scripts and agents. They are stored hashed in SQLite and shown only once at creation. Route `scopes` are enforced for API-key requests; `*` grants all scopes.
 
+Expired API keys do not authenticate, are omitted from user-facing lists, and are purged when key lists or expired keys are encountered.
+
 Same-origin checks are skipped for API-key and device bearer requests unless a route sets `sameOrigin: "always"`, because non-browser clients usually do not send `Origin`.
 
 ## Device auth
@@ -52,7 +54,7 @@ Device auth is included in V1:
 4. Client exchanges the approved code at `/api/auth/token`.
 5. Access tokens are JWT bearer tokens whose `sub` is the approving user id; refresh tokens rotate on every refresh.
 
-Device codes are one-use. Device sessions are self-only in Settings. Reusing a consumed device code or stale refresh token returns `invalid_grant`.
+Device codes are one-use. Device sessions are self-only in Settings, and only active refresh-token sessions are listed. Revoked or expired sessions are hidden; expired sessions are purged, while revoked session records can remain stored to detect stale refresh-token reuse. Reusing a consumed device code or stale refresh token returns `invalid_grant`.
 
 ## Same-origin policy
 

package/docs/settings.md

@@ -11,6 +11,8 @@ Settings is framework-owned so apps stay consistent. It includes:
 - Admin server kill
 - Version/about
 
+Security lists only show useful active credentials. Expired API keys are purged before listing, and revoked or expired device-auth refresh sessions are not shown. Revoked refresh sessions may remain in storage when needed for token-reuse protection, but they are hidden from Settings.
+
 Destructive actions in Settings use the framework `ConfirmDialog` before mutating. This includes deleting users, deleting API keys, deleting passkeys, revoking device-auth sessions, and killing the server.
 
 The server kill control follows the normal Settings row layout: explanation on the left, action on the right. After confirmation and a successful response, Settings shows a 15-second shutdown countdown progress bar that visibly drains before reloading the page.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pablozaiden/webapp",
-  "version": "0.3.7",
+  "version": "0.3.9",
   "description": "Opinionated Bun + React webapp framework for single-server apps",
   "license": "MIT",
   "type": "module",

package/src/contracts/index.ts

@@ -108,6 +108,7 @@ export interface AuthSessionSummary {
   expiresAt: string;
   lastUsedAt?: string;
   revokedAt?: string;
+  /** Built-in session lists only expose active sessions; retained for API compatibility. */
   active: boolean;
 }
 

package/src/server/auth/api-keys.ts

@@ -16,7 +16,10 @@ function summarize(record: { tokenHash?: string } & ApiKeySummary): ApiKeySummar
 }
 
 export function listApiKeys(store: WebAppStore, userId: string): ApiKeySummary[] {
-  return store.listApiKeys(userId).map(summarize);
+  store.deleteExpiredApiKeys?.(nowIso());
+  return store.listApiKeys(userId)
+    .filter((record) => !record.expiresAt || !isExpired(record.expiresAt))
+    .map(summarize);
 }
 
 export function createApiKey(store: WebAppStore, user: CurrentUser, input: { name?: string; scopes?: string[]; prefix?: string; expiresAt?: string }): CreatedApiKeyResponse {
@@ -44,6 +47,9 @@ export function authenticateApiKey(store: WebAppStore, token: string): { user: C
   const tokenHash = sha256(token);
   const record = store.getApiKeyByHash(tokenHash);
   if (!record || !secureEqual(record.tokenHash, tokenHash) || (record.expiresAt && isExpired(record.expiresAt))) {
+    if (record?.expiresAt && isExpired(record.expiresAt)) {
+      store.deleteApiKey(record.id);
+    }
     return undefined;
   }
   const user = store.getUserById(record.userId);

package/src/server/auth/device-auth.ts

@@ -123,6 +123,7 @@ function tokenSet(accessToken: string, refreshToken: string, scope: string): Tok
 }
 
 export function createDeviceAuthorization(req: Request, store: WebAppStore, config: RuntimeConfig, input: { clientId?: string; scope?: string } = {}): DeviceAuthorizationResponse {
+  store.deleteExpiredDeviceAuthRequests(nowIso());
   const deviceCode = randomToken(32);
   let userCode = generateUserCode();
   while (store.getDeviceAuthByUserCode(userCode)) {
@@ -151,6 +152,7 @@ export function createDeviceAuthorization(req: Request, store: WebAppStore, conf
 }
 
 export function getDeviceVerificationDetails(store: WebAppStore, userCode: string, passkeyRequired: boolean): DeviceVerificationDetails {
+  store.deleteExpiredDeviceAuthRequests(nowIso());
   const record = store.getDeviceAuthByUserCode(userCode);
   if (!record || isExpired(record.expiresAt)) {
     throw new AuthError("invalid_user_code", "Device authorization code is invalid or expired", 404);
@@ -207,6 +209,7 @@ function createRefreshRecord(userId: string, clientId: string, scope: string, fa
 }
 
 export async function exchangeDeviceCode(store: WebAppStore, config: RuntimeConfig, deviceCode: string, clientId?: string): Promise<TokenResponse> {
+  store.deleteExpiredDeviceAuthRequests(nowIso());
   const record = store.getDeviceAuthByDeviceCodeHash(sha256(deviceCode));
   if (!record) {
     throw new AuthError("invalid_grant", "Device code is invalid", 400);
@@ -301,17 +304,20 @@ export async function verifyAccessToken(store: WebAppStore, config: RuntimeConfi
 }
 
 export function listAuthSessions(store: WebAppStore, userId: string): AuthSessionSummary[] {
-  return store.listRefreshSessions(userId).map((session) => ({
-    id: session.id,
-    clientId: session.clientId,
-    scope: session.scope,
-    createdAt: session.createdAt,
-    updatedAt: session.updatedAt,
-    expiresAt: session.expiresAt,
-    lastUsedAt: session.lastUsedAt,
-    revokedAt: session.revokedAt,
-    active: !session.revokedAt && !isExpired(session.expiresAt),
-  }));
+  store.deleteExpiredRefreshSessions?.(nowIso());
+  return store.listRefreshSessions(userId)
+    .filter((session) => !session.revokedAt && !isExpired(session.expiresAt))
+    .map((session) => ({
+      id: session.id,
+      clientId: session.clientId,
+      scope: session.scope,
+      createdAt: session.createdAt,
+      updatedAt: session.updatedAt,
+      expiresAt: session.expiresAt,
+      lastUsedAt: session.lastUsedAt,
+      revokedAt: session.revokedAt,
+      active: true,
+    }));
 }
 
 export function revokeAuthSession(store: WebAppStore, userId: string, id: string): boolean {

package/src/server/auth/sqlite-store.ts

@@ -560,6 +560,9 @@ export function sqliteWebAppStore(options: { dataDir?: string; fileName?: string
     deleteApiKeysForUser: (userId) => {
       db.query("DELETE FROM webapp_api_keys WHERE user_id = ?").run(userId);
     },
+    deleteExpiredApiKeys: (now) => {
+      db.query("DELETE FROM webapp_api_keys WHERE expires_at IS NOT NULL AND expires_at <= ?").run(now);
+    },
 
     saveDeviceAuthRequest: (record) => {
       db.query(`
@@ -646,5 +649,8 @@ export function sqliteWebAppStore(options: { dataDir?: string; fileName?: string
     revokeRefreshSessionsForUser: (userId, revokedAt) => {
       db.query("UPDATE webapp_refresh_sessions SET revoked_at = ?, updated_at = ? WHERE user_id = ? AND revoked_at IS NULL").run(revokedAt, revokedAt, userId);
     },
+    deleteExpiredRefreshSessions: (now) => {
+      db.query("DELETE FROM webapp_refresh_sessions WHERE expires_at <= ?").run(now);
+    },
   };
 }

package/src/server/auth/store.ts

@@ -115,6 +115,7 @@ export interface WebAppStore {
   touchApiKey(id: string, lastUsedAt: string): void;
   deleteApiKey(id: string, userId?: string): boolean;
   deleteApiKeysForUser(userId: string): void;
+  deleteExpiredApiKeys?(nowIso: string): void;
 
   saveDeviceAuthRequest(record: DeviceAuthRequestRecord): void;
   getDeviceAuthByUserCode(userCode: string): DeviceAuthRequestRecord | undefined;
@@ -132,4 +133,5 @@ export interface WebAppStore {
   revokeRefreshSession(id: string, revokedAt: string, userId?: string): boolean;
   revokeRefreshFamily(familyId: string, revokedAt: string): void;
   revokeRefreshSessionsForUser(userId: string, revokedAt: string): void;
+  deleteExpiredRefreshSessions?(nowIso: string): void;
 }

package/src/web/WebAppRoot.tsx

@@ -967,8 +967,8 @@ function SettingsView({ config, refresh, customSections, theme, setTheme }: { co
             <div className="wapp-list">
               {authSessions.length ? authSessions.map((session) => (
                 <div className="wapp-list-row" key={session.id}>
-                  <span><strong>{session.clientId}</strong><small>{session.scope} · {session.active ? "active" : "inactive"} · {session.updatedAt}</small></span>
-                  <Button type="button" variant="danger" disabled={!session.active} onClick={() => setAuthSessionToRevoke(session)}>Revoke</Button>
+                  <span><strong>{session.clientId}</strong><small>{session.scope} · {session.updatedAt}</small></span>
+                  <Button type="button" variant="danger" onClick={() => setAuthSessionToRevoke(session)}>Revoke</Button>
                 </div>
               )) : <EmptyState title="No device sessions" />}
             </div>
@@ -1112,6 +1112,7 @@ export function WebAppRoot({ appName, homeRoute, sidebar, routes, header, onRout
       ...augmented,
     ];
   }, [augmentPinningActions, baseNodes, currentPins, filteredNodes, pinningEnabled, sidebar.pinning, sidebarSearchActive]);
+  const activeActionNodes = useMemo(() => augmentPinningActions(baseNodes), [augmentPinningActions, baseNodes]);
 
   useEffect(() => {
     if (!config?.currentUser) return;
@@ -1176,7 +1177,7 @@ export function WebAppRoot({ appName, homeRoute, sidebar, routes, header, onRout
   const topActions = sidebar.topActions?.slice(0, 2) ?? [];
   const defaultTitle = route.view === "settings" ? "Settings" : route.view === homeRoute.view ? appName : route.view.replace(/-/g, " ");
   const headerContext = { route, defaultTitle };
-  const activeSidebarNode = flattenSidebarItems(nodes).find((node) => routeMatches(node.route, route));
+  const activeSidebarNode = flattenSidebarItems(activeActionNodes).find((node) => routeMatches(node.route, route));
   const activeSidebarActions = activeSidebarNode?.actions ?? [];
   const headerActions = [
     ...(header?.getActions?.(headerContext) ?? []),