@nextclaw/ui 0.13.10-beta.0 → 0.13.10-beta.1

package/dist/sw.js

@@ -1,7 +1,6 @@
 /* global caches, self */
 
 const SHELL_CACHE = 'nextclaw-ui-shell-v2';
-const RUNTIME_CACHE = 'nextclaw-ui-runtime-v2';
 const SHELL_ASSETS = ['/offline.html', '/manifest.webmanifest', '/logo.svg', '/pwa-192.png', '/pwa-512.png'];
 
 self.addEventListener('install', (event) => {
@@ -10,24 +9,16 @@ self.addEventListener('install', (event) => {
       return cache.addAll(SHELL_ASSETS);
     })
   );
-  self.skipWaiting();
 });
 
 self.addEventListener('activate', (event) => {
   event.waitUntil(
     caches.keys().then(async (keys) => {
-      await Promise.all(keys.filter((key) => key !== SHELL_CACHE && key !== RUNTIME_CACHE).map((key) => caches.delete(key)));
-      await self.clients.claim();
+      await Promise.all(keys.filter((key) => key.startsWith('nextclaw-ui-') && key !== SHELL_CACHE).map((key) => caches.delete(key)));
     })
   );
 });
 
-self.addEventListener('message', (event) => {
-  if (event.data?.type === 'SKIP_WAIT') {
-    self.skipWaiting();
-  }
-});
-
 self.addEventListener('fetch', (event) => {
   const { request } = event;
   if (request.method !== 'GET') {
@@ -35,11 +26,6 @@ self.addEventListener('fetch', (event) => {
   }
 
   const url = new URL(request.url);
-  if (request.mode === 'navigate') {
-    event.respondWith(handleNavigation(request));
-    return;
-  }
-
   if (url.origin !== self.location.origin) {
     return;
   }
@@ -48,30 +34,19 @@ self.addEventListener('fetch', (event) => {
     return;
   }
 
-  if (['script', 'style', 'image', 'font'].includes(request.destination) || url.pathname === '/manifest.webmanifest') {
-    event.respondWith(handleStaticAsset(request));
+  if (SHELL_ASSETS.includes(url.pathname)) {
+    event.respondWith(readShellAsset(request));
   }
 });
 
-async function handleNavigation(request) {
-  try {
-    const response = await fetch(request);
-    const runtimeCache = await caches.open(RUNTIME_CACHE);
-    runtimeCache.put(request, response.clone());
-    return response;
-  } catch {
-    return caches.match('/offline.html');
-  }
-}
-
-async function handleStaticAsset(request) {
+async function readShellAsset(request) {
   const cachedResponse = await caches.match(request);
   if (cachedResponse) {
     return cachedResponse;
   }
 
   const response = await fetch(request);
-  const runtimeCache = await caches.open(RUNTIME_CACHE);
-  runtimeCache.put(request, response.clone());
+  const shellCache = await caches.open(SHELL_CACHE);
+  shellCache.put(request, response.clone());
   return response;
 }

package/index.html

@@ -43,7 +43,6 @@
   </script>
   <script>
     (() => {
-      const devResetKey = 'nextclaw-pwa-dev-sw-reset';
       const isViteDevServer = '%MODE%' === 'development';
       if (!isViteDevServer || !('serviceWorker' in navigator)) {
         return;
@@ -57,7 +56,6 @@
         });
 
         if (nextclawRegistrations.length === 0) {
-          window.sessionStorage.removeItem(devResetKey);
           return;
         }
 
@@ -66,14 +64,43 @@
           const keys = await caches.keys();
           await Promise.all(keys.filter((key) => key.startsWith('nextclaw-ui-')).map(async (key) => await caches.delete(key)));
         }
-
-        if (navigator.serviceWorker.controller && window.sessionStorage.getItem(devResetKey) !== '1') {
-          window.sessionStorage.setItem(devResetKey, '1');
-          window.location.reload();
-          return;
+      });
+    })();
+  </script>
+  <script>
+    (() => {
+      const cleanupKey = 'nextclaw-pwa-legacy-runtime-cache-cleaned-v1';
+      const hasCleaned = () => {
+        try {
+          return window.localStorage.getItem(cleanupKey) === '1';
+        } catch {
+          return false;
+        }
+      };
+      const markCleaned = () => {
+        try {
+          window.localStorage.setItem(cleanupKey, '1');
+        } catch {
+          // ignore storage failures; cache cleanup is still safe to attempt once
         }
+      };
+      if (!('serviceWorker' in navigator) || !navigator.serviceWorker.controller || hasCleaned()) {
+        return;
+      }
 
-        window.sessionStorage.removeItem(devResetKey);
+      markCleaned();
+      window.stop();
+      void Promise.all([
+        navigator.serviceWorker.getRegistrations().then((registrations) =>
+          Promise.all(registrations.map((registration) => registration.unregister()))
+        ),
+        'caches' in window
+          ? caches.keys().then((keys) =>
+              Promise.all(keys.filter((key) => key.startsWith('nextclaw-ui-')).map((key) => caches.delete(key)))
+            )
+          : Promise.resolve()
+      ]).finally(() => {
+        window.location.reload();
       });
     })();
   </script>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextclaw/ui",
-  "version": "0.13.10-beta.0",
+  "version": "0.13.10-beta.1",
   "private": false,
   "type": "module",
   "license": "MIT",
@@ -28,13 +28,13 @@
     "tailwind-merge": "^2.5.4",
     "zod": "^3.23.8",
     "zustand": "^5.0.2",
-    "@nextclaw/agent-chat": "0.2.9-beta.0",
-    "@nextclaw/agent-chat-ui": "0.4.9-beta.0",
-    "@nextclaw/client-sdk": "0.2.10-beta.0",
-    "@nextclaw/ncp-http-agent-client": "0.3.41-beta.0",
-    "@nextclaw/ncp": "0.5.29-beta.0",
-    "@nextclaw/ncp-react": "0.4.49-beta.0",
-    "@nextclaw/shared": "0.2.9-beta.0"
+    "@nextclaw/client-sdk": "0.3.0-beta.1",
+    "@nextclaw/ncp": "0.5.29-beta.1",
+    "@nextclaw/ncp-http-agent-client": "0.3.41-beta.1",
+    "@nextclaw/agent-chat": "0.2.9-beta.1",
+    "@nextclaw/ncp-react": "0.4.49-beta.1",
+    "@nextclaw/agent-chat-ui": "0.4.9-beta.1",
+    "@nextclaw/shared": "0.2.9-beta.1"
   },
   "devDependencies": {
     "@testing-library/react": "^16.3.0",

package/public/sw.js

@@ -1,7 +1,6 @@
 /* global caches, self */
 
 const SHELL_CACHE = 'nextclaw-ui-shell-v2';
-const RUNTIME_CACHE = 'nextclaw-ui-runtime-v2';
 const SHELL_ASSETS = ['/offline.html', '/manifest.webmanifest', '/logo.svg', '/pwa-192.png', '/pwa-512.png'];
 
 self.addEventListener('install', (event) => {
@@ -10,24 +9,16 @@ self.addEventListener('install', (event) => {
       return cache.addAll(SHELL_ASSETS);
     })
   );
-  self.skipWaiting();
 });
 
 self.addEventListener('activate', (event) => {
   event.waitUntil(
     caches.keys().then(async (keys) => {
-      await Promise.all(keys.filter((key) => key !== SHELL_CACHE && key !== RUNTIME_CACHE).map((key) => caches.delete(key)));
-      await self.clients.claim();
+      await Promise.all(keys.filter((key) => key.startsWith('nextclaw-ui-') && key !== SHELL_CACHE).map((key) => caches.delete(key)));
     })
   );
 });
 
-self.addEventListener('message', (event) => {
-  if (event.data?.type === 'SKIP_WAIT') {
-    self.skipWaiting();
-  }
-});
-
 self.addEventListener('fetch', (event) => {
   const { request } = event;
   if (request.method !== 'GET') {
@@ -35,11 +26,6 @@ self.addEventListener('fetch', (event) => {
   }
 
   const url = new URL(request.url);
-  if (request.mode === 'navigate') {
-    event.respondWith(handleNavigation(request));
-    return;
-  }
-
   if (url.origin !== self.location.origin) {
     return;
   }
@@ -48,30 +34,19 @@ self.addEventListener('fetch', (event) => {
     return;
   }
 
-  if (['script', 'style', 'image', 'font'].includes(request.destination) || url.pathname === '/manifest.webmanifest') {
-    event.respondWith(handleStaticAsset(request));
+  if (SHELL_ASSETS.includes(url.pathname)) {
+    event.respondWith(readShellAsset(request));
   }
 });
 
-async function handleNavigation(request) {
-  try {
-    const response = await fetch(request);
-    const runtimeCache = await caches.open(RUNTIME_CACHE);
-    runtimeCache.put(request, response.clone());
-    return response;
-  } catch {
-    return caches.match('/offline.html');
-  }
-}
-
-async function handleStaticAsset(request) {
+async function readShellAsset(request) {
   const cachedResponse = await caches.match(request);
   if (cachedResponse) {
     return cachedResponse;
   }
 
   const response = await fetch(request);
-  const runtimeCache = await caches.open(RUNTIME_CACHE);
-  runtimeCache.put(request, response.clone());
+  const shellCache = await caches.open(SHELL_CACHE);
+  shellCache.put(request, response.clone());
   return response;
 }

package/src/app/index.tsx

@@ -19,7 +19,6 @@ import {
 import { useAppEventConsumers } from "@/app/hooks/use-app-event-consumers";
 import {
   PwaInstallBanner,
-  PwaUpdateBanner,
 } from "@/pwa/components/pwa-install-entry";
 import { startNextClawPwa } from "@/pwa/register-pwa";
 
@@ -251,7 +250,6 @@ export default function AppContent() {
     <QueryClientProvider client={appQueryClient}>
       <AuthGate />
       <PwaInstallBanner />
-      <PwaUpdateBanner />
       <Toaster position="top-right" richColors offset={window.nextclawDesktop?.platform === "win32" ? 56 : undefined} mobileOffset={window.nextclawDesktop?.platform === "win32" ? 56 : undefined} />
     </QueryClientProvider>
   );

package/src/features/pwa/components/pwa-install-entry.test.tsx

@@ -1,6 +1,6 @@
 import { render, screen } from '@testing-library/react';
 import { beforeEach, describe, expect, it } from 'vitest';
-import { PwaInstallBanner, PwaInstallCard, PwaUpdateBanner } from '@/features/pwa';
+import { PwaInstallBanner, PwaInstallCard } from '@/features/pwa';
 import { usePwaStore, createInitialPwaState } from '@/features/pwa/stores/pwa.store';
 
 describe('PwaInstallCard', () => {
@@ -14,9 +14,7 @@ describe('PwaInstallCard', () => {
       installability: 'available',
       installMethod: 'prompt',
       blockedReason: null,
-      dismissedInstallPrompt: false,
-      updateAvailable: false,
-      registrationFailed: false
+      dismissedInstallPrompt: false
     });
 
     render(<PwaInstallCard />);
@@ -31,9 +29,7 @@ describe('PwaInstallCard', () => {
       installability: 'suppressed',
       installMethod: 'none',
       blockedReason: 'desktop-host',
-      dismissedInstallPrompt: false,
-      updateAvailable: false,
-      registrationFailed: false
+      dismissedInstallPrompt: false
     });
 
     render(<PwaInstallCard />);
@@ -42,48 +38,13 @@ describe('PwaInstallCard', () => {
     expect(screen.getByText(/already running inside the Electron desktop host/i)).toBeTruthy();
   });
 
-  it('does not render update banner before installation', () => {
-    usePwaStore.setState({
-      initialized: true,
-      installability: 'available',
-      installMethod: 'manual',
-      blockedReason: null,
-      dismissedInstallPrompt: false,
-      updateAvailable: true,
-      registrationFailed: false
-    });
-
-    const { container } = render(<PwaUpdateBanner />);
-
-    expect(container.textContent).toBe('');
-  });
-
-  it('renders update banner only for installed pwa', () => {
-    usePwaStore.setState({
-      initialized: true,
-      installability: 'installed',
-      installMethod: 'none',
-      blockedReason: null,
-      dismissedInstallPrompt: false,
-      updateAvailable: true,
-      registrationFailed: false
-    });
-
-    render(<PwaUpdateBanner />);
-
-    expect(screen.getByText('NextClaw Update Ready')).toBeTruthy();
-    expect(screen.getByRole('button', { name: 'Refresh Now' })).toBeTruthy();
-  });
-
   it('renders install banner when prompt install is available and not dismissed', () => {
     usePwaStore.setState({
       initialized: true,
       installability: 'available',
       installMethod: 'prompt',
       blockedReason: null,
-      dismissedInstallPrompt: false,
-      updateAvailable: false,
-      registrationFailed: false
+      dismissedInstallPrompt: false
     });
 
     render(<PwaInstallBanner />);
@@ -98,9 +59,7 @@ describe('PwaInstallCard', () => {
       installability: 'available',
       installMethod: 'prompt',
       blockedReason: null,
-      dismissedInstallPrompt: true,
-      updateAvailable: false,
-      registrationFailed: false
+      dismissedInstallPrompt: true
     });
 
     const { container } = render(<PwaInstallBanner />);

package/src/features/pwa/components/pwa-install-entry.tsx

@@ -2,10 +2,9 @@ import { Button } from '@/shared/components/ui/button';
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/shared/components/ui/card';
 import { usePwaStore } from '@/features/pwa/stores/pwa.store';
 import { pwaInstallManager } from '@/features/pwa/managers/pwa-install.manager';
-import { pwaRuntimeManager } from '@/features/pwa/managers/pwa-runtime.manager';
 import { t } from '@/shared/lib/i18n';
 import { cn } from '@/shared/lib/utils';
-import { Download, RefreshCw, Smartphone, X } from 'lucide-react';
+import { Download, Smartphone, X } from 'lucide-react';
 
 function InstallStatusBadge() {
   const installability = usePwaStore((state) => state.installability);
@@ -170,36 +169,3 @@ export function PwaInstallBanner() {
     </div>
   );
 }
-
-export function PwaUpdateBanner() {
-  const updateAvailable = usePwaStore((state) => state.updateAvailable);
-  const installability = usePwaStore((state) => state.installability);
-
-  if (!updateAvailable || installability !== 'installed') {
-    return null;
-  }
-
-  return (
-    <div className="fixed top-5 right-5 z-50 w-[min(420px,calc(100vw-2rem))] rounded-[26px] border border-gray-200 bg-white/95 p-5 shadow-2xl backdrop-blur-xl">
-      <div className="flex items-start justify-between gap-4">
-        <div className="space-y-1">
-          <p className="text-sm font-semibold text-gray-900">{t('pwaUpdateBannerTitle')}</p>
-          <p className="text-sm leading-6 text-gray-600">{t('pwaUpdateBannerDescription')}</p>
-        </div>
-      </div>
-      <div className="mt-4">
-        <Button
-          type="button"
-          size="sm"
-          className="gap-2"
-          onClick={() => {
-            void pwaRuntimeManager.applyUpdate();
-          }}
-        >
-          <RefreshCw className="h-4 w-4" />
-          {t('pwaUpdateAction')}
-        </Button>
-      </div>
-    </div>
-  );
-}

package/src/features/pwa/index.ts

@@ -1,4 +1,4 @@
-export { PwaInstallBanner, PwaInstallCard, PwaUpdateBanner } from './components/pwa-install-entry';
+export { PwaInstallBanner, PwaInstallCard } from './components/pwa-install-entry';
 export { startNextClawPwa } from './managers/pwa-bootstrap.manager';
 export { pwaInstallManager } from './managers/pwa-install.manager';
 export { pwaShellThemeManager } from './managers/pwa-shell-theme.manager';

package/src/features/pwa/managers/pwa-install.manager.ts

@@ -1,6 +1,5 @@
 import { usePwaStore, createInitialPwaState } from '@/features/pwa/stores/pwa.store';
 import type { PwaInstallBlockedReason, PwaInstallMethod, PwaInstallPromptOutcome, PwaInstallabilityState } from '@/features/pwa/types/pwa.types';
-import { pwaRuntimeManager } from '@/features/pwa/managers/pwa-runtime.manager';
 import {
   clearPwaInstallBannerDismissal,
   dismissPwaInstallBanner,
@@ -68,7 +67,6 @@ export class PwaInstallManager {
       blockedReason: resolution.blockedReason,
       dismissedInstallPrompt: isPwaInstallBannerDismissed()
     }));
-    void pwaRuntimeManager.syncUpdateAvailability();
   };
 
   dismissInstallPrompt = () => {

package/src/features/pwa/managers/pwa-runtime.manager.ts

@@ -1,11 +1,6 @@
-import { usePwaStore } from '@/features/pwa/stores/pwa.store';
-
-const PWA_DEV_RESET_SESSION_KEY = 'nextclaw-pwa-dev-sw-reset';
-
 export class PwaRuntimeManager {
   private started = false;
   private registration: ServiceWorkerRegistration | null = null;
-  private reloadWhenControllerChanges = false;
 
   start = async () => {
     if (this.started || typeof window === 'undefined') {
@@ -25,55 +20,9 @@ export class PwaRuntimeManager {
     try {
       const registration = await navigator.serviceWorker.register('/sw.js');
       this.registration = registration;
-      this.bindRegistration(registration);
-      navigator.serviceWorker.addEventListener('controllerchange', this.handleControllerChange);
-      await this.syncUpdateAvailability();
     } catch {
-      usePwaStore.setState({
-        registrationFailed: true
-      });
-    }
-  };
-
-  syncUpdateAvailability = async () => {
-    if (
-      typeof window === 'undefined' ||
-      !('serviceWorker' in navigator) ||
-      typeof navigator.serviceWorker.getRegistration !== 'function'
-    ) {
-      usePwaStore.setState({
-        updateAvailable: false
-      });
       return;
     }
-
-    const registration = this.registration ?? (await navigator.serviceWorker.getRegistration('/sw.js')) ?? null;
-    usePwaStore.setState({
-      updateAvailable: this.shouldSurfaceUpdate(registration)
-    });
-  };
-
-  applyUpdate = async () => {
-    const registration = this.registration ?? (await navigator.serviceWorker.getRegistration('/sw.js')) ?? null;
-    if (!registration) {
-      window.location.reload();
-      return;
-    }
-
-    if (!registration.waiting) {
-      await registration.update();
-    }
-
-    const waitingWorker = registration.waiting;
-    if (!waitingWorker) {
-      window.location.reload();
-      return;
-    }
-
-    this.reloadWhenControllerChanges = true;
-    waitingWorker.postMessage({
-      type: 'SKIP_WAIT'
-    });
   };
 
   stop = () => {
@@ -81,34 +30,8 @@ export class PwaRuntimeManager {
       return;
     }
 
-    navigator.serviceWorker.removeEventListener('controllerchange', this.handleControllerChange);
     this.started = false;
     this.registration = null;
-    this.reloadWhenControllerChanges = false;
-  };
-
-  private bindRegistration = (registration: ServiceWorkerRegistration) => {
-    registration.addEventListener('updatefound', () => {
-      const installingWorker = registration.installing;
-      if (!installingWorker) {
-        return;
-      }
-
-      installingWorker.addEventListener('statechange', () => {
-        if (installingWorker.state === 'installed') {
-          void this.syncUpdateAvailability();
-        }
-      });
-    });
-  };
-
-  private handleControllerChange = () => {
-    if (!this.reloadWhenControllerChanges) {
-      return;
-    }
-
-    this.reloadWhenControllerChanges = false;
-    window.location.reload();
   };
 
   private isEligibleInstallContext = (): boolean => {
@@ -123,13 +46,6 @@ export class PwaRuntimeManager {
     return import.meta.env.DEV && !import.meta.env.VITEST;
   };
 
-  private shouldSurfaceUpdate = (registration: ServiceWorkerRegistration | null): boolean => {
-    if (!registration?.waiting || !navigator.serviceWorker.controller) {
-      return false;
-    }
-    return usePwaStore.getState().installability === 'installed';
-  };
-
   private cleanupDevelopmentRegistrations = async () => {
     if (typeof navigator.serviceWorker.getRegistrations !== 'function') {
       return;
@@ -142,21 +58,10 @@ export class PwaRuntimeManager {
         .some((scriptUrl) => scriptUrl.endsWith('/sw.js'))
     );
 
-    if (nextclawRegistrations.length === 0) {
-      this.clearDevResetMarker();
-      return;
-    }
-
     await Promise.all(nextclawRegistrations.map(async (registration) => await registration.unregister()));
-    await this.clearNextClawCaches();
-
-    if (navigator.serviceWorker.controller && !this.hasDevResetMarker()) {
-      this.setDevResetMarker();
-      window.location.reload();
-      return;
+    if (nextclawRegistrations.length > 0) {
+      await this.clearNextClawCaches();
     }
-
-    this.clearDevResetMarker();
   };
 
   private clearNextClawCaches = async () => {
@@ -168,29 +73,6 @@ export class PwaRuntimeManager {
     await Promise.all(keys.filter((key) => key.startsWith('nextclaw-ui-')).map(async (key) => await caches.delete(key)));
   };
 
-  private hasDevResetMarker = (): boolean => {
-    try {
-      return window.sessionStorage.getItem(PWA_DEV_RESET_SESSION_KEY) === '1';
-    } catch {
-      return false;
-    }
-  };
-
-  private setDevResetMarker = () => {
-    try {
-      window.sessionStorage.setItem(PWA_DEV_RESET_SESSION_KEY, '1');
-    } catch {
-      // ignore sessionStorage availability failures in dev cleanup
-    }
-  };
-
-  private clearDevResetMarker = () => {
-    try {
-      window.sessionStorage.removeItem(PWA_DEV_RESET_SESSION_KEY);
-    } catch {
-      // ignore sessionStorage availability failures in dev cleanup
-    }
-  };
 }
 
 export const pwaRuntimeManager = new PwaRuntimeManager();

package/src/features/pwa/managers/pwa-service-worker-cache.manager.test.ts

@@ -6,11 +6,13 @@ describe('NextClaw service worker cache policy', () => {
   });
 
   it('does not fall back to stale navigation responses', () => {
-    const navigationHandler = serviceWorkerSource.slice(
-      serviceWorkerSource.indexOf('async function handleNavigation'),
-      serviceWorkerSource.indexOf('async function handleStaticAsset')
-    );
+    expect(serviceWorkerSource).not.toContain("request.mode === 'navigate'");
+    expect(serviceWorkerSource).not.toContain('handleNavigation');
+    expect(serviceWorkerSource).toContain('SHELL_ASSETS.includes(url.pathname)');
+  });
 
-    expect(navigationHandler).not.toContain('caches.match(request)');
+  it('does not force service worker activation or page control', () => {
+    expect(serviceWorkerSource).not.toContain('skipWaiting');
+    expect(serviceWorkerSource).not.toContain('clients.claim');
   });
 });

package/src/features/pwa/stores/pwa.store.ts

@@ -8,9 +8,7 @@ export function createInitialPwaState(): PwaInstallStateSnapshot {
     installability: 'unsupported',
     installMethod: 'none',
     blockedReason: 'missing-browser-support',
-    dismissedInstallPrompt: isPwaInstallBannerDismissed(),
-    updateAvailable: false,
-    registrationFailed: false
+    dismissedInstallPrompt: isPwaInstallBannerDismissed()
   };
 }
 

package/src/features/pwa/types/pwa.types.ts

@@ -17,6 +17,4 @@ export interface PwaInstallStateSnapshot {
   installMethod: PwaInstallMethod;
   blockedReason: PwaInstallBlockedReason;
   dismissedInstallPrompt: boolean;
-  updateAvailable: boolean;
-  registrationFailed: boolean;
 }