diff --git a/apps/website/src/app/providers.tsx b/apps/website/src/app/providers.tsx index a3ecb881c..245040a52 100644 --- a/apps/website/src/app/providers.tsx +++ b/apps/website/src/app/providers.tsx @@ -2,7 +2,15 @@ import { ThemeProvider } from 'next-themes'; import type { PropsWithChildren } from 'react'; +import { ServiceWorker } from '~/components/ServiceWorker'; +import { SystemThemeFallback } from '~/components/SystemThemeFallback'; export function Providers({ children }: PropsWithChildren) { - return {children}; + return ( + <> + {children} + + + + ); } diff --git a/apps/website/src/components/ServiceWorker.tsx b/apps/website/src/components/ServiceWorker.tsx new file mode 100644 index 000000000..84d63d48d --- /dev/null +++ b/apps/website/src/components/ServiceWorker.tsx @@ -0,0 +1,9 @@ +'use client'; + +import { useUnregisterServiceWorker } from '~/hooks/useUnregisterServiceWorker'; + +export function ServiceWorker() { + useUnregisterServiceWorker(); + + return null; +} diff --git a/apps/website/src/components/SystemThemeFallback.tsx b/apps/website/src/components/SystemThemeFallback.tsx new file mode 100644 index 000000000..a8f52606e --- /dev/null +++ b/apps/website/src/components/SystemThemeFallback.tsx @@ -0,0 +1,9 @@ +'use client'; + +import { useSystemThemeFallback } from '~/hooks/useSystemThemeFallback'; + +export function SystemThemeFallback() { + useSystemThemeFallback(); + + return null; +} diff --git a/apps/website/src/hooks/useSystemThemeFallback.ts b/apps/website/src/hooks/useSystemThemeFallback.ts new file mode 100644 index 000000000..5e7102938 --- /dev/null +++ b/apps/website/src/hooks/useSystemThemeFallback.ts @@ -0,0 +1,13 @@ +'use client'; + +import { useEffect } from 'react'; + +export function useSystemThemeFallback() { + useEffect(() => { + const theme = localStorage.getItem('theme'); + if (theme === 'auto') { + localStorage.setItem('theme', 'system'); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); +} diff --git a/apps/website/src/hooks/useUnregisterServiceWorker.ts b/apps/website/src/hooks/useUnregisterServiceWorker.ts new file mode 100644 index 000000000..4fbdac7aa --- /dev/null +++ b/apps/website/src/hooks/useUnregisterServiceWorker.ts @@ -0,0 +1,14 @@ +'use client'; + +import { useEffect } from 'react'; + +export function useUnregisterServiceWorker() { + useEffect(() => { + // eslint-disable-next-line promise/prefer-await-to-then + void navigator.serviceWorker.getRegistrations().then((registrations) => { + for (const registration of registrations) { + void registration.unregister(); + } + }); + }, []); +}