a279bb6aa9
Some checks failed
Build and Push Docker Images / docker (push) Failing after 44s
Implements comprehensive service worker solution with: - Dynamic versioning using git commit hash or timestamp - Automatic cache invalidation on new deployments - Hourly update checks and user notifications - Network-first caching strategy with 24-hour expiration - Build automation via prebuild script - Update notification UI component This prevents stale cached code from causing white screens by ensuring users always get the latest version after deployment. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
51 lines
1.6 KiB
TypeScript
51 lines
1.6 KiB
TypeScript
'use client';
|
|
|
|
import { usePathname } from 'next/navigation';
|
|
import { useState, useEffect } from 'react';
|
|
import { Header } from './Header';
|
|
import { Footer } from './Footer';
|
|
import { UpdateNotification } from './UpdateNotification';
|
|
import * as swRegistration from '../lib/serviceWorkerRegistration';
|
|
|
|
export function RootLayoutClient({ children }: { children: React.ReactNode }) {
|
|
const pathname = usePathname();
|
|
const isAdminRoute = pathname?.startsWith('/admin');
|
|
const isCheckoutSuccess = pathname?.startsWith('/checkout/success');
|
|
const [updateAvailable, setUpdateAvailable] = useState<ServiceWorkerRegistration | null>(null);
|
|
|
|
useEffect(() => {
|
|
// Register service worker with update detection
|
|
swRegistration.register({
|
|
onUpdate: (registration) => {
|
|
console.log('New version available!');
|
|
setUpdateAvailable(registration);
|
|
},
|
|
onSuccess: (registration) => {
|
|
console.log('Service worker registered successfully');
|
|
}
|
|
});
|
|
}, []);
|
|
|
|
if (isAdminRoute || isCheckoutSuccess) {
|
|
// Admin routes and checkout success render without header/footer
|
|
return (
|
|
<>
|
|
{children}
|
|
<UpdateNotification registration={updateAvailable} />
|
|
</>
|
|
);
|
|
}
|
|
|
|
// Regular routes render with header/footer
|
|
return (
|
|
<>
|
|
<Header />
|
|
<main className="flex-1 max-w-[1600px] w-full mx-auto pb-8 sm:pb-12 px-4 sm:px-6 lg:px-8 overflow-hidden" style={{ paddingTop: '110px' }}>
|
|
{children}
|
|
</main>
|
|
<Footer />
|
|
<UpdateNotification registration={updateAvailable} />
|
|
</>
|
|
);
|
|
}
|