ft: cache sw with console

Author: FedoseevSM

public/sw.js

@@ -33,8 +33,8 @@ self.addEventListener('activate', (event) => {
 self.addEventListener('fetch', (event) => {
   const url = new URL(event.request.url);
 
-  // Only intercept GitHub API requests
-  if (url.origin === GITHUB_API_BASE) {
+  // Only intercept GitHub API GET requests to GitHub API
+  if (url.origin === GITHUB_API_BASE && event.request.method === 'GET') {
     event.respondWith(handleGitHubRequest(event.request));
   }
 });
@@ -50,6 +50,19 @@ async function handleGitHubRequest(request) {
       return fetch(request);
     }
 
+    const cache = await caches.open(CACHE_NAME);
+    const cacheKey = new Request(request.url, {
+      method: request.method,
+      headers: new Headers({
+        Accept: 'application/vnd.github+json'
+      })
+    });
+
+    const cachedResponse = await cache.match(cacheKey);
+    if (cachedResponse) {
+      return cachedResponse.clone();
+    }
+
     // Create new request with authorization header
     const authHeaders = new Headers(request.headers);
     authHeaders.set('Authorization', `Bearer ${token}`);
@@ -61,8 +74,11 @@ async function handleGitHubRequest(request) {
 
     // Make the request
     const response = await fetch(authRequest);
+    if (response.ok) {
+      const responseClone = response.clone();
+      await cache.put(cacheKey, responseClone);
+    }
 
-    // Return response (headers are sanitized by browser automatically)
     return response;
 
   } catch (error) {
@@ -144,5 +160,14 @@ self.addEventListener('message', (event) => {
       const store = transaction.objectStore(TOKEN_STORE);
       store.delete('github-token');
     });
+  } else if (event.data && event.data.type === 'CLEAR_CACHE') {
+    caches.delete(CACHE_NAME).then(() => {
+      console.log('Service Worker cache cleared:', CACHE_NAME);
+      self.clients.matchAll().then(clients => {
+        clients.forEach(client => {
+          client.postMessage({ type: 'CACHE_CLEARED' });
+        });
+      });
+    });
   }
 });

src/lib/github.ts

@@ -1,4 +1,5 @@
 import { config } from '../config/app';
+import { swManager } from './serviceWorker';
 import { handleApiError } from './apiErrorHandler';
 
 const { owner, repo, branch } = config.github;
@@ -129,6 +130,7 @@ sha?: string)
     }
     const data = await res.json();
     fileCache.set(path, { content, sha: data.content?.sha });
+    await swManager.clearCache();
     return data;
   } catch (error: any) {
     handleApiError(error, 'putFile');
@@ -165,6 +167,7 @@ export async function deleteFile(path: string, message: string, sha: string) {
       throw await createGitHubError(res);
     }
     fileCache.delete(path);
+    await swManager.clearCache();
   } catch (error: any) {
     handleApiError(error, 'deleteFile');
   }

src/lib/serviceWorker.ts

@@ -1,9 +1,16 @@
 // Service Worker Manager
 // Handles registration and secure token storage in IndexedDB
 
+declare global {
+  interface Window {
+    clearGitHubApiCache?: () => Promise<void>;
+  }
+}
+
 class ServiceWorkerManager {
   private registration: ServiceWorkerRegistration | null = null;
   private pendingToken: string | null = null;
+  private pendingCacheClear = false;
 
   async register(): Promise<void> {
     if (!('serviceWorker' in navigator)) {
@@ -30,9 +37,19 @@ class ServiceWorkerManager {
         this.pendingToken = null;
       }
 
+      // Send any queued cache clear request once the worker is active
+      if (this.pendingCacheClear && this.registration?.active) {
+        this.sendCacheClear();
+        this.pendingCacheClear = false;
+      }
+
       // Set up message handling
       navigator.serviceWorker.addEventListener('message', this.handleMessage.bind(this));
 
+      window.clearGitHubApiCache = async () => {
+        await this.clearCache();
+      };
+
     } catch (error) {
       console.error('Service Worker registration failed:', error);
     }
@@ -80,6 +97,34 @@ class ServiceWorkerManager {
     }
   }
 
+  async clearCache(): Promise<void> {
+    if (!this.registration?.active) {
+      this.pendingCacheClear = true;
+      return;
+    }
+
+    try {
+      this.sendCacheClear();
+    } catch (error) {
+      console.error('Failed to clear service worker cache:', error);
+    }
+  }
+
+  private sendCacheClear(): void {
+    if (!this.registration?.active) {
+      console.warn('Service worker not active, cannot clear cache');
+      return;
+    }
+
+    try {
+      this.registration.active.postMessage({
+        type: 'CLEAR_CACHE'
+      });
+    } catch (error) {
+      console.error('Failed to send cache clear command to service worker:', error);
+    }
+  }
+
   private handleMessage(event: MessageEvent): void {
     // Handle messages from service worker if needed
     if (event.data?.type === 'TOKEN_STORED') {