From b4e85748e0d57ac7eec5d3b0223094ae626f68cf Mon Sep 17 00:00:00 2001
From: Duck Quang <quang.gateway@gmail.com>
Date: Fri, 17 Jul 2026 06:13:29 +0700
Subject: [PATCH] Default to dark mode instead of following the OS preference

Unpinned sessions now open in dark; the light/dark toggle still lets
users choose (and persists their choice). Removes the OS-follow effect,
which would otherwise flip an unpinned session back to light on a
light-OS machine.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 frontend/src/lib/hooks.ts | 24 ++----------------------
 1 file changed, 2 insertions(+), 22 deletions(-)

diff --git a/frontend/src/lib/hooks.ts b/frontend/src/lib/hooks.ts
index e0f0acf..66180f9 100644
--- a/frontend/src/lib/hooks.ts
+++ b/frontend/src/lib/hooks.ts
@@ -152,20 +152,13 @@ export function useStickToBottom(dep: unknown) {
 export type Theme = "light" | "dark";
 const THEME_KEY = "cosci_theme";
 
-function systemTheme(): Theme {
-  return typeof window !== "undefined" &&
-    window.matchMedia?.("(prefers-color-scheme: dark)").matches
-    ? "dark"
-    : "light";
-}
-
-/** Resolve the active theme: explicit user choice, else system preference. */
+/** Resolve the active theme: explicit user choice, else the dark default. */
 export function getTheme(): Theme {
   try {
     const saved = localStorage.getItem(THEME_KEY);
     if (saved === "light" || saved === "dark") return saved;
   } catch { /* ignore */ }
-  return systemTheme();
+  return "dark";
 }
 
 export function applyTheme(theme: Theme) {
@@ -185,19 +178,6 @@ export function useTheme(): [Theme, (t: Theme) => void] {
     applyTheme(t);
     try { localStorage.setItem(THEME_KEY, t); } catch { /* ignore */ }
   }, []);
-  // Follow system changes only while the user hasn't pinned a choice.
-  useEffect(() => {
-    const mq = window.matchMedia?.("(prefers-color-scheme: dark)");
-    if (!mq) return;
-    const onChange = () => {
-      try { if (localStorage.getItem(THEME_KEY)) return; } catch { /* ignore */ }
-      const t = systemTheme();
-      setThemeState(t);
-      applyTheme(t);
-    };
-    mq.addEventListener?.("change", onChange);
-    return () => mq.removeEventListener?.("change", onChange);
-  }, []);
   return [theme, setTheme];
 }