Merge branch 'dev' into update-design-subscriptions

packages/app/src/pages/layout.tsx

@@ -880,7 +880,7 @@ export default function Layout(props: ParentProps) {
     return (
       <div
         data-session-id={props.session.id}
-        class="group/session relative w-full rounded-md cursor-default transition-colors px-3
+        class="group/session relative w-full rounded-md cursor-default transition-colors pl-2 pr-3
                hover:bg-surface-raised-base-hover focus-within:bg-surface-raised-base-hover has-[.active]:bg-surface-base-active"
       >
         <Tooltip placement={props.mobile ? "bottom" : "right"} value={props.session.title} gutter={16} openDelay={1000}>
@@ -897,7 +897,7 @@ export default function Layout(props: ParentProps) {
               >
                 <Switch>
                   <Match when={isWorking()}>
-                    <Spinner class="size-[15px]" />
+                    <Spinner class="size-[15px] opacity-50" />
                   </Match>
                   <Match when={hasPermissions()}>
                     <div class="size-1.5 rounded-full bg-surface-warning-strong" />

packages/ui/src/components/spinner.tsx

@@ -1,6 +1,7 @@
 import { ComponentProps, For } from "solid-js"
 
-const outerIndices = new Set([0, 1, 2, 3, 4, 7, 8, 11, 12, 13, 14, 15])
+const outerIndices = new Set([1, 2, 4, 7, 8, 11, 13, 14])
+const cornerIndices = new Set([0, 3, 12, 15])
 const squares = Array.from({ length: 16 }, (_, i) => ({
   id: i,
   x: (i % 4) * 4,
@@ -8,6 +9,7 @@ const squares = Array.from({ length: 16 }, (_, i) => ({
   delay: Math.random() * 1.5,
   duration: 1 + Math.random() * 1,
   outer: outerIndices.has(i),
+  corner: cornerIndices.has(i),
 }))
 
 export function Spinner(props: {
@@ -35,8 +37,11 @@ export function Spinner(props: {
             height="3"
             rx="1"
             style={{
-              animation: `${square.outer ? "pulse-opacity-dim" : "pulse-opacity"} ${square.duration}s ease-in-out infinite`,
-              "animation-delay": `${square.delay}s`,
+              opacity: square.corner ? 0 : undefined,
+              animation: square.corner
+                ? undefined
+                : `${square.outer ? "pulse-opacity-dim" : "pulse-opacity"} ${square.duration}s ease-in-out infinite`,
+              "animation-delay": square.corner ? undefined : `${square.delay}s`,
             }}
           />
         )}

packages/web/src/content/docs/tui.mdx

@@ -242,6 +242,20 @@ List available themes.
 
 ---
 
+### thinking
+
+Toggle the visibility of thinking/reasoning blocks in the conversation. When enabled, you can see the model's reasoning process for models that support extended thinking.
+
+:::note
+This command only controls whether thinking blocks are **displayed** - it does not enable or disable the model's reasoning capabilities. To toggle actual reasoning capabilities, use `ctrl+t` to cycle through model variants.
+:::
+
+```bash frame="none"
+/thinking
+```
+
+---
+
 ### undo
 
 Undo last message in the conversation. Removes the most recent user message, all subsequent responses, and any file changes.