From afdf3d57cb7ae4cbf0a519d1b53872f151ecba87 Mon Sep 17 00:00:00 2001
From: bndw <ben@bdw.to>
Date: Sun, 1 Mar 2026 08:10:35 -0800
Subject: feat: Add `activityStatus` state and `handleCancel` to App.ts… (+4
 more)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- ✅ Add `activityStatus` state and `handleCancel` to App.tsx; update Escape handler
- ✅ Extend `onClaudeMessage` handler: tool_progress, task_progress, restructure result block
- ✅ Pass `activityStatus` and `onCancel` props to `<ChatPane>` in App.tsx
- ✅ Update ChatPane.tsx props interface and loading bubble render
- ✅ Add loading bubble CSS (flex layout, cancel × styles, pulse animation)
---
 renderer/src/styles/globals.css | 34 ++++++++++++++++++++++++++++++++++
 1 file changed, 34 insertions(+)

(limited to 'renderer/src/styles')

diff --git a/renderer/src/styles/globals.css b/renderer/src/styles/globals.css
index 03c7443..7a8ae45 100644
--- a/renderer/src/styles/globals.css
+++ b/renderer/src/styles/globals.css
@@ -490,6 +490,40 @@ html[data-theme="light"] .session-rename-input {
 .message.loading {
   color: var(--text-secondary);
   font-style: italic;
+  animation: thinking-pulse 1.8s ease-in-out infinite;
+}
+
+/* Flex row so the activity text and cancel × sit on one line */
+.message.loading .message-content {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  white-space: normal;
+}
+
+/* Cancel × button inside the Thinking bubble */
+.loading-cancel-x {
+  background: transparent;
+  border: none;
+  color: var(--text-secondary);
+  cursor: pointer;
+  font-size: 16px;
+  line-height: 1;
+  padding: 0 2px;
+  opacity: 0.45;
+  flex-shrink: 0;
+  font-family: inherit;
+  transition: opacity 0.15s, color 0.15s;
+}
+
+.loading-cancel-x:hover {
+  opacity: 1;
+  color: var(--text-primary);
+}
+
+@keyframes thinking-pulse {
+  0%, 100% { opacity: 0.55; }
+  50%       { opacity: 1;    }
 }
 
 .chat-input {
-- 
cgit v1.2.3