wip: css/ui and desktop work

packages/desktop/src/context/index.ts

@@ -4,4 +4,3 @@ export { MarkedProvider, useMarked } from "./marked"
 export { SDKProvider, useSDK } from "./sdk"
 export { ShikiProvider, useShiki } from "./shiki"
 export { SyncProvider, useSync } from "./sync"
-export { ThemeProvider, useTheme } from "./theme"

packages/desktop/src/context/local.tsx

@@ -131,31 +131,31 @@ function init() {
     const changeset = createMemo(() => new Set(sync.data.changes.map((f) => f.path)))
     const changes = createMemo(() => Array.from(changeset()).sort((a, b) => a.localeCompare(b)))
 
-    createEffect((prev: FileStatus[]) => {
-      const removed = prev.filter((p) => !sync.data.changes.find((c) => c.path === p.path))
-      for (const p of removed) {
-        setStore(
-          "node",
-          p.path,
-          produce((draft) => {
-            draft.status = undefined
-            draft.view = "raw"
-          }),
-        )
-        load(p.path)
-      }
-      for (const p of sync.data.changes) {
-        if (store.node[p.path] === undefined) {
-          fetch(p.path).then(() => {
-            if (store.node[p.path] === undefined) return
-            setStore("node", p.path, "status", p)
-          })
-        } else {
-          setStore("node", p.path, "status", p)
-        }
-      }
-      return sync.data.changes
-    }, sync.data.changes)
+    // createEffect((prev: FileStatus[]) => {
+    //   const removed = prev.filter((p) => !sync.data.changes.find((c) => c.path === p.path))
+    //   for (const p of removed) {
+    //     setStore(
+    //       "node",
+    //       p.path,
+    //       produce((draft) => {
+    //         draft.status = undefined
+    //         draft.view = "raw"
+    //       }),
+    //     )
+    //     load(p.path)
+    //   }
+    //   for (const p of sync.data.changes) {
+    //     if (store.node[p.path] === undefined) {
+    //       fetch(p.path).then(() => {
+    //         if (store.node[p.path] === undefined) return
+    //         setStore("node", p.path, "status", p)
+    //       })
+    //     } else {
+    //       setStore("node", p.path, "status", p)
+    //     }
+    //   }
+    //   return sync.data.changes
+    // }, sync.data.changes)
 
     const changed = (path: string) => {
       const node = store.node[path]

packages/desktop/src/context/theme.tsx

@@ -1,92 +0,0 @@
-import {
-  createContext,
-  useContext,
-  createSignal,
-  createEffect,
-  onMount,
-  type ParentComponent,
-  onCleanup,
-} from "solid-js"
-
-export interface ThemeContextValue {
-  theme: string | undefined
-  isDark: boolean
-  setTheme: (themeName: string) => void
-  setDarkMode: (isDark: boolean) => void
-}
-
-const ThemeContext = createContext<ThemeContextValue>()
-
-export const useTheme = () => {
-  const context = useContext(ThemeContext)
-  if (!context) {
-    throw new Error("useTheme must be used within a ThemeProvider")
-  }
-  return context
-}
-
-interface ThemeProviderProps {
-  defaultTheme?: string
-  defaultDarkMode?: boolean
-}
-
-const themes = ["opencode", "tokyonight", "ayu", "nord", "catppuccin"]
-
-export const ThemeProvider: ParentComponent<ThemeProviderProps> = (props) => {
-  const [theme, setThemeSignal] = createSignal<string | undefined>()
-  const [isDark, setIsDark] = createSignal(props.defaultDarkMode ?? false)
-
-  const handleKeyDown = (event: KeyboardEvent) => {
-    if (event.key === "t" && event.ctrlKey) {
-      event.preventDefault()
-      const current = theme()
-      if (!current) return
-      const index = themes.indexOf(current)
-      const next = themes[(index + 1) % themes.length]
-      setTheme(next)
-    }
-  }
-
-  onMount(() => {
-    window.addEventListener("keydown", handleKeyDown)
-  })
-
-  onCleanup(() => {
-    window.removeEventListener("keydown", handleKeyDown)
-  })
-
-  onMount(() => {
-    const savedTheme = localStorage.getItem("theme") ?? "opencode"
-    const savedDarkMode = localStorage.getItem("darkMode") ?? "true"
-    setIsDark(savedDarkMode === "true")
-    setTheme(savedTheme)
-  })
-
-  createEffect(() => {
-    const currentTheme = theme()
-    const darkMode = isDark()
-    if (currentTheme) {
-      document.documentElement.setAttribute("data-theme", currentTheme)
-      document.documentElement.setAttribute("data-dark", darkMode.toString())
-    }
-  })
-
-  const setTheme = async (theme: string) => {
-    setThemeSignal(theme)
-    localStorage.setItem("theme", theme)
-  }
-
-  const setDarkMode = (dark: boolean) => {
-    setIsDark(dark)
-    localStorage.setItem("darkMode", dark.toString())
-  }
-
-  const contextValue: ThemeContextValue = {
-    theme: theme(),
-    isDark: isDark(),
-    setTheme,
-    setDarkMode,
-  }
-
-  return <ThemeContext.Provider value={contextValue}>{props.children}</ThemeContext.Provider>
-}