Improved drawing sync: MIME detection, WebP/JPEG support, sync log + frontend updates

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/main.jsx

@@ -2,13 +2,10 @@ import React from 'react'
 import ReactDOM from 'react-dom/client'
 import NoteApp from './NoteApp.jsx'
 
-// Hide splash screen after app renders
+// Hide splash screen
 const hideSplash = () => {
   const splash = document.getElementById('splash');
-  if (splash) {
-    splash.classList.add('hide');
-    setTimeout(() => splash.remove(), 300);
-  }
+  if (splash) { splash.classList.add('hide'); setTimeout(() => splash.remove(), 300); }
 };
 
 ReactDOM.createRoot(document.getElementById('root')).render(
@@ -17,29 +14,18 @@ ReactDOM.createRoot(document.getElementById('root')).render(
   </React.StrictMode>
 );
 
-// Hide splash after a short delay (let React mount)
 setTimeout(hideSplash, 200);
 
-// ── Register Service Worker ──
+// Register service worker
 if ('serviceWorker' in navigator) {
   window.addEventListener('load', async () => {
     try {
-      const reg = await navigator.serviceWorker.register('./sw.js', { scope: '/' });
-      console.log('[SW] Registered:', reg.scope);
-
-      // Check for updates periodically
-      setInterval(() => reg.update(), 60 * 60 * 1000); // hourly
-
-      // Prompt refresh on new version
-      reg.addEventListener('updatefound', () => {
-        const newWorker = reg.installing;
-        newWorker?.addEventListener('statechange', () => {
-          if (newWorker.state === 'activated' && navigator.serviceWorker.controller) {
-            // New version available — could show a toast here
-            console.log('[SW] New version available');
-          }
-        });
-      });
+      // Use the page's base URL as scope so it works behind any reverse proxy path
+      const swUrl = new URL('./sw.js', window.location.href).href;
+      const scope = new URL('./', window.location.href).href;
+      const reg = await navigator.serviceWorker.register(swUrl, { scope });
+      console.log('[SW] Registered, scope:', reg.scope);
+      setInterval(() => reg.update(), 60 * 60 * 1000);
     } catch (err) {
       console.warn('[SW] Registration failed:', err);
     }