feat: Move service worker registration to a dedicated component for improved client-side handling

app/components/RootLayoutClient.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import React from "react";
+import React, { useEffect } from "react";
 import { AudioPlayerProvider } from "../components/AudioPlayerContext";
 import { OfflineNavidromeProvider, useOfflineNavidrome } from "../components/OfflineNavidromeProvider";
 import { NavidromeConfigProvider } from "../components/NavidromeConfigContext";
@@ -15,18 +15,22 @@ import { LoginForm } from "./start-screen";
 import Image from "next/image";
 import PageTransition from "./PageTransition";
 
-// Service Worker registration - moved to useEffect to ensure it only runs client-side
-React.useEffect(() => {
-  if ('serviceWorker' in navigator) {
-    navigator.serviceWorker.register('/sw.js')
-      .then((registration) => {
-        console.log('Service Worker registered successfully:', registration);
-      })
-      .catch((error) => {
-        console.error('Service Worker registration failed:', error);
-      });
-  }
-}, []);
+// ServiceWorkerRegistration component to handle registration
+function ServiceWorkerRegistration() {
+  useEffect(() => {
+    if ('serviceWorker' in navigator) {
+      navigator.serviceWorker.register('/sw.js')
+        .then((registration) => {
+          console.log('Service Worker registered successfully:', registration);
+        })
+        .catch((error) => {
+          console.error('Service Worker registration failed:', error);
+        });
+    }
+  }, []);
+  
+  return null;
+}
 
 function NavidromeErrorBoundary({ children }: { children: React.ReactNode }) {
   // For now, since we're switching to offline-first, we'll handle errors differently
@@ -100,6 +104,7 @@ export default function RootLayoutClient({ children }: { children: React.ReactNo
       <ThemeProvider>
         <DynamicViewportTheme />
         <ThemeColorHandler />
+        <ServiceWorkerRegistration />
         <NavidromeConfigProvider>
           <OfflineNavidromeProvider>
             <NavidromeErrorBoundary>