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,8 +15,9 @@ 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(() => {
+// ServiceWorkerRegistration component to handle registration
+function ServiceWorkerRegistration() {
+  useEffect(() => {
     if ('serviceWorker' in navigator) {
       navigator.serviceWorker.register('/sw.js')
         .then((registration) => {
@@ -28,6 +29,9 @@ React.useEffect(() => {
     }
   }, []);
   
+  return null;
+}
+
 function NavidromeErrorBoundary({ children }: { children: React.ReactNode }) {
   // For now, since we're switching to offline-first, we'll handle errors differently
   // The offline provider will handle connectivity issues automatically
@@ -100,6 +104,7 @@ export default function RootLayoutClient({ children }: { children: React.ReactNo
       <ThemeProvider>
         <DynamicViewportTheme />
         <ThemeColorHandler />
+        <ServiceWorkerRegistration />
         <NavidromeConfigProvider>
           <OfflineNavidromeProvider>
             <NavidromeErrorBoundary>