T24b: Agent, progress

- AgentStepList: an agent's steps down a data_display::Timeline rail,
  marked by chat::step_mark, with detail and time
- AgentPlan: items waiting, at work or done, with a count; done items go
  quiet and struck through
- chat::step_mark reads motion::changes: a check or cross that arrives pops
  in, still on first paint
- AgentStatus: a pill for planning, working, waiting, done or failed
- AgentProgress: the step at work, done of total, the time so far and a
  bar split by step; progress past its total fails loud
- SubAgentTree is lists::Tree with each agent's state as its note
- gallery: a plan the button advances, steps, statuses and a tree
This commit is contained in:
ZacharyZhang-NY committed 2026-09-26 08:25:51 -04:00
1 parent 91a513100c
commit 2d78db57a8
8 files changed
+551 -41

No files matched your search

+2
View File
@@ -1,7 +1,9 @@
mod permission;
mod progress;
#[cfg(all(test, feature = "test-support"))]
mod tests;
mod tools;
pub use permission::{Permission, PermissionPrompt, ToolApprovalDialog};
pub use progress::{AgentPlan, AgentProgress, AgentState, AgentStatus, AgentStep, AgentStepList};
pub use tools::{ToolCallCard, ToolCallGroup};
+317
View File
@@ -0,0 +1,317 @@
use std::time::Duration;
use gpui::{
AnyElement, App, ElementId, FontWeight, IntoElement, ParentElement, RenderOnce, SharedString,
Styled, Window, div, prelude::*,
};
use crate::{
chat::{StepState, step_mark},
data_display::{Timeline, TimelineItem},
motion::{ProgressBar, Spinner},
primitives::{Icon, IconName, Severity},
theme::{ActiveTheme, IconSize, TextSize},
typography::{Ellipsis, format::took, tabular},
};
/// One step of an agent's work: what it did, where it stands, a line below, how long it took.
#[derive(Clone, Debug, PartialEq)]
pub struct AgentStep {
pub title: SharedString,
pub state: StepState,
pub detail: Option<SharedString>,
pub took: Option<Duration>,
}
/// An agent's steps down a rail, each marked by where it stands.
#[derive(IntoElement)]
pub struct AgentStepList {
id: ElementId,
steps: Vec<AgentStep>,
}
impl AgentStepList {
pub fn new(id: impl Into<ElementId>, steps: impl IntoIterator<Item = AgentStep>) -> Self {
Self {
id: id.into(),
steps: steps.into_iter().collect(),
}
}
}
impl RenderOnce for AgentStepList {
fn render(self, window: &mut Window, cx: &mut App) -> impl IntoElement {
let marks: Vec<AnyElement> = (self.steps.iter().enumerate())
.map(|(ix, step)| {
step_mark(
(self.id.clone(), format!("step-{ix}")).into(),
step.state,
window,
cx,
)
})
.collect();
let colors = cx.theme().colors.clone();
self.steps
.into_iter()
.zip(marks)
.fold(Timeline::new(), |timeline, (step, mark)| {
let title = div()
.text_color(match step.state {
StepState::Waiting => colors.fg_subtle,
_ => colors.fg,
})
.child(step.title);
let item = TimelineItem::new(title)
.marker(mark)
.when_some(step.took, |item, spent| item.time(took(spent)));
timeline.item(match step.detail {
Some(detail) => item.child(detail),
None => item,
})
})
}
}
/// An agent's plan: items waiting, at work or done, with how many are done; a done item goes quiet and struck through.
#[derive(IntoElement)]
pub struct AgentPlan {
id: ElementId,
title: SharedString,
items: Vec<(SharedString, StepState)>,
}
impl AgentPlan {
pub fn new(
id: impl Into<ElementId>,
title: impl Into<SharedString>,
items: impl IntoIterator<Item = (impl Into<SharedString>, StepState)>,
) -> Self {
Self {
id: id.into(),
title: title.into(),
items: items
.into_iter()
.map(|(label, state)| (label.into(), state))
.collect(),
}
}
}
impl RenderOnce for AgentPlan {
fn render(self, window: &mut Window, cx: &mut App) -> impl IntoElement {
let marks: Vec<AnyElement> = (self.items.iter().enumerate())
.map(|(ix, (_, state))| {
step_mark(
(self.id.clone(), format!("item-{ix}")).into(),
*state,
window,
cx,
)
})
.collect();
let theme = cx.theme();
let colors = theme.colors.clone();
let done = self
.items
.iter()
.filter(|(_, state)| *state == StepState::Done)
.count();
div()
.w_full()
.flex()
.flex_col()
.gap_2()
.text_size(theme.text_size(TextSize::Sm))
.child(
div()
.flex()
.items_center()
.gap_2()
.child(
div()
.flex_1()
.min_w_0()
.font_weight(FontWeight::MEDIUM)
.child(Ellipsis::new(self.title)),
)
.child(
tabular(div().flex_none().text_color(colors.fg_subtle))
.child(format!("{done} of {}", self.items.len())),
),
)
.children(
self.items
.into_iter()
.zip(marks)
.map(|((label, state), mark)| {
div().flex().items_center().gap_2().child(mark).child(
div()
.flex_1()
.min_w_0()
.text_color(match state {
StepState::Waiting => colors.fg_muted,
StepState::Working => colors.fg,
StepState::Done => colors.fg_subtle,
StepState::Failed => Severity::Danger.color(&colors),
})
.when(state == StepState::Done, |text| text.line_through())
.child(label),
)
}),
)
}
}
/// Where an agent stands.
#[derive(Clone, Copy, Debug, PartialEq, Eq)]
pub enum AgentState {
Planning,
Working,
Waiting,
Done,
Failed,
}
impl AgentState {
pub fn label(self) -> &'static str {
match self {
Self::Planning => "Planning",
Self::Working => "Working",
Self::Waiting => "Waiting for you",
Self::Done => "Done",
Self::Failed => "Failed",
}
}
}
/// A pill that says where an agent stands, moving while it plans or works.
#[derive(IntoElement)]
pub struct AgentStatus {
id: ElementId,
state: AgentState,
}
impl AgentStatus {
pub fn new(id: impl Into<ElementId>, state: AgentState) -> Self {
Self {
id: id.into(),
state,
}
}
}
impl RenderOnce for AgentStatus {
fn render(self, _: &mut Window, cx: &mut App) -> impl IntoElement {
let theme = cx.theme();
let colors = theme.colors.clone();
let tone = match self.state {
AgentState::Planning | AgentState::Working => Severity::Info,
AgentState::Waiting => Severity::Warning,
AgentState::Done => Severity::Success,
AgentState::Failed => Severity::Danger,
};
let ink = tone.color(&colors);
let mark = match self.state {
AgentState::Planning | AgentState::Working => Spinner::new((self.id.clone(), "mark"))
.size(IconSize::Xs)
.color(ink)
.into_any_element(),
AgentState::Waiting => Icon::new(IconName::Hand)
.size(IconSize::Xs)
.color(ink)
.into_any_element(),
AgentState::Done => Icon::new(IconName::Check)
.size(IconSize::Xs)
.color(ink)
.into_any_element(),
AgentState::Failed => Icon::new(IconName::X)
.size(IconSize::Xs)
.color(ink)
.into_any_element(),
};
div()
.flex()
.items_center()
.gap_1p5()
.px_2()
.py_0p5()
.rounded_full()
.bg(tone.subtle(&colors))
.text_size(theme.text_size(TextSize::Xs))
.font_weight(FontWeight::MEDIUM)
.text_color(ink)
.child(mark)
.child(self.state.label())
}
}
/// How far an agent has come: the step at work, how many are done of how many, the time so far, and a bar split by step.
#[derive(IntoElement)]
pub struct AgentProgress {
id: ElementId,
current: SharedString,
done: usize,
total: usize,
elapsed: Option<Duration>,
}
impl AgentProgress {
pub fn new(
id: impl Into<ElementId>,
current: impl Into<SharedString>,
done: usize,
total: usize,
) -> Self {
assert!(total > 0 && done <= total, "progress of {done} in {total}");
Self {
id: id.into(),
current: current.into(),
done,
total,
elapsed: None,
}
}
pub fn elapsed(mut self, elapsed: Duration) -> Self {
self.elapsed = Some(elapsed);
self
}
}
impl RenderOnce for AgentProgress {
fn render(self, _: &mut Window, cx: &mut App) -> impl IntoElement {
let theme = cx.theme();
let colors = theme.colors.clone();
div()
.w_full()
.flex()
.flex_col()
.gap_2()
.text_size(theme.text_size(TextSize::Sm))
.child(
div()
.flex()
.items_center()
.gap_2()
.child(
div()
.flex_1()
.min_w_0()
.text_color(colors.fg)
.child(Ellipsis::new(self.current)),
)
.child(
tabular(div().flex_none().text_color(colors.fg_subtle))
.child(format!("{} of {}", self.done, self.total)),
)
.children(self.elapsed.map(|spent| {
tabular(div().flex_none().text_color(colors.fg_subtle)).child(took(spent))
})),
)
.child(
ProgressBar::new((self.id, "bar"), self.done as f32 / self.total as f32)
.segments(self.total),
)
}
}
+7 -1
View File
@@ -3,7 +3,7 @@ use gpui::{
TestAppContext, VisualTestContext, Window, div,
};
use super::{Permission, PermissionPrompt, ToolApprovalDialog};
use super::{AgentProgress, Permission, PermissionPrompt, ToolApprovalDialog};
use crate::{forms, primitives::FocusNext, theme::Theme};
/// An approval dialog while open, and the answers it gave.
@@ -123,3 +123,9 @@ fn the_prompt_walks_deny_always_then_once(cx: &mut TestAppContext) {
[Permission::Once]
);
}
#[test]
#[should_panic(expected = "progress of 6 in 5")]
fn progress_past_its_total_fails_loud() {
let _ = AgentProgress::new("progress", "Writing", 6, 5);
}
+2 -1
View File
@@ -98,6 +98,7 @@ impl RenderOnce for ToolCallCard {
let open = *state.read(cx);
let opens = self.arguments.is_some() || self.result.is_some();
let failed = self.status == StepState::Failed;
let mark = step_mark((self.id.clone(), "mark").into(), self.status, window, cx);
let theme = cx.theme();
let colors = theme.colors.clone();
let label = |text: &'static str| {
@@ -120,7 +121,7 @@ impl RenderOnce for ToolCallCard {
opens.then_some(state),
cx,
)
.child(step_mark((self.id.clone(), "mark").into(), self.status, cx))
.child(mark)
.child(
div()
.min_w_0()