feat: implement web session handling and enhance token management

webapp/src/lib/api/auth.ts

@@ -10,8 +10,10 @@ import type {
 import { parseJson, type AuthedFetch, type SessionSetter } from './shared';
 
 const SESSION_KEY = 'nodewarden.web.session.v4';
+const PROFILE_SNAPSHOT_KEY = 'nodewarden.web.profile-snapshot.v1';
 const DEVICE_IDENTIFIER_KEY = 'nodewarden.web.device.identifier.v1';
 const TOTP_REMEMBER_TOKEN_KEY = 'nodewarden.web.totp.remember-token.v1';
+const WEB_SESSION_HEADER = 'X-NodeWarden-Web-Session';
 
 export interface PreloginResult {
   hash: string;
@@ -26,6 +28,24 @@ export interface PreloginKdfConfig {
   kdfParallelism: number | null;
 }
 
+interface PersistedSessionState {
+  email: string;
+  authMode: 'token' | 'web-cookie';
+}
+
+interface RefreshFailure {
+  ok: false;
+  transient: boolean;
+  error: string;
+}
+
+interface RefreshSuccess {
+  ok: true;
+  token: TokenSuccess;
+}
+
+type RefreshResult = RefreshFailure | RefreshSuccess;
+
 function randomHex(length: number): string {
   const bytes = crypto.getRandomValues(new Uint8Array(Math.max(1, Math.ceil(length / 2))));
   return Array.from(bytes).map((b) => b.toString(16).padStart(2, '0')).join('').slice(0, length);
@@ -66,12 +86,19 @@ export function loadSession(): SessionState | null {
   try {
     const raw = localStorage.getItem(SESSION_KEY);
     if (!raw) return null;
-    const parsed = JSON.parse(raw) as SessionState;
-    if (!parsed.accessToken || !parsed.refreshToken) return null;
+    const parsed = JSON.parse(raw) as Partial<SessionState> & Partial<PersistedSessionState>;
+    if (parsed.authMode === 'web-cookie' && parsed.email) {
+      return {
+        email: parsed.email,
+        authMode: 'web-cookie',
+      };
+    }
+    if (!parsed.accessToken || !parsed.refreshToken || !parsed.email) return null;
     return {
       accessToken: parsed.accessToken,
       refreshToken: parsed.refreshToken,
       email: parsed.email,
+      authMode: 'token',
     };
   } catch {
     return null;
@@ -83,14 +110,35 @@ export function saveSession(session: SessionState | null): void {
     localStorage.removeItem(SESSION_KEY);
     return;
   }
-  const persisted: SessionState = {
-    accessToken: session.accessToken,
-    refreshToken: session.refreshToken,
+  const persisted: PersistedSessionState = {
     email: session.email,
+    authMode: session.authMode === 'token' ? 'token' : 'web-cookie',
   };
   localStorage.setItem(SESSION_KEY, JSON.stringify(persisted));
 }
 
+export function loadProfileSnapshot(email?: string | null): Profile | null {
+  try {
+    const raw = localStorage.getItem(PROFILE_SNAPSHOT_KEY);
+    if (!raw) return null;
+    const parsed = JSON.parse(raw) as Profile;
+    if (!parsed?.email || !parsed?.key) return null;
+    if (email && parsed.email !== email) return null;
+    return parsed;
+  } catch {
+    return null;
+  }
+}
+
+export function saveProfileSnapshot(profile: Profile | null): void {
+  if (!profile) return;
+  localStorage.setItem(PROFILE_SNAPSHOT_KEY, JSON.stringify(profile));
+}
+
+export function clearProfileSnapshot(): void {
+  localStorage.removeItem(PROFILE_SNAPSHOT_KEY);
+}
+
 export function getCurrentDeviceIdentifier(): string {
   return (localStorage.getItem(DEVICE_IDENTIFIER_KEY) || '').trim();
 }
@@ -170,7 +218,10 @@ export async function loginWithPassword(
   }
   const resp = await fetch('/identity/connect/token', {
     method: 'POST',
-    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+    headers: {
+      'Content-Type': 'application/x-www-form-urlencoded',
+      [WEB_SESSION_HEADER]: '1',
+    },
     body: body.toString(),
   });
   const json = (await parseJson<TokenSuccess & TokenError>(resp)) || {};
@@ -183,18 +234,60 @@ export async function loginWithPassword(
   return json;
 }
 
-export async function refreshAccessToken(refreshToken: string): Promise<TokenSuccess | null> {
+function isTransientRefreshStatus(status: number): boolean {
+  return status === 0 || status === 429 || status >= 500;
+}
+
+export async function refreshAccessToken(session: SessionState): Promise<RefreshResult> {
   const body = new URLSearchParams();
   body.set('grant_type', 'refresh_token');
-  body.set('refresh_token', refreshToken);
-  const resp = await fetch('/identity/connect/token', {
+  if (session.authMode !== 'web-cookie' && session.refreshToken) {
+    body.set('refresh_token', session.refreshToken);
+  }
+  try {
+    const resp = await fetch('/identity/connect/token', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/x-www-form-urlencoded',
+        ...(session.authMode === 'web-cookie' ? { [WEB_SESSION_HEADER]: '1' } : {}),
+      },
+      body: body.toString(),
+    });
+    if (!resp.ok) {
+      const json = await parseJson<TokenError>(resp);
+      return {
+        ok: false,
+        transient: isTransientRefreshStatus(resp.status),
+        error: json?.error_description || json?.error || 'Session refresh failed',
+      };
+    }
+    const json = await parseJson<TokenSuccess>(resp);
+    if (!json?.access_token) {
+      return { ok: false, transient: false, error: 'Session refresh failed' };
+    }
+    return { ok: true, token: json };
+  } catch (error) {
+    return {
+      ok: false,
+      transient: true,
+      error: error instanceof Error ? error.message : 'Network error',
+    };
+  }
+}
+
+export async function revokeCurrentSession(session: SessionState | null): Promise<void> {
+  const body = new URLSearchParams();
+  if (session?.authMode !== 'web-cookie' && session?.refreshToken) {
+    body.set('token', session.refreshToken);
+  }
+  await fetch('/identity/connect/revocation', {
     method: 'POST',
-    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+    headers: {
+      'Content-Type': 'application/x-www-form-urlencoded',
+      ...(session?.authMode === 'web-cookie' ? { [WEB_SESSION_HEADER]: '1' } : {}),
+    },
     body: body.toString(),
-  });
-  if (!resp.ok) return null;
-  const json = await parseJson<TokenSuccess>(resp);
-  return json || null;
+  }).catch(() => undefined);
 }
 
 export async function registerAccount(args: {
@@ -279,18 +372,22 @@ export function createAuthedFetch(getSession: () => SessionState | null, setSess
     headers.set('Authorization', `Bearer ${session.accessToken}`);
 
     let resp = await fetch(input, { ...init, headers });
-    if (resp.status !== 401 || !session.refreshToken) return resp;
+    if (resp.status !== 401 || (!session.refreshToken && session.authMode !== 'web-cookie')) return resp;
 
-    const refreshed = await refreshAccessToken(session.refreshToken);
-    if (!refreshed?.access_token) {
+    const refreshed = await refreshAccessToken(session);
+    if (!refreshed.ok) {
+      if (refreshed.transient) {
+        throw new Error(refreshed.error || 'Session refresh temporarily unavailable');
+      }
       setSession(null);
       throw new Error('Session expired');
     }
 
     const nextSession: SessionState = {
       ...session,
-      accessToken: refreshed.access_token,
-      refreshToken: refreshed.refresh_token || session.refreshToken,
+      accessToken: refreshed.token.access_token,
+      refreshToken: refreshed.token.refresh_token || session.refreshToken,
+      authMode: refreshed.token.web_session ? 'web-cookie' : (session.authMode || 'token'),
     };
     setSession(nextSession);
     saveSession(nextSession);

webapp/src/lib/api/send.ts

@@ -152,6 +152,7 @@ export async function createSend(
   const uploadInfo = await parseJson<{ url?: string; sendResponse?: Send; fileUploadType?: number }>(fileResp);
   const uploadUrl = uploadInfo?.url;
   if (!uploadUrl) throw new Error('Create file send failed: missing upload URL');
+  if (!session.accessToken) throw new Error('Unauthorized');
   const payload = new ArrayBuffer(encryptedFileBytes.byteLength);
   new Uint8Array(payload).set(encryptedFileBytes);
   const uploadResp = await uploadDirectEncryptedPayload({

webapp/src/lib/api/vault.ts

@@ -240,6 +240,7 @@ export async function uploadCipherAttachment(
   const attachmentId = String(meta.attachmentId || '').trim();
   const uploadUrl = String(meta.url || '').trim();
   if (!attachmentId || !uploadUrl) throw new Error('Create attachment failed');
+  if (!session.accessToken) throw new Error('Unauthorized');
 
   const payload = new ArrayBuffer(encryptedBytes.byteLength);
   new Uint8Array(payload).set(encryptedBytes);

webapp/src/lib/app-auth.ts

@@ -2,6 +2,7 @@ import {
   createAuthedFetch,
   deriveLoginHashLocally,
   getProfile,
+  loadProfileSnapshot,
   loadSession,
   loginWithPassword,
   refreshAccessToken,
@@ -26,6 +27,7 @@ export interface BootstrapAppResult {
   session: SessionState | null;
   profile: Profile | null;
   phase: AppPhase;
+  needsBackgroundHydration?: boolean;
 }
 
 export interface InitialAppBootstrapState {
@@ -51,8 +53,9 @@ export interface RecoverTwoFactorResult {
   newRecoveryCode: string | null;
 }
 
-function decodeJwtExp(accessToken: string): number | null {
+function decodeJwtExp(accessToken: string | undefined): number | null {
   try {
+    if (!accessToken) return null;
     const parts = accessToken.split('.');
     if (parts.length < 2) return null;
     const payload = parts[1].replace(/-/g, '+').replace(/_/g, '/');
@@ -66,23 +69,24 @@ function decodeJwtExp(accessToken: string): number | null {
 }
 
 async function maybeRefreshSession(session: SessionState): Promise<SessionState | null> {
-  if (!session.refreshToken) return session;
+  if (!session.refreshToken && session.authMode !== 'web-cookie') return session.accessToken ? session : null;
   const exp = decodeJwtExp(session.accessToken);
   const nowSeconds = Math.floor(Date.now() / 1000);
 
-  if (exp !== null && exp - nowSeconds > 60) {
+  if (session.accessToken && exp !== null && exp - nowSeconds > 60) {
     return session;
   }
 
-  const refreshed = await refreshAccessToken(session.refreshToken);
-  if (!refreshed?.access_token) {
-    return exp !== null && exp > nowSeconds ? session : null;
+  const refreshed = await refreshAccessToken(session);
+  if (!refreshed.ok) {
+    return session.accessToken && exp !== null && exp > nowSeconds ? session : null;
   }
 
   return {
     ...session,
-    accessToken: refreshed.access_token,
-    refreshToken: refreshed.refresh_token || session.refreshToken,
+    accessToken: refreshed.token.access_token,
+    refreshToken: refreshed.token.refresh_token || session.refreshToken,
+    authMode: refreshed.token.web_session ? 'web-cookie' : (session.authMode || 'token'),
   };
 }
 
@@ -197,31 +201,51 @@ export async function bootstrapAppSession(initial: InitialAppBootstrapState = re
     };
   }
 
+  const cachedProfile = loadProfileSnapshot(loaded.email);
+  if (cachedProfile) {
+    return {
+      defaultKdfIterations,
+      jwtWarning: null,
+      session: loaded,
+      profile: cachedProfile,
+      phase: 'locked',
+      needsBackgroundHydration: true,
+    };
+  }
+
+  return {
+    defaultKdfIterations,
+    jwtWarning: null,
+    session: loaded,
+    profile: null,
+    phase: 'locked',
+    needsBackgroundHydration: true,
+  };
+}
+
+export async function hydrateLockedSession(
+  session: SessionState,
+  fallbackProfile: Profile | null = null
+): Promise<{ session: SessionState | null; profile: Profile | null }> {
+  const refreshedSession = await maybeRefreshSession(session);
+  if (!refreshedSession?.accessToken) {
+    return { session: null, profile: null };
+  }
   try {
-    const session = await maybeRefreshSession(loaded);
-    if (!session) {
-      throw new Error('Session expired');
-    }
     const profile = await getProfile(
       createAuthedFetch(
-        () => session,
+        () => refreshedSession,
         () => {}
       )
     );
     return {
-      defaultKdfIterations,
-      jwtWarning: null,
-      session,
+      session: refreshedSession,
       profile,
-      phase: 'locked',
     };
   } catch {
     return {
-      defaultKdfIterations,
-      jwtWarning: null,
-      session: null,
-      profile: null,
-      phase: initial.phase === 'register' ? 'register' : 'login',
+      session: refreshedSession,
+      profile: fallbackProfile,
     };
   }
 }
@@ -236,6 +260,7 @@ export async function completeLogin(
     accessToken: token.access_token,
     refreshToken: token.refresh_token,
     email: normalizedEmail,
+    authMode: token.web_session ? 'web-cookie' : 'token',
   };
   const tempFetch = createAuthedFetch(
     () => baseSession,

webapp/src/lib/types.ts

@@ -1,9 +1,10 @@
 export type AppPhase = 'register' | 'login' | 'locked' | 'app';
 
 export interface SessionState {
-  accessToken: string;
-  refreshToken: string;
+  accessToken?: string;
+  refreshToken?: string;
   email: string;
+  authMode?: 'token' | 'web-cookie';
   symEncKey?: string;
   symMacKey?: string;
 }
@@ -265,7 +266,8 @@ export interface WebBootstrapResponse {
 
 export interface TokenSuccess {
   access_token: string;
-  refresh_token: string;
+  refresh_token?: string;
+  web_session?: boolean;
   expires_in?: number;
   token_type?: string;
   TwoFactorToken?: string;