fix(tui): render console org load errors inline (#33040)

Author: rekram1-node

packages/tui/src/component/dialog-console-org.tsx

@@ -1,9 +1,11 @@
-import { createResource, createMemo } from "solid-js"
+import { createResource, createMemo, createSignal } from "solid-js"
+import { TextAttributes } from "@opentui/core"
 import { DialogSelect } from "../ui/dialog-select"
 import { useSDK } from "../context/sdk"
 import { useDialog } from "../ui/dialog"
 import { useToast } from "../ui/toast"
 import { useTheme } from "../context/theme"
+import { errorMessage } from "../util/error"
 import type { ExperimentalConsoleListOrgsResponse } from "@opencode-ai/sdk/v2"
 
 type OrgOption = ExperimentalConsoleListOrgsResponse["orgs"][number]
@@ -25,14 +27,26 @@ export function DialogConsoleOrg() {
   const toast = useToast()
   const { theme } = useTheme()
 
-  const [orgs] = createResource(async () => {
-    const result = await sdk.client.experimental.console.listOrgs({}, { throwOnError: true })
-    return result.data?.orgs ?? []
-  })
+  const [loadError, setLoadError] = createSignal<unknown>()
+
+  const [orgs] = createResource(() =>
+    sdk.client.experimental.console
+      .listOrgs({}, { throwOnError: true })
+      .then((result) => result.data?.orgs ?? [])
+      // Catch so the rejected resource never reaches the memos below: reading
+      // orgs() in an errored state re-throws and tears down the dialog.
+      .catch((error) => {
+        setLoadError(error)
+        return undefined
+      }),
+  )
+
+  const showError = createMemo(() => Boolean(loadError()))
 
   const current = createMemo(() => orgs()?.find((item) => item.active))
 
   const options = createMemo(() => {
+    if (showError()) return []
     const listed = orgs()
     if (listed === undefined) {
       return [
@@ -99,5 +113,23 @@ export function DialogConsoleOrg() {
       }))
   })
 
-  return <DialogSelect<string | OrgOption> title="Switch org" options={options()} current={current()} />
+  return (
+    <DialogSelect<string | OrgOption>
+      title="Switch org"
+      options={options()}
+      current={current()}
+      renderFilter={!showError()}
+      locked={showError()}
+      emptyView={
+        showError() ? (
+          <box paddingLeft={4} paddingRight={4}>
+            <text fg={theme.error} attributes={TextAttributes.BOLD}>
+              Could not load orgs
+            </text>
+            <text fg={theme.textMuted}>{errorMessage(loadError())}</text>
+          </box>
+        ) : undefined
+      }
+    />
+  )
 }