Merge pull request #9769 from gitbutlerapp/butbot-agent-planning

butbot Agent - planning and routing

Author: estib-vega

Cargo.lock

@@ -208,9 +208,13 @@
 						</Tooltip>
 					</div>
 				</div>
-				{#each action.toolCalls as toolCall}
-					<FeedItemKind type="tool-call" {projectId} {toolCall} />
-				{/each}
+				{#if action.toolCalls.length > 0}
+					<div class="action-item__content-tool-calls">
+						{#each action.toolCalls as toolCall}
+							<FeedItemKind type="tool-call" {projectId} {toolCall} />
+						{/each}
+					</div>
+				{/if}
 			{/if}
 			<span class="text-14">
 				<Markdown content={action.content} />
@@ -232,9 +236,7 @@
 					</Tooltip>
 				</div>
 			</div>
-			<span class="text-14">
-				<FeedStreamMessage {projectId} message={action} />
-			</span>
+			<FeedStreamMessage {projectId} message={action} />
 		</div>
 	{/if}
 </div>
@@ -302,6 +304,16 @@
 		gap: 8px;
 	}
 
+	.action-item__content-tool-calls {
+		display: flex;
+		flex-direction: column;
+		padding: 10px;
+		gap: 4px;
+		border: 1px solid var(--clr-border-2);
+
+		border-radius: var(--radius-ml);
+	}
+
 	.action-item__editor-logo {
 		position: relative;
 		height: fit-content;

apps/desktop/src/components/FeedItem.svelte

@@ -1,8 +1,8 @@
 <script lang="ts">
 	import FeedItemKind from '$components/FeedItemKind.svelte';
-	import { FEED_FACTORY, type InProgressAssistantMessage } from '$lib/feed/feed';
+	import { FEED_FACTORY, type InProgressAssistantMessage, type TodoState } from '$lib/feed/feed';
 	import { inject } from '@gitbutler/shared/context';
-	import { Markdown } from '@gitbutler/ui';
+	import { Icon, Markdown } from '@gitbutler/ui';
 
 	import type { ToolCall } from '$lib/ai/tool';
 
@@ -15,8 +15,10 @@
 
 	const feedFactory = inject(FEED_FACTORY);
 	const feed = $derived(feedFactory.getFeed(projectId));
+
 	let toolCalls = $state<ToolCall[]>(message.toolCalls);
 	let messageContent = $state(message.content);
+	let todos = $state<TodoState[]>(message.todos);
 	const paragraphs = $derived(messageContent.split('\n\n'));
 
 	let bottom = $state<HTMLDivElement>();
@@ -35,13 +37,19 @@
 		}
 	}
 
+	function handleTodoUpdate(list: TodoState[]) {
+		todos = list;
+	}
+
 	$effect(() => {
 		const unsubscribe = feed.subscribeToMessage(message.id, (updatedMessage) => {
 			switch (updatedMessage.type) {
 				case 'token':
 					return handleToken(updatedMessage.token);
 				case 'tool-call':
 					return handleToolCall(updatedMessage.toolCall);
+				case 'todo-update':
+					return handleTodoUpdate(updatedMessage.list);
 			}
 		});
 
@@ -51,16 +59,46 @@
 	});
 </script>
 
-<div>
+{#snippet todoItem(todo: TodoState)}
+	<div class="stream-message__todo-item">
+		{#if todo.status === 'in-progress'}
+			<Icon name="spinner" opacity={0.6} />
+		{:else if todo.status === 'success'}
+			<Icon name="success" color="success" opacity={0.6} />
+		{:else if todo.status === 'failed'}
+			<Icon name="error" color="error" opacity={0.6} />
+		{:else if todo.status === 'waiting'}
+			<Icon name="info" opacity={0.6} />
+		{/if}
+		<span class="text-12" class:suceeded={todo.status === 'success'}>{todo.title}</span>
+	</div>
+{/snippet}
+
+{#snippet todoList()}
+	<div class="stream-message__todo-list">
+		{#each todos as todo (todo.id)}
+			{@render todoItem(todo)}
+		{/each}
+	</div>
+{/snippet}
+
+<div class="stream-message text-14">
+	{#if todos.length > 0}
+		{@render todoList()}
+	{/if}
+
 	{#if messageContent === '' && toolCalls.length === 0}
 		<p class="thinking">Thinking...</p>
 	{:else}
 		{#if toolCalls.length > 0}
 			<p class="vibing">Vibing</p>
-			{#each toolCalls as toolCall, index (index)}
-				<FeedItemKind type="tool-call" {projectId} {toolCall} />
-			{/each}
+			<div class="stream-message__tool-calls">
+				{#each toolCalls as toolCall, index (index)}
+					<FeedItemKind type="tool-call" {projectId} {toolCall} />
+				{/each}
+			</div>
 		{/if}
+
 		<div class="text-content">
 			{#each paragraphs as paragraph, index (index)}
 				<Markdown content={paragraph} />
@@ -70,7 +108,39 @@
 	<div bind:this={bottom} style="margin-top: 8px; height: 1px; width: 100%;"></div>
 </div>
 
-<style>
+<style lang="postcss">
+	.stream-message {
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+	}
+
+	.stream-message__todo-list {
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+	}
+
+	.stream-message__todo-item {
+		display: flex;
+		gap: 9px;
+
+		& > span.suceeded {
+			color: var(--clr-text-2);
+			text-decoration: line-through;
+		}
+	}
+
+	.stream-message__tool-calls {
+		display: flex;
+		flex-direction: column;
+		padding: 10px;
+		gap: 8px;
+		border: 1px solid var(--clr-border-2);
+
+		border-radius: var(--radius-ml);
+	}
+
 	.thinking,
 	.vibing {
 		margin: 4px 0;

apps/desktop/src/components/FeedStreamMessage.svelte

@@ -56,6 +56,17 @@ type ToolCallEvent = ToolCall & {
 	messageId: string;
 };
 
+export type TodoState = {
+	id: string;
+	title: string;
+	status: 'waiting' | 'in-progress' | 'success' | 'failed';
+};
+
+type TodoUpdateEvent = {
+	messageId: string;
+	list: TodoState[];
+};
+
 type UserMessageId = `user-${string}`;
 
 export type UserMessage = {
@@ -80,6 +91,7 @@ export type InProgressAssistantMessage = {
 	type: 'assistant-in-progress';
 	content: string;
 	toolCalls: ToolCall[];
+	todos: TodoState[];
 };
 
 export type FeedMessage = UserMessage | AssistantMessage;
@@ -102,7 +114,7 @@ export function isInProgressAssistantMessage(
 }
 
 interface BaseInProgressUpdate {
-	type: 'token' | 'tool-call';
+	type: 'token' | 'tool-call' | 'todo-update';
 }
 
 export interface TokenUpdate extends BaseInProgressUpdate {
@@ -115,7 +127,12 @@ export interface ToolCallUpdate extends BaseInProgressUpdate {
 	toolCall: ToolCall;
 }
 
-export type InProgressUpdate = TokenUpdate | ToolCallUpdate;
+export interface TodoUpdate extends BaseInProgressUpdate {
+	type: 'todo-update';
+	list: TodoState[];
+}
+
+export type InProgressUpdate = TokenUpdate | ToolCallUpdate | TodoUpdate;
 
 type InProgressSubscribeCallback = (update: InProgressUpdate) => void;
 
@@ -125,6 +142,7 @@ class Feed {
 	private unlistenDB: () => void;
 	private unlistenTokens: () => void;
 	private unlistenToolCalls: () => void;
+	private unlistenTodoUpdates: () => void;
 	private initialized;
 	private mutex = new Mutex();
 	private updateTimeout: ReturnType<typeof setTimeout> | null = null;
@@ -163,6 +181,13 @@ class Feed {
 				this.handleToolCallEvent(event.payload);
 			}
 		);
+
+		this.unlistenTodoUpdates = this.tauri.listen<TodoUpdateEvent>(
+			`project://${projectId}/todo-updates`,
+			(event) => {
+				this.handleTodoUpdate(event.payload);
+			}
+		);
 	}
 
 	isProjectFeed(projectId: string): boolean {
@@ -201,6 +226,11 @@ class Feed {
 		subscribers.forEach((callback) => callback({ type: 'tool-call', toolCall }));
 	}
 
+	private notifySubscribersTodoUpdate(messageId: InProgressAssistantMessageId, list: TodoState[]) {
+		const subscribers = this.messageSubscribers.get(messageId) ?? [];
+		subscribers.forEach((callback) => callback({ type: 'todo-update', list }));
+	}
+
 	private handleDBEvent(event: DBEvent) {
 		switch (event.kind) {
 			case 'actions':
@@ -238,6 +268,22 @@ class Feed {
 		});
 	}
 
+	private async handleTodoUpdate(event: TodoUpdateEvent) {
+		const inProgressId: InProgressAssistantMessageId = `assistant-in-progress-${event.messageId}`;
+		this.notifySubscribersTodoUpdate(inProgressId, event.list);
+
+		await this.mutex.lock(async () => {
+			this.combined.update((entries) => {
+				const existing = entries.find((entry) => entry.id === inProgressId);
+				if (existing && isInProgressAssistantMessage(existing)) {
+					existing.todos = event.list;
+					return deduplicateBy([...entries], 'id');
+				}
+				return entries; // If not found, do nothing.
+			});
+		});
+	}
+
 	private async handleLastAdded(entry: FeedEntry) {
 		this.lastAddedId.set(entry.id);
 	}
@@ -266,7 +312,8 @@ class Feed {
 			id: `assistant-in-progress-${uuid}`,
 			type: 'assistant-in-progress',
 			content: '',
-			toolCalls: []
+			toolCalls: [],
+			todos: []
 		};
 
 		let added = false;
@@ -496,5 +543,6 @@ class Feed {
 		this.unlistenDB();
 		this.unlistenTokens();
 		this.unlistenToolCalls();
+		this.unlistenTodoUpdates();
 	}
 }

apps/desktop/src/lib/feed/feed.ts

@@ -1,11 +1,10 @@
 use std::{fmt::Debug, str};
 
-use async_openai::types::{ChatCompletionRequestSystemMessage, ChatCompletionRequestUserMessage};
 use but_tools::workspace::ProjectStatus;
 use schemars::JsonSchema;
 use serde::{Deserialize, Serialize};
 
-use crate::{OpenAiProvider, openai};
+use crate::{ChatMessage, OpenAiProvider, openai};
 
 #[derive(Debug, Serialize, Deserialize, JsonSchema)]
 pub enum BranchSuggestion {
@@ -97,13 +96,11 @@ pub fn group(openai: &OpenAiProvider, project_status: &ProjectStatus) -> anyhow:
         serialized_project_status
     );
 
-    let messages = vec![
-        ChatCompletionRequestSystemMessage::from(system_message).into(),
-        ChatCompletionRequestUserMessage::from(user_message).into(),
-    ];
+    let messages = vec![ChatMessage::User(user_message)];
 
-    let grouping = openai::structured_output_blocking::<Grouping>(openai, messages)?
-        .ok_or_else(|| anyhow::anyhow!("Failed to get grouping from OpenAI"))?;
+    let grouping =
+        openai::structured_output_blocking::<Grouping>(openai, system_message, messages)?
+            .ok_or_else(|| anyhow::anyhow!("Failed to get grouping from OpenAI"))?;
 
     Ok(grouping)
 }

crates/but-action/src/grouping.rs

@@ -33,7 +33,10 @@ pub use action::ActionListing;
 pub use action::Source;
 pub use action::list_actions;
 use but_graph::VirtualBranchesTomlMetadata;
-pub use openai::{ChatMessage, ToolCallContent, ToolResponseContent, tool_calling_loop_stream};
+pub use openai::{
+    ChatMessage, ToolCallContent, ToolResponseContent, structured_output_blocking,
+    tool_calling_loop, tool_calling_loop_stream,
+};
 use strum::EnumString;
 use uuid::Uuid;
 pub use workflow::WorkflowList;
@@ -128,7 +131,7 @@ pub fn freestyle(
             (emitter)(&name, payload);
         }
     });
-    let response = crate::openai::tool_calling_loop_stream(
+    let (response, _) = crate::openai::tool_calling_loop_stream(
         openai,
         system_message,
         internal_chat_messages,
@@ -137,7 +140,7 @@ pub fn freestyle(
         on_token_cb,
     )?;
 
-    Ok(response.unwrap_or_default())
+    Ok(response)
 }
 
 pub fn absorb(