Fix spinners showing when nothing is happening

Author: charlesvien

apps/twig/src/renderer/features/sessions/components/ConversationView.tsx

@@ -239,6 +239,7 @@ const TurnView = memo(function TurnView({
             item={renderItem}
             toolCalls={turn.toolCalls}
             turnCancelled={wasCancelled}
+            turnComplete={turn.isComplete}
           />
         );
       })}

apps/twig/src/renderer/features/sessions/components/session-update/ExecuteToolView.tsx

@@ -13,6 +13,7 @@ const ANSI_REGEX = new RegExp(`${String.fromCharCode(0x1b)}\\[[0-9;]*m`, "g");
 interface ExecuteToolViewProps {
   toolCall: ToolCall;
   turnCancelled?: boolean;
+  turnComplete?: boolean;
 }
 
 interface ExecuteRawInput {
@@ -36,6 +37,7 @@ function getOutputFromContent(
 export function ExecuteToolView({
   toolCall,
   turnCancelled,
+  turnComplete,
 }: ExecuteToolViewProps) {
   const [isExpanded, setIsExpanded] = useState(false);
   const { status, rawInput, content } = toolCall;
@@ -45,7 +47,7 @@ export function ExecuteToolView({
   const description = executeInput?.description;
 
   const isIncomplete = status === "pending" || status === "in_progress";
-  const isLoading = isIncomplete && !turnCancelled;
+  const isLoading = isIncomplete && !turnCancelled && !turnComplete;
 
   const output = (getOutputFromContent(content) ?? "").replace(ANSI_REGEX, "");
   const hasOutput = output.trim().length > 0;

apps/twig/src/renderer/features/sessions/components/session-update/PlanApprovalView.tsx

@@ -7,16 +7,19 @@ import { useMemo } from "react";
 interface PlanApprovalViewProps {
   toolCall: ToolCall;
   turnCancelled?: boolean;
+  turnComplete?: boolean;
 }
 
 export function PlanApprovalView({
   toolCall,
   turnCancelled,
+  turnComplete,
 }: PlanApprovalViewProps) {
   const { status, content } = toolCall;
   const isComplete = status === "completed";
   const wasCancelled =
-    (status === "pending" || status === "in_progress") && turnCancelled;
+    (status === "pending" || status === "in_progress") &&
+    (turnCancelled || turnComplete);
 
   const planText = useMemo(() => {
     const rawPlan = (toolCall.rawInput as { plan?: string } | undefined)?.plan;

apps/twig/src/renderer/features/sessions/components/session-update/SessionUpdateView.tsx

@@ -45,12 +45,14 @@ interface SessionUpdateViewProps {
   item: RenderItem;
   toolCalls?: Map<string, ToolCall>;
   turnCancelled?: boolean;
+  turnComplete?: boolean;
 }
 
 export const SessionUpdateView = memo(function SessionUpdateView({
   item,
   toolCalls,
   turnCancelled,
+  turnComplete,
 }: SessionUpdateViewProps) {
   switch (item.sessionUpdate) {
     case "user_message_chunk":
@@ -68,6 +70,7 @@ export const SessionUpdateView = memo(function SessionUpdateView({
         <ToolCallBlock
           toolCall={toolCalls?.get(item.toolCallId) ?? item}
           turnCancelled={turnCancelled}
+          turnComplete={turnComplete}
         />
       );
     case "tool_call_update":

apps/twig/src/renderer/features/sessions/components/session-update/ToolCallBlock.tsx

@@ -6,17 +6,26 @@ import { ToolCallView } from "./ToolCallView";
 interface ToolCallBlockProps {
   toolCall: ToolCall;
   turnCancelled?: boolean;
+  turnComplete?: boolean;
 }
 
-export function ToolCallBlock({ toolCall, turnCancelled }: ToolCallBlockProps) {
+export function ToolCallBlock({
+  toolCall,
+  turnCancelled,
+  turnComplete,
+}: ToolCallBlockProps) {
   const meta = toolCall._meta as
     | { claudeCode?: { toolName?: string } }
     | undefined;
   const toolName = meta?.claudeCode?.toolName;
 
   if (toolCall.kind === "switch_mode") {
     return (
-      <PlanApprovalView toolCall={toolCall} turnCancelled={turnCancelled} />
+      <PlanApprovalView
+        toolCall={toolCall}
+        turnCancelled={turnCancelled}
+        turnComplete={turnComplete}
+      />
     );
   }
 
@@ -26,9 +35,19 @@ export function ToolCallBlock({ toolCall, turnCancelled }: ToolCallBlockProps) {
 
   if (toolCall.kind === "execute") {
     return (
-      <ExecuteToolView toolCall={toolCall} turnCancelled={turnCancelled} />
+      <ExecuteToolView
+        toolCall={toolCall}
+        turnCancelled={turnCancelled}
+        turnComplete={turnComplete}
+      />
     );
   }
 
-  return <ToolCallView toolCall={toolCall} turnCancelled={turnCancelled} />;
+  return (
+    <ToolCallView
+      toolCall={toolCall}
+      turnCancelled={turnCancelled}
+      turnComplete={turnComplete}
+    />
+  );
 }

apps/twig/src/renderer/features/sessions/components/session-update/ToolCallView.tsx

@@ -33,12 +33,17 @@ const kindIcons: Record<TwigToolKind, Icon> = {
 interface ToolCallViewProps {
   toolCall: ToolCall;
   turnCancelled?: boolean;
+  turnComplete?: boolean;
 }
 
-export function ToolCallView({ toolCall, turnCancelled }: ToolCallViewProps) {
+export function ToolCallView({
+  toolCall,
+  turnCancelled,
+  turnComplete,
+}: ToolCallViewProps) {
   const { title, kind, status, locations } = toolCall;
   const isIncomplete = status === "pending" || status === "in_progress";
-  const isLoading = isIncomplete && !turnCancelled;
+  const isLoading = isIncomplete && !turnCancelled && !turnComplete;
   const isFailed = status === "failed";
   const wasCancelled = isIncomplete && turnCancelled;
   const KindIcon = (kind && kindIcons[kind]) || Wrench;