From e2f39ccc32c3a404a7261ea6820bf428cee909b9 Mon Sep 17 00:00:00 2001
From: iCrawl <buechler.noel@outlook.com>
Date: Sat, 1 Apr 2023 15:50:47 +0200
Subject: [PATCH] fix(website): migration from old website

---
 apps/website/src/app/providers.tsx                 | 10 +++++++++-
 apps/website/src/components/ServiceWorker.tsx      |  9 +++++++++
 .../website/src/components/SystemThemeFallback.tsx |  9 +++++++++
 apps/website/src/hooks/useSystemThemeFallback.ts   | 13 +++++++++++++
 .../src/hooks/useUnregisterServiceWorker.ts        | 14 ++++++++++++++
 5 files changed, 54 insertions(+), 1 deletion(-)
 create mode 100644 apps/website/src/components/ServiceWorker.tsx
 create mode 100644 apps/website/src/components/SystemThemeFallback.tsx
 create mode 100644 apps/website/src/hooks/useSystemThemeFallback.ts
 create mode 100644 apps/website/src/hooks/useUnregisterServiceWorker.ts

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 <ThemeProvider attribute="class">{children}</ThemeProvider>;
+	return (
+		<>
+			<ThemeProvider attribute="class">{children}</ThemeProvider>
+			<ServiceWorker />
+			<SystemThemeFallback />
+		</>
+	);
 }
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();
+			}
+		});
+	}, []);
+}