From ee569ada7f36c9aeddd638166c7ca61074207f13 Mon Sep 17 00:00:00 2001
From: Nilay Majorwar <nilaymajorwar@gmail.com>
Date: Sat, 22 Jan 2022 22:48:33 +0530
Subject: [PATCH] Use system theme for initial dark mode setting

---
 ui/providers/dark-mode-provider.tsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/ui/providers/dark-mode-provider.tsx b/ui/providers/dark-mode-provider.tsx
index a9c1429..830fc51 100644
--- a/ui/providers/dark-mode-provider.tsx
+++ b/ui/providers/dark-mode-provider.tsx
@@ -14,6 +14,12 @@ export const DarkModeProvider = ({
 }) => {
   const [isDark, setIsDark] = React.useState(true);
 
+  // Set dark theme according to system preference
+  React.useEffect(() => {
+    if (window.matchMedia("(prefers-color-scheme: light)").matches)
+      setIsDark(false);
+  }, []);
+
   return (
     <DarkModeContext.Provider
       value={{ isDark, toggleDark: () => setIsDark((d) => !d) }}