From a8753f860b15311818c9fb0de4e158873a0b9136 Mon Sep 17 00:00:00 2001
From: Shpetim <shpetim.alimi@ndbit.net>
Date: Sat, 20 Dec 2025 14:40:38 +0100
Subject: [PATCH] fix(theme): improve custom theme loading and error handling

When user has system theme set wait for system theme to load before loading ui.
Add error fallback to getCustomThemes.
---
 .../src/cli/cmd/tui/context/theme.tsx         | 46 +++++++++++++++----
 1 file changed, 36 insertions(+), 10 deletions(-)

diff --git a/packages/opencode/src/cli/cmd/tui/context/theme.tsx b/packages/opencode/src/cli/cmd/tui/context/theme.tsx
index 595d3025d5e3..00bb2dbabcc4 100644
--- a/packages/opencode/src/cli/cmd/tui/context/theme.tsx
+++ b/packages/opencode/src/cli/cmd/tui/context/theme.tsx
@@ -279,14 +279,23 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
       ready: false,
     })
 
-    createEffect(async () => {
-      const custom = await getCustomThemes()
-      setStore(
-        produce((draft) => {
-          Object.assign(draft.themes, custom)
-          draft.ready = true
-        }),
-      )
+    createEffect(() => {
+      getCustomThemes()
+        .then((custom) => {
+          setStore(
+            produce((draft) => {
+              Object.assign(draft.themes, custom)
+            }),
+          )
+        })
+        .catch(() => {
+          setStore("active", "opencode")
+        })
+        .finally(() => {
+          if (store.active !== "system") {
+            setStore("ready", true)
+          }
+        })
     })
 
     const renderer = useRenderer()
@@ -295,8 +304,25 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
         size: 16,
       })
       .then((colors) => {
-        if (!colors.palette[0]) return
-        setStore("themes", "system", generateSystem(colors, store.mode))
+        if (!colors.palette[0]) {
+          if (store.active === "system") {
+            setStore(
+              produce((draft) => {
+                draft.active = "opencode"
+                draft.ready = true
+              }),
+            )
+          }
+          return
+        }
+        setStore(
+          produce((draft) => {
+            draft.themes.system = generateSystem(colors, store.mode)
+            if (store.active === "system") {
+              draft.ready = true
+            }
+          }),
+        )
       })
 
     const values = createMemo(() => {