story-kit: merge 86_story_show_live_activity_status_instead_of_static_thinking_indicator_in_chat
This commit is contained in:
@@ -50,7 +50,8 @@ export type WsResponse =
|
||||
request_id: string;
|
||||
tool_name: string;
|
||||
tool_input: Record<string, unknown>;
|
||||
};
|
||||
}
|
||||
| { type: "tool_activity"; tool_name: string };
|
||||
|
||||
export interface ProviderConfig {
|
||||
provider: string;
|
||||
@@ -260,6 +261,7 @@ export class ChatWebSocket {
|
||||
toolName: string,
|
||||
toolInput: Record<string, unknown>,
|
||||
) => void;
|
||||
private onActivity?: (toolName: string) => void;
|
||||
private connected = false;
|
||||
private closeTimer?: number;
|
||||
private wsPath = DEFAULT_WS_PATH;
|
||||
@@ -302,6 +304,7 @@ export class ChatWebSocket {
|
||||
data.tool_name,
|
||||
data.tool_input,
|
||||
);
|
||||
if (data.type === "tool_activity") this.onActivity?.(data.tool_name);
|
||||
} catch (err) {
|
||||
this.onError?.(String(err));
|
||||
}
|
||||
@@ -341,6 +344,7 @@ export class ChatWebSocket {
|
||||
toolName: string,
|
||||
toolInput: Record<string, unknown>,
|
||||
) => void;
|
||||
onActivity?: (toolName: string) => void;
|
||||
},
|
||||
wsPath = DEFAULT_WS_PATH,
|
||||
) {
|
||||
@@ -350,6 +354,7 @@ export class ChatWebSocket {
|
||||
this.onError = handlers.onError;
|
||||
this.onPipelineState = handlers.onPipelineState;
|
||||
this.onPermissionRequest = handlers.onPermissionRequest;
|
||||
this.onActivity = handlers.onActivity;
|
||||
this.wsPath = wsPath;
|
||||
this.shouldReconnect = true;
|
||||
|
||||
|
||||
@@ -14,6 +14,23 @@ const { useCallback, useEffect, useRef, useState } = React;
|
||||
|
||||
const NARROW_BREAKPOINT = 900;
|
||||
|
||||
function formatToolActivity(toolName: string): string {
|
||||
switch (toolName) {
|
||||
case "read_file":
|
||||
return "Reading file...";
|
||||
case "write_file":
|
||||
return "Writing file...";
|
||||
case "list_directory":
|
||||
return "Listing directory...";
|
||||
case "search_files":
|
||||
return "Searching files...";
|
||||
case "exec_shell":
|
||||
return "Executing command...";
|
||||
default:
|
||||
return `Using ${toolName}...`;
|
||||
}
|
||||
}
|
||||
|
||||
interface ChatProps {
|
||||
projectPath: string;
|
||||
onCloseProject: () => void;
|
||||
@@ -38,6 +55,7 @@ export function Chat({ projectPath, onCloseProject }: ChatProps) {
|
||||
merge: [],
|
||||
});
|
||||
const [claudeSessionId, setClaudeSessionId] = useState<string | null>(null);
|
||||
const [activityStatus, setActivityStatus] = useState<string | null>(null);
|
||||
const [permissionRequest, setPermissionRequest] = useState<{
|
||||
requestId: string;
|
||||
toolName: string;
|
||||
@@ -159,6 +177,7 @@ export function Chat({ projectPath, onCloseProject }: ChatProps) {
|
||||
const last = history[history.length - 1];
|
||||
if (last?.role === "assistant" && !last.tool_calls) {
|
||||
setLoading(false);
|
||||
setActivityStatus(null);
|
||||
}
|
||||
},
|
||||
onSessionId: (sessionId) => {
|
||||
@@ -167,6 +186,7 @@ export function Chat({ projectPath, onCloseProject }: ChatProps) {
|
||||
onError: (message) => {
|
||||
console.error("WebSocket error:", message);
|
||||
setLoading(false);
|
||||
setActivityStatus(null);
|
||||
},
|
||||
onPipelineState: (state) => {
|
||||
setPipeline(state);
|
||||
@@ -174,6 +194,9 @@ export function Chat({ projectPath, onCloseProject }: ChatProps) {
|
||||
onPermissionRequest: (requestId, toolName, toolInput) => {
|
||||
setPermissionRequest({ requestId, toolName, toolInput });
|
||||
},
|
||||
onActivity: (toolName) => {
|
||||
setActivityStatus(formatToolActivity(toolName));
|
||||
},
|
||||
});
|
||||
|
||||
return () => {
|
||||
@@ -248,6 +271,7 @@ export function Chat({ projectPath, onCloseProject }: ChatProps) {
|
||||
}
|
||||
|
||||
setLoading(false);
|
||||
setActivityStatus(null);
|
||||
} catch (e) {
|
||||
console.error("Failed to cancel chat:", e);
|
||||
}
|
||||
@@ -276,6 +300,7 @@ export function Chat({ projectPath, onCloseProject }: ChatProps) {
|
||||
}
|
||||
setLoading(true);
|
||||
setStreamingContent("");
|
||||
setActivityStatus(null);
|
||||
|
||||
try {
|
||||
const provider = isClaudeCode
|
||||
@@ -352,6 +377,7 @@ export function Chat({ projectPath, onCloseProject }: ChatProps) {
|
||||
setMessages([]);
|
||||
setStreamingContent("");
|
||||
setLoading(false);
|
||||
setActivityStatus(null);
|
||||
setClaudeSessionId(null);
|
||||
}
|
||||
};
|
||||
@@ -644,7 +670,9 @@ export function Chat({ projectPath, onCloseProject }: ChatProps) {
|
||||
marginTop: "10px",
|
||||
}}
|
||||
>
|
||||
<span className="pulse">Thinking...</span>
|
||||
<span className="pulse">
|
||||
{activityStatus ?? "Thinking..."}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
<div ref={messagesEndRef} />
|
||||
|
||||
@@ -75,6 +75,10 @@ enum WsResponse {
|
||||
tool_name: String,
|
||||
tool_input: serde_json::Value,
|
||||
},
|
||||
/// The agent started assembling a tool call; shows live status in the UI.
|
||||
ToolActivity {
|
||||
tool_name: String,
|
||||
},
|
||||
}
|
||||
|
||||
impl From<WatcherEvent> for WsResponse {
|
||||
@@ -168,6 +172,7 @@ pub async fn ws_handler(ws: WebSocket, ctx: Data<&Arc<AppContext>>) -> impl poem
|
||||
Ok(WsRequest::Chat { messages, config }) => {
|
||||
let tx_updates = tx.clone();
|
||||
let tx_tokens = tx.clone();
|
||||
let tx_activity = tx.clone();
|
||||
let ctx_clone = ctx.clone();
|
||||
let perm_tx = perm_req_tx.clone();
|
||||
|
||||
@@ -188,6 +193,11 @@ pub async fn ws_handler(ws: WebSocket, ctx: Data<&Arc<AppContext>>) -> impl poem
|
||||
content: token.to_string(),
|
||||
});
|
||||
},
|
||||
move |tool_name: &str| {
|
||||
let _ = tx_activity.send(WsResponse::ToolActivity {
|
||||
tool_name: tool_name.to_string(),
|
||||
});
|
||||
},
|
||||
Some(perm_tx),
|
||||
);
|
||||
tokio::pin!(chat_fut);
|
||||
|
||||
@@ -176,13 +176,15 @@ pub fn set_anthropic_api_key(store: &dyn StoreOps, api_key: String) -> Result<()
|
||||
set_anthropic_api_key_impl(store, &api_key)
|
||||
}
|
||||
|
||||
pub async fn chat<F, U>(
|
||||
#[allow(clippy::too_many_arguments)]
|
||||
pub async fn chat<F, U, A>(
|
||||
messages: Vec<Message>,
|
||||
config: ProviderConfig,
|
||||
state: &SessionState,
|
||||
store: &dyn StoreOps,
|
||||
mut on_update: F,
|
||||
mut on_token: U,
|
||||
mut on_activity: A,
|
||||
permission_tx: Option<
|
||||
tokio::sync::mpsc::UnboundedSender<
|
||||
crate::llm::providers::claude_code::PermissionReqMsg,
|
||||
@@ -192,6 +194,7 @@ pub async fn chat<F, U>(
|
||||
where
|
||||
F: FnMut(&[Message]) + Send,
|
||||
U: FnMut(&str) + Send,
|
||||
A: FnMut(&str) + Send,
|
||||
{
|
||||
use crate::llm::providers::anthropic::AnthropicProvider;
|
||||
use crate::llm::providers::ollama::OllamaProvider;
|
||||
@@ -322,6 +325,7 @@ where
|
||||
tools,
|
||||
&mut cancel_rx,
|
||||
|token| on_token(token),
|
||||
|tool_name| on_activity(tool_name),
|
||||
)
|
||||
.await
|
||||
.map_err(|e| format!("Anthropic Error: {e}"))?
|
||||
|
||||
@@ -156,16 +156,18 @@ impl AnthropicProvider {
|
||||
.join("\n\n")
|
||||
}
|
||||
|
||||
pub async fn chat_stream<F>(
|
||||
pub async fn chat_stream<F, A>(
|
||||
&self,
|
||||
model: &str,
|
||||
messages: &[Message],
|
||||
tools: &[ToolDefinition],
|
||||
cancel_rx: &mut Receiver<bool>,
|
||||
mut on_token: F,
|
||||
mut on_activity: A,
|
||||
) -> Result<CompletionResponse, String>
|
||||
where
|
||||
F: FnMut(&str),
|
||||
A: FnMut(&str),
|
||||
{
|
||||
let anthropic_messages = Self::convert_messages(messages);
|
||||
let anthropic_tools = Self::convert_tools(tools);
|
||||
@@ -257,6 +259,7 @@ impl AnthropicProvider {
|
||||
{
|
||||
let id = content_block["id"].as_str().unwrap_or("").to_string();
|
||||
let name = content_block["name"].as_str().unwrap_or("").to_string();
|
||||
on_activity(&name);
|
||||
current_tool_use = Some((id, name, String::new()));
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user