feat: add ability to disable spinner animation

packages/opencode/src/cli/cmd/tui/component/dialog-session-list.tsx

@@ -8,6 +8,7 @@ import { Keybind } from "@/util/keybind"
 import { useTheme } from "../context/theme"
 import { useSDK } from "../context/sdk"
 import { DialogSessionRename } from "./dialog-session-rename"
+import { useKV } from "../context/kv"
 import "opentui-spinner/solid"
 
 export function DialogSessionList() {
@@ -16,6 +17,7 @@ export function DialogSessionList() {
   const { theme } = useTheme()
   const route = useRoute()
   const sdk = useSDK()
+  const kv = useKV()
 
   const [toDelete, setToDelete] = createSignal<string>()
 
@@ -45,7 +47,13 @@ export function DialogSessionList() {
           value: x.id,
           category,
           footer: Locale.time(x.time.updated),
-          gutter: isWorking ? <spinner frames={spinnerFrames} interval={80} color={theme.primary} /> : undefined,
+          gutter: isWorking ? (
+            kv.get("animations_enabled", true) ? (
+              <spinner frames={spinnerFrames} interval={80} color={theme.primary} />
+            ) : (
+              <text fg={theme.textMuted}>[⋯]</text>
+            )
+          ) : undefined,
         }
       })
       .slice(0, 150)

packages/opencode/src/cli/cmd/tui/component/prompt/index.tsx

@@ -29,6 +29,7 @@ import { useDialog } from "@tui/ui/dialog"
 import { DialogProvider as DialogProviderConnect } from "../dialog-provider"
 import { DialogAlert } from "../../ui/dialog-alert"
 import { useToast } from "../../ui/toast"
+import { useKV } from "../../context/kv"
 
 export type PromptProps = {
   sessionID?: string
@@ -127,6 +128,7 @@ export function Prompt(props: PromptProps) {
   const tall = createMemo(() => dimensions().height > 40)
   const wide = createMemo(() => dimensions().width > 120)
   const { theme, syntax } = useTheme()
+  const kv = useKV()
 
   function promptModelWarning() {
     toast.show({
@@ -1002,8 +1004,11 @@ export function Prompt(props: PromptProps) {
                 justifyContent={status().type === "retry" ? "space-between" : "flex-start"}
               >
                 <box flexShrink={0} flexDirection="row" gap={1}>
-                  {/* @ts-ignore // SpinnerOptions doesn't support marginLeft */}
-                  <spinner marginLeft={1} color={spinnerDef().color} frames={spinnerDef().frames} interval={40} />
+                  <box marginLeft={1}>
+                    <Show when={kv.get("animations_enabled", true)} fallback={<text fg={theme.textMuted}>[⋯]</text>}>
+                      <spinner color={spinnerDef().color} frames={spinnerDef().frames} interval={40} />
+                    </Show>
+                  </box>
                   <box flexDirection="row" gap={1} flexShrink={0}>
                     {(() => {
                       const retry = createMemo(() => {

packages/opencode/src/cli/cmd/tui/routes/session/index.tsx

@@ -91,6 +91,7 @@ const context = createContext<{
   showDetails: () => boolean
   userMessageMarkdown: () => boolean
   diffWrapMode: () => "word" | "none"
+  animationsEnabled: () => boolean
   sync: ReturnType<typeof useSync>
 }>()
 
@@ -129,6 +130,7 @@ export function Session() {
   const [showScrollbar, setShowScrollbar] = createSignal(kv.get("scrollbar_visible", false))
   const [userMessageMarkdown, setUserMessageMarkdown] = createSignal(kv.get("user_message_markdown", true))
   const [diffWrapMode, setDiffWrapMode] = createSignal<"word" | "none">("word")
+  const [animationsEnabled, setAnimationsEnabled] = createSignal(kv.get("animations_enabled", true))
 
   const wide = createMemo(() => dimensions().width > 120)
   const tall = createMemo(() => dimensions().height > 40)
@@ -587,6 +589,19 @@ export function Session() {
         dialog.clear()
       },
     },
+    {
+      title: animationsEnabled() ? "Disable animations" : "Enable animations",
+      value: "session.toggle.animations",
+      category: "Session",
+      onSelect: (dialog) => {
+        setAnimationsEnabled((prev) => {
+          const next = !prev
+          kv.set("animations_enabled", next)
+          return next
+        })
+        dialog.clear()
+      },
+    },
     {
       title: "Page up",
       value: "session.page.up",
@@ -959,6 +974,7 @@ export function Session() {
         showDetails,
         userMessageMarkdown,
         diffWrapMode,
+        animationsEnabled,
         sync,
       }}
     >