From 53fcc2846f6ad531c8cf3d2cde3d83e994529b93 Mon Sep 17 00:00:00 2001
From: maziggy <mz@v8w.de>
Date: Wed, 10 Dec 2025 09:46:06 +0000
Subject: [PATCH] Fixed bug where external links were not respected by hotkeys

---
 frontend/index.html                      |  3 +-
 frontend/src/components/ThemeContext.tsx | 52 ++++++++++++++++++++++++
 2 files changed, 54 insertions(+), 1 deletion(-)
 create mode 100644 frontend/src/components/ThemeContext.tsx

diff --git a/frontend/index.html b/frontend/index.html
index 8727e069a..73c6244c3 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -7,9 +7,10 @@
     <link rel="icon" type="image/png" sizes="32x32" href="/img/favicon-32x32.png" />
     <link rel="icon" type="image/png" sizes="16x16" href="/img/favicon-16x16.png" />
     <link rel="apple-touch-icon" sizes="180x180" href="/img/apple-touch-icon.png" />
+    <script type="module" crossorigin src="/assets/index-DAltyj1x.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-BYZOEJWU.css">
   </head>
   <body>
     <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
   </body>
 </html>
diff --git a/frontend/src/components/ThemeContext.tsx b/frontend/src/components/ThemeContext.tsx
new file mode 100644
index 000000000..a635552e8
--- /dev/null
+++ b/frontend/src/components/ThemeContext.tsx
@@ -0,0 +1,52 @@
+import { createContext, useContext, useEffect, useState, type ReactNode } from 'react';
+
+type Theme = 'light' | 'dark';
+
+interface ThemeContextType {
+  theme: Theme;
+  toggleTheme: () => void;
+  setTheme: (theme: Theme) => void;
+}
+
+const ThemeContext = createContext<ThemeContextType | undefined>(undefined);
+
+export function ThemeProvider({ children }: { children: ReactNode }) {
+  const [theme, setThemeState] = useState<Theme>(() => {
+    const stored = localStorage.getItem('theme') as Theme | null;
+    if (stored) return stored;
+    // Default to dark theme
+    return 'dark';
+  });
+
+  useEffect(() => {
+    const root = document.documentElement;
+    if (theme === 'dark') {
+      root.classList.add('dark');
+    } else {
+      root.classList.remove('dark');
+    }
+    localStorage.setItem('theme', theme);
+  }, [theme]);
+
+  const toggleTheme = () => {
+    setThemeState((prev) => (prev === 'dark' ? 'light' : 'dark'));
+  };
+
+  const setTheme = (newTheme: Theme) => {
+    setThemeState(newTheme);
+  };
+
+  return (
+    <ThemeContext.Provider value={{ theme, toggleTheme, setTheme }}>
+      {children}
+    </ThemeContext.Provider>
+  );
+}
+
+export function useTheme() {
+  const context = useContext(ThemeContext);
+  if (!context) {
+    throw new Error('useTheme must be used within a ThemeProvider');
+  }
+  return context;
+}