implement tool calls in the ui

Author: kujtimiihoxha

.editorconfig

@@ -11,7 +11,7 @@ indent_size = 2
 
 [*.go]
 indent_style = tab
-indent_size = 8
+indent_size = 4
 
 [*.golden]
 insert_final_newline = false

internal/llm/agent/agent.go

@@ -443,18 +443,14 @@ func (a *agent) processEvent(ctx context.Context, sessionID string, assistantMsg
 		assistantMsg.AppendContent(event.Content)
 		return a.messages.Update(ctx, *assistantMsg)
 	case provider.EventToolUseStart:
+		logging.Info("Tool call started", "toolCall", event.ToolCall)
 		assistantMsg.AddToolCall(*event.ToolCall)
 		return a.messages.Update(ctx, *assistantMsg)
-	// TODO: see how to handle this
-	// case provider.EventToolUseDelta:
-	// 	tm := time.Unix(assistantMsg.UpdatedAt, 0)
-	// 	assistantMsg.AppendToolCallInput(event.ToolCall.ID, event.ToolCall.Input)
-	// 	if time.Since(tm) > 1000*time.Millisecond {
-	// 		err := a.messages.Update(ctx, *assistantMsg)
-	// 		assistantMsg.UpdatedAt = time.Now().Unix()
-	// 		return err
-	// 	}
+	case provider.EventToolUseDelta:
+		assistantMsg.AppendToolCallInput(event.ToolCall.ID, event.ToolCall.Input)
+		return a.messages.Update(ctx, *assistantMsg)
 	case provider.EventToolUseStop:
+		logging.Info("Finished tool call", "toolCall", event.ToolCall)
 		assistantMsg.FinishToolCall(event.ToolCall.ID)
 		return a.messages.Update(ctx, *assistantMsg)
 	case provider.EventError:

internal/llm/prompt/coder.go

@@ -153,7 +153,7 @@ When making changes to files, first understand the file's code conventions. Mimi
 
 # Doing tasks
 The user will primarily request you perform software engineering tasks. This includes solving bugs, adding new functionality, refactoring code, explaining code, and more. For these tasks the following steps are recommended:
-1. Use the available search tools to understand the codebase and the user's query. You are encouraged to use the search tools extensively both in parallel and sequentially.
+1. Use the available search tools to understand the codebase and the user's query.
 2. Implement the solution using all tools available to you
 3. Verify the solution if possible with tests. NEVER assume specific test framework or test script. Check the README or search codebase to determine the testing approach.
 4. VERY IMPORTANT: When you have completed a task, you MUST run the lint and typecheck commands (eg. npm run lint, npm run typecheck, ruff, etc.) if they were provided to you to ensure your code is correct. If you are unable to find the correct command, ask the user for the command to run and if they supply it, proactively suggest writing it to opencode.md so that you will know to run it next time.
@@ -162,7 +162,7 @@ NEVER commit changes unless the user explicitly asks you to. It is VERY IMPORTAN
 
 # Tool usage policy
 - When doing file search, prefer to use the Agent tool in order to reduce context usage.
-- If you intend to call multiple tools and there are no dependencies between the calls, make all of the independent calls in the same function_calls block.
+- If you intend to call multiple tools and there are no dependencies between the calls, make all of the independent calls in parallel.
 - IMPORTANT: The user does not see the full output of the tool responses, so if you need the output of the tool for the response make sure to summarize it for the user.
 
 You MUST answer concisely with fewer than 4 lines of text (not including tool use or code generation), unless user asks for detail.`

internal/llm/provider/anthropic.go

@@ -305,7 +305,7 @@ func (a *anthropicClient) stream(ctx context.Context, messages []message.Message
 								ToolCall: &message.ToolCall{
 									ID:       currentToolCallID,
 									Finished: false,
-									Input:    event.Delta.JSON.PartialJSON.Raw(),
+									Input:    event.Delta.PartialJSON,
 								},
 							}
 						}

internal/tui/components/anim/anim.go

@@ -9,6 +9,7 @@ import (
 	"github.com/charmbracelet/bubbles/v2/spinner"
 	tea "github.com/charmbracelet/bubbletea/v2"
 	"github.com/charmbracelet/lipgloss/v2"
+	"github.com/google/uuid"
 	"github.com/lucasb-eyer/go-colorful"
 	"github.com/opencode-ai/opencode/internal/tui/styles"
 	"github.com/opencode-ai/opencode/internal/tui/theme"
@@ -54,19 +55,23 @@ func (c cyclingChar) state(start time.Time) charState {
 	return charCyclingState
 }
 
-type StepCharsMsg struct{}
+type StepCharsMsg struct {
+	id string
+}
 
-func stepChars() tea.Cmd {
+func stepChars(id string) tea.Cmd {
 	return tea.Tick(charCyclingFPS, func(time.Time) tea.Msg {
-		return StepCharsMsg{}
+		return StepCharsMsg{id}
 	})
 }
 
-type ColorCycleMsg struct{}
+type ColorCycleMsg struct {
+	id string
+}
 
-func cycleColors() tea.Cmd {
+func cycleColors(id string) tea.Cmd {
 	return tea.Tick(colorCycleFPS, func(time.Time) tea.Msg {
-		return ColorCycleMsg{}
+		return ColorCycleMsg{id}
 	})
 }
 
@@ -80,6 +85,7 @@ type anim struct {
 	label           []rune
 	ellipsis        spinner.Model
 	ellipsisStarted bool
+	id              string
 }
 
 func New(cyclingCharsSize uint, label string) util.Model {
@@ -91,10 +97,12 @@ func New(cyclingCharsSize uint, label string) util.Model {
 		gap = ""
 	}
 
+	id := uuid.New()
 	c := anim{
 		start:    time.Now(),
 		label:    []rune(gap + label),
 		ellipsis: spinner.New(spinner.WithSpinner(spinner.Ellipsis)),
+		id:       id.String(),
 	}
 
 	// If we're in truecolor mode (and there are enough cycling characters)
@@ -144,15 +152,18 @@ func New(cyclingCharsSize uint, label string) util.Model {
 }
 
 // Init initializes the animation.
-func (anim) Init() tea.Cmd {
-	return tea.Batch(stepChars(), cycleColors())
+func (a anim) Init() tea.Cmd {
+	return tea.Batch(stepChars(a.id), cycleColors(a.id))
 }
 
 // Update handles messages.
 func (a anim) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 	var cmd tea.Cmd
-	switch msg.(type) {
+	switch msg := msg.(type) {
 	case StepCharsMsg:
+		if msg.id != a.id {
+			return a, nil
+		}
 		a.updateChars(&a.cyclingChars)
 		a.updateChars(&a.labelChars)
 
@@ -173,14 +184,17 @@ func (a anim) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 			}
 		}
 
-		return a, tea.Batch(stepChars(), cmd)
+		return a, tea.Batch(stepChars(a.id), cmd)
 	case ColorCycleMsg:
+		if msg.id != a.id {
+			return a, nil
+		}
 		const minColorCycleSize = 2
 		if len(a.ramp) < minColorCycleSize {
 			return a, nil
 		}
 		a.ramp = append(a.ramp[1:], a.ramp[0])
-		return a, cycleColors()
+		return a, cycleColors(a.id)
 	case spinner.TickMsg:
 		var cmd tea.Cmd
 		a.ellipsis, cmd = a.ellipsis.Update(msg)
@@ -216,7 +230,7 @@ func (a anim) View() string {
 		b.WriteRune(c.currentValue)
 	}
 
-	if len(a.label) > 1 {
+	if len(a.labelChars) > 1 {
 		textStyle := styles.BaseStyle().
 			Foreground(t.Text())
 		for _, c := range a.labelChars {

internal/tui/components/chat/list_v2.go

@@ -7,6 +7,7 @@ import (
 	tea "github.com/charmbracelet/bubbletea/v2"
 	"github.com/charmbracelet/lipgloss/v2"
 	"github.com/opencode-ai/opencode/internal/app"
+	"github.com/opencode-ai/opencode/internal/logging"
 	"github.com/opencode-ai/opencode/internal/message"
 	"github.com/opencode-ai/opencode/internal/pubsub"
 	"github.com/opencode-ai/opencode/internal/session"
@@ -61,7 +62,8 @@ func (m *messageListCmp) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 		return m, m.listCmp.SetItems([]util.Model{})
 
 	case pubsub.Event[message.Message]:
-		return m, m.handleMessageEvent(msg)
+		cmd := m.handleMessageEvent(msg)
+		return m, cmd
 	default:
 		var cmds []tea.Cmd
 		u, cmd := m.listCmp.Update(msg)
@@ -92,8 +94,8 @@ func (m *messageListCmp) handleMessageEvent(event pubsub.Event[message.Message])
 		// more likely to be at the end of the list
 		items := m.listCmp.Items()
 		for i := len(items) - 1; i >= 0; i-- {
-			msg := items[i].(messages.MessageCmp)
-			if msg.GetMessage().ID == event.Payload.ID {
+			msg, ok := items[i].(messages.MessageCmp)
+			if ok && msg.GetMessage().ID == event.Payload.ID {
 				messageExists = true
 				break
 			}
@@ -109,7 +111,6 @@ func (m *messageListCmp) handleMessageEvent(event pubsub.Event[message.Message])
 		case message.Tool:
 			return m.handleToolMessage(event.Payload)
 		}
-		// TODO: handle tools
 	case pubsub.UpdatedEvent:
 		return m.handleUpdateAssistantMessage(event.Payload)
 	}
@@ -122,30 +123,79 @@ func (m *messageListCmp) handleNewUserMessage(msg message.Message) tea.Cmd {
 }
 
 func (m *messageListCmp) handleToolMessage(msg message.Message) tea.Cmd {
+	items := m.listCmp.Items()
+	for _, tr := range msg.ToolResults() {
+		for i := len(items) - 1; i >= 0; i-- {
+			message := items[i]
+			if toolCall, ok := message.(messages.ToolCallCmp); ok {
+				if toolCall.GetToolCall().ID == tr.ToolCallID {
+					toolCall.SetToolResult(tr)
+					m.listCmp.UpdateItem(
+						i,
+						toolCall,
+					)
+					break
+				}
+			}
+		}
+	}
 	return nil
 }
 
 func (m *messageListCmp) handleUpdateAssistantMessage(msg message.Message) tea.Cmd {
+	var cmds []tea.Cmd
 	// Simple update the content
 	items := m.listCmp.Items()
-	lastItem := items[len(items)-1].(messages.MessageCmp)
-	// TODO:handle tool calls
-	if lastItem.GetMessage().ID != msg.ID {
-		return nil
+	assistantMessageInx := -1
+	toolCalls := map[int]messages.ToolCallCmp{}
+
+	// we go backwards because the messages are most likely at the end of the list
+	for i := len(items) - 1; i >= 0; i-- {
+		message := items[i]
+		if asMsg, ok := message.(messages.MessageCmp); ok {
+			if asMsg.GetMessage().ID == msg.ID {
+				assistantMessageInx = i
+			}
+		} else if tc, ok := message.(messages.ToolCallCmp); ok {
+			if tc.ParentMessageId() == msg.ID {
+				toolCalls[i] = tc
+			}
+		}
 	}
-	// for now just updet the last message
-	if len(msg.ToolCalls()) == 0 || msg.Content().Text != "" || msg.IsThinking() {
+
+	logging.Info("Update Assistant Message", "msg", msg, "assistantMessageInx", assistantMessageInx, "toolCalls", toolCalls)
+
+	if assistantMessageInx > -1 && (len(msg.ToolCalls()) == 0 || msg.Content().Text != "" || msg.IsThinking()) {
 		m.listCmp.UpdateItem(
-			len(items)-1,
+			assistantMessageInx,
 			messages.NewMessageCmp(
 				msg,
 				messages.WithLastUserMessageTime(time.Unix(m.lastUserMessageTime, 0)),
 			),
 		)
-	} else if len(msg.ToolCalls()) > 0 && msg.Content().Text == "" {
-		m.listCmp.DeleteItem(len(items) - 1)
+	} else if assistantMessageInx > -1 && len(msg.ToolCalls()) > 0 && msg.Content().Text == "" {
+		m.listCmp.DeleteItem(assistantMessageInx)
 	}
-	return nil
+	for _, tc := range msg.ToolCalls() {
+		found := false
+		for inx, tcc := range toolCalls {
+			if tc.ID == tcc.GetToolCall().ID {
+				tcc.SetToolCall(tc)
+				m.listCmp.UpdateItem(
+					inx,
+					tcc,
+				)
+				found = true
+				break
+			}
+		}
+		if !found {
+			cmd := m.listCmp.AppendItem(messages.NewToolCallCmp(msg.ID, tc))
+			cmds = append(cmds, cmd)
+		}
+	}
+
+	return tea.Batch(cmds...)
 }
 
 func (m *messageListCmp) handleNewAssistantMessage(msg message.Message) tea.Cmd {
@@ -161,7 +211,7 @@ func (m *messageListCmp) handleNewAssistantMessage(msg message.Message) tea.Cmd
 		cmds = append(cmds, cmd)
 	}
 	for _, tc := range msg.ToolCalls() {
-		cmd := m.listCmp.AppendItem(messages.NewToolCallCmp(tc))
+		cmd := m.listCmp.AppendItem(messages.NewToolCallCmp(msg.ID, tc))
 		cmds = append(cmds, cmd)
 	}
 	return tea.Batch(cmds...)
@@ -206,10 +256,10 @@ func (m *messageListCmp) SetSession(session session.Session) tea.Cmd {
 				if tr, ok := toolResultMap[tc.ID]; ok {
 					options = append(options, messages.WithToolCallResult(tr))
 				}
-				if msg.FinishPart().Reason == message.FinishReasonCanceled {
+				if msg.FinishPart() != nil && msg.FinishPart().Reason == message.FinishReasonCanceled {
 					options = append(options, messages.WithToolCallCancelled())
 				}
-				uiMessages = append(uiMessages, messages.NewToolCallCmp(tc, options...))
+				uiMessages = append(uiMessages, messages.NewToolCallCmp(msg.ID, tc, options...))
 			}
 		}
 	}

internal/tui/components/chat/messages/messages.go

@@ -65,9 +65,16 @@ func (m *messageCmp) Init() tea.Cmd {
 }
 
 func (m *messageCmp) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
-	u, cmd := m.anim.Update(msg)
-	m.anim = u.(util.Model)
-	return m, cmd
+	switch msg := msg.(type) {
+	case anim.ColorCycleMsg, anim.StepCharsMsg:
+		m.spinning = m.shouldSpin()
+		if m.spinning {
+			u, cmd := m.anim.Update(msg)
+			m.anim = u.(util.Model)
+			return m, cmd
+		}
+	}
+	return m, nil
 }
 
 func (m *messageCmp) View() string {

internal/tui/components/chat/messages/renderer.go

@@ -524,32 +524,3 @@ func prettifyToolName(name string) string {
 		return name
 	}
 }
-
-func toolAction(name string) string {
-	switch name {
-	case agent.AgentToolName:
-		return "Preparing prompt..."
-	case tools.BashToolName:
-		return "Building command..."
-	case tools.EditToolName:
-		return "Preparing edit..."
-	case tools.FetchToolName:
-		return "Writing fetch..."
-	case tools.GlobToolName:
-		return "Finding files..."
-	case tools.GrepToolName:
-		return "Searching content..."
-	case tools.LSToolName:
-		return "Listing directory..."
-	case tools.SourcegraphToolName:
-		return "Searching code..."
-	case tools.ViewToolName:
-		return "Reading file..."
-	case tools.WriteToolName:
-		return "Preparing write..."
-	case tools.PatchToolName:
-		return "Preparing patch..."
-	default:
-		return "Working..."
-	}
-}