dave/storkit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 7 Wiki Activity

story-kit: done 240_story_btw_side_question_slash_command

Browse Source 
Implement /btw side question slash command — lets users ask quick
questions from conversation context without disrupting the main chat.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Dave
2026-03-14 18:09:30 +00:00
parent 6a7baa4a15
commit 3a430dfaa2
5 changed files with 394 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
frontend/src/api/client.ts
View File

@@ -13,7 +13,13 @@ export type WsRequest =
approved: boolean;
always_allow: boolean;
}
| { type: "ping" };
| { type: "ping" }
| {
type: "side_question";
question: string;
context_messages: Message[];
config: ProviderConfig;
};
export interface AgentAssignment {
agent_name: string;
@@ -73,7 +79,11 @@ export type WsResponse =
/** Sent on connect when the project still needs onboarding (specs are placeholders). */
| { type: "onboarding_status"; needs_onboarding: boolean }
/** Streaming thinking token from an extended-thinking block, separate from regular text. */
| { type: "thinking_token"; content: string };
| { type: "thinking_token"; content: string }
/** Streaming token from a /btw side question response. */
| { type: "side_question_token"; content: string }
/** Final signal that the /btw side question has been fully answered. */
| { type: "side_question_done"; response: string };
export interface ProviderConfig {
provider: string;
@@ -324,6 +334,8 @@ export class ChatWebSocket {
private onAgentConfigChanged?: () => void;
private onAgentStateChanged?: () => void;
private onOnboardingStatus?: (needsOnboarding: boolean) => void;
private onSideQuestionToken?: (content: string) => void;
private onSideQuestionDone?: (response: string) => void;
private connected = false;
private closeTimer?: number;
private wsPath = DEFAULT_WS_PATH;
@@ -405,6 +417,10 @@ export class ChatWebSocket {
if (data.type === "agent_state_changed") this.onAgentStateChanged?.();
if (data.type === "onboarding_status")
this.onOnboardingStatus?.(data.needs_onboarding);
if (data.type === "side_question_token")
this.onSideQuestionToken?.(data.content);
if (data.type === "side_question_done")
this.onSideQuestionDone?.(data.response);
if (data.type === "pong") {
window.clearTimeout(this.heartbeatTimeout);
this.heartbeatTimeout = undefined;
@@ -458,6 +474,8 @@ export class ChatWebSocket {
onAgentConfigChanged?: () => void;
onAgentStateChanged?: () => void;
onOnboardingStatus?: (needsOnboarding: boolean) => void;
onSideQuestionToken?: (content: string) => void;
onSideQuestionDone?: (response: string) => void;
},
wsPath = DEFAULT_WS_PATH,
) {
@@ -473,6 +491,8 @@ export class ChatWebSocket {
this.onAgentConfigChanged = handlers.onAgentConfigChanged;
this.onAgentStateChanged = handlers.onAgentStateChanged;
this.onOnboardingStatus = handlers.onOnboardingStatus;
this.onSideQuestionToken = handlers.onSideQuestionToken;
this.onSideQuestionDone = handlers.onSideQuestionDone;
this.wsPath = wsPath;
this.shouldReconnect = true;
@@ -498,6 +518,19 @@ export class ChatWebSocket {
this.send({ type: "chat", messages, config });
}
sendSideQuestion(
question: string,
contextMessages: Message[],
config: ProviderConfig,
) {
this.send({
type: "side_question",
question,
context_messages: contextMessages,
config,
});
}
cancel() {
this.send({ type: "cancel" });
}

47
frontend/src/components/Chat.tsx
View File

@@ -12,6 +12,7 @@ import type { ChatInputHandle } from "./ChatInput";
import { ChatInput } from "./ChatInput";
import { LozengeFlyProvider } from "./LozengeFlyContext";
import { MessageItem } from "./MessageItem";
import { SideQuestionOverlay } from "./SideQuestionOverlay";
import { StagePanel } from "./StagePanel";
import { WorkItemDetailPanel } from "./WorkItemDetailPanel";
@@ -197,6 +198,11 @@ export function Chat({ projectPath, onCloseProject }: ChatProps) {
const [queuedMessages, setQueuedMessages] = useState<
{ id: string; text: string }[]
>([]);
const [sideQuestion, setSideQuestion] = useState<{
question: string;
response: string;
loading: boolean;
} | null>(null);
// Ref so stale WebSocket callbacks can read the current queued messages
const queuedMessagesRef = useRef<{ id: string; text: string }[]>([]);
const queueIdCounterRef = useRef(0);
@@ -360,6 +366,16 @@ export function Chat({ projectPath, onCloseProject }: ChatProps) {
onOnboardingStatus: (onboarding: boolean) => {
setNeedsOnboarding(onboarding);
},
onSideQuestionToken: (content) => {
setSideQuestion((prev) =>
prev ? { ...prev, response: prev.response + content } : prev,
);
},
onSideQuestionDone: (response) => {
setSideQuestion((prev) =>
prev ? { ...prev, response, loading: false } : prev,
);
},
});
return () => {
@@ -459,6 +475,28 @@ export function Chat({ projectPath, onCloseProject }: ChatProps) {
const sendMessage = async (messageText: string) => {
if (!messageText.trim()) return;
// /btw <question> — answered from context without disrupting main chat
const btwMatch = messageText.match(/^\/btw\s+(.+)/s);
if (btwMatch) {
const question = btwMatch[1].trim();
setSideQuestion({ question, response: "", loading: true });
const isClaudeCode = model === "claude-code-pty";
const provider = isClaudeCode
? "claude-code"
: model.startsWith("claude-")
? "anthropic"
: "ollama";
const config: ProviderConfig = {
provider,
model,
base_url: "http://localhost:11434",
enable_tools: false,
};
wsRef.current?.sendSideQuestion(question, messages, config);
return;
}
// Agent is busy — queue the message instead of dropping it
if (loading) {
const newItem = {
@@ -1154,6 +1192,15 @@ export function Chat({ projectPath, onCloseProject }: ChatProps) {
</div>
</div>
)}
{sideQuestion && (
<SideQuestionOverlay
question={sideQuestion.question}
response={sideQuestion.response}
loading={sideQuestion.loading}
onDismiss={() => setSideQuestion(null)}
/>
)}
</div>
);
}

159
frontend/src/components/SideQuestionOverlay.tsx Normal file
View File

@@ -0,0 +1,159 @@
import * as React from "react";
import Markdown from "react-markdown";
const { useEffect, useRef } = React;
interface SideQuestionOverlayProps {
question: string;
/** Streaming response text. Empty while loading. */
response: string;
loading: boolean;
onDismiss: () => void;
}
/**
* Dismissible overlay that shows a /btw side question and its streamed response.
* The question and response are NOT part of the main conversation history.
* Dismiss with Escape, Enter, or Space.
*/
export function SideQuestionOverlay({
question,
response,
loading,
onDismiss,
}: SideQuestionOverlayProps) {
const dismissRef = useRef(onDismiss);
dismissRef.current = onDismiss;
useEffect(() => {
const handler = (e: KeyboardEvent) => {
if (e.key === "Escape" || e.key === "Enter" || e.key === " ") {
e.preventDefault();
dismissRef.current();
}
};
window.addEventListener("keydown", handler);
return () => window.removeEventListener("keydown", handler);
}, []);
return (
// biome-ignore lint/a11y/noStaticElementInteractions: backdrop dismiss is supplementary; keyboard handled via window keydown
// biome-ignore lint/a11y/useKeyWithClickEvents: keyboard dismiss handled via window keydown listener
<div
data-testid="side-question-overlay"
onClick={onDismiss}
style={{
position: "fixed",
inset: 0,
background: "rgba(0,0,0,0.55)",
display: "flex",
alignItems: "center",
justifyContent: "center",
zIndex: 1000,
}}
>
{/* biome-ignore lint/a11y/useKeyWithClickEvents: stop-propagation only; no real interaction */}
{/* biome-ignore lint/a11y/noStaticElementInteractions: stop-propagation only; no real interaction */}
<div
data-testid="side-question-panel"
onClick={(e) => e.stopPropagation()}
style={{
background: "#2f2f2f",
border: "1px solid #444",
borderRadius: "12px",
padding: "24px",
maxWidth: "640px",
width: "90vw",
maxHeight: "60vh",
display: "flex",
flexDirection: "column",
gap: "16px",
boxShadow: "0 8px 32px rgba(0,0,0,0.5)",
}}
>
{/* Header */}
<div
style={{
display: "flex",
alignItems: "flex-start",
justifyContent: "space-between",
gap: "12px",
}}
>
<div>
<span
style={{
display: "block",
fontSize: "0.7rem",
fontWeight: 700,
letterSpacing: "0.08em",
textTransform: "uppercase",
color: "#a0d4a0",
marginBottom: "4px",
}}
>
/btw
</span>
<span
style={{
fontSize: "1rem",
color: "#ececec",
fontWeight: 500,
}}
>
{question}
</span>
</div>
<button
type="button"
onClick={onDismiss}
title="Dismiss (Escape, Enter, or Space)"
style={{
background: "none",
border: "none",
color: "#666",
cursor: "pointer",
fontSize: "1.1rem",
padding: "2px 6px",
borderRadius: "4px",
flexShrink: 0,
}}
>
✕
</button>
</div>
{/* Response area */}
<div
style={{
overflowY: "auto",
flex: 1,
color: "#ccc",
fontSize: "0.95rem",
lineHeight: "1.6",
}}
>
{loading && !response && (
<span style={{ color: "#666", fontStyle: "italic" }}>
Thinking…
</span>
)}
{response && <Markdown>{response}</Markdown>}
</div>
{/* Footer hint */}
{!loading && (
<div
style={{
fontSize: "0.75rem",
color: "#555",
textAlign: "center",
}}
>
Press Escape, Enter, or Space to dismiss
</div>
)}
</div>
</div>
);
}

76
server/src/http/ws.rs
View File

@@ -35,6 +35,14 @@ enum WsRequest {
/// Heartbeat ping from the client. The server responds with `Pong` so the
/// client can detect stale (half-closed) connections.
Ping,
/// A quick side question answered from current conversation context.
/// The question and response are NOT added to the conversation history
/// and no tool calls are made.
SideQuestion {
question: String,
context_messages: Vec<Message>,
config: chat::ProviderConfig,
},
}
#[derive(Serialize)]
@@ -116,6 +124,14 @@ enum WsResponse {
OnboardingStatus {
needs_onboarding: bool,
},
/// Streaming token from a `/btw` side question response.
SideQuestionToken {
content: String,
},
/// Final signal that the `/btw` side question has been fully answered.
SideQuestionDone {
response: String,
},
}
impl From<WatcherEvent> for Option<WsResponse> {
@@ -344,6 +360,33 @@ pub async fn ws_handler(ws: WebSocket, ctx: Data<&Arc<AppContext>>) -> impl poem
Ok(WsRequest::Ping) => {
let _ = tx.send(WsResponse::Pong);
}
Ok(WsRequest::SideQuestion { question, context_messages, config }) => {
let tx_side = tx.clone();
let store = ctx.store.clone();
tokio::spawn(async move {
let result = chat::side_question(
context_messages,
question,
config,
store.as_ref(),
|token| {
let _ = tx_side.send(WsResponse::SideQuestionToken {
content: token.to_string(),
});
},
).await;
match result {
Ok(response) => {
let _ = tx_side.send(WsResponse::SideQuestionDone { response });
}
Err(err) => {
let _ = tx_side.send(WsResponse::SideQuestionDone {
response: format!("Error: {err}"),
});
}
}
});
}
_ => {}
}
}
@@ -370,6 +413,39 @@ pub async fn ws_handler(ws: WebSocket, ctx: Data<&Arc<AppContext>>) -> impl poem
Ok(WsRequest::PermissionResponse { .. }) => {
// Permission responses outside an active chat are ignored.
}
Ok(WsRequest::SideQuestion {
question,
context_messages,
config,
}) => {
let tx_side = tx.clone();
let store = ctx.store.clone();
tokio::spawn(async move {
let result = chat::side_question(
context_messages,
question,
config,
store.as_ref(),
|token| {
let _ = tx_side.send(WsResponse::SideQuestionToken {
content: token.to_string(),
});
},
)
.await;
match result {
Ok(response) => {
let _ = tx_side
.send(WsResponse::SideQuestionDone { response });
}
Err(err) => {
let _ = tx_side.send(WsResponse::SideQuestionDone {
response: format!("Error: {err}"),
});
}
}
});
}
Err(err) => {
let _ = tx.send(WsResponse::Error {
message: format!("Invalid request: {err}"),

77
server/src/llm/chat.rs
View File

@@ -409,6 +409,83 @@ where
})
}
/// Answer a one-off side question using the existing conversation as context.
///
/// Unlike `chat`, this function:
/// - Does NOT perform tool calls.
/// - Does NOT modify the main conversation history.
/// - Does NOT touch the shared cancel signal.
/// - Performs a single LLM call and returns the response text.
pub async fn side_question<U>(
context_messages: Vec<Message>,
question: String,
config: ProviderConfig,
store: &dyn StoreOps,
mut on_token: U,
) -> Result<String, String>
where
U: FnMut(&str) + Send,
{
use crate::llm::providers::anthropic::AnthropicProvider;
use crate::llm::providers::ollama::OllamaProvider;
// Use a local cancel channel that is never cancelled, so the side question
// runs to completion independently of any main chat cancel signal.
// Keep `_cancel_tx` alive for the duration of the function so the channel
// stays open and `changed()` inside the providers does not spuriously fire.
let (_cancel_tx, cancel_rx) = tokio::sync::watch::channel(false);
let mut cancel_rx = cancel_rx;
cancel_rx.borrow_and_update();
let base_url = config
.base_url
.clone()
.unwrap_or_else(|| "http://localhost:11434".to_string());
let is_claude_code = config.provider == "claude-code";
let is_claude = !is_claude_code && config.model.starts_with("claude-");
// Build a minimal history: existing context + the side question.
let mut history = context_messages;
history.push(Message {
role: Role::User,
content: question,
tool_calls: None,
tool_call_id: None,
});
// No tools for side questions.
let tools: &[ToolDefinition] = &[];
let response = if is_claude {
let api_key = get_anthropic_api_key_impl(store)?;
let provider = AnthropicProvider::new(api_key);
provider
.chat_stream(
&config.model,
&history,
tools,
&mut cancel_rx,
|token| on_token(token),
|_tool_name| {},
)
.await
.map_err(|e| format!("Anthropic Error: {e}"))?
} else if is_claude_code {
return Err("Claude Code provider does not support side questions".to_string());
} else {
let provider = OllamaProvider::new(base_url);
provider
.chat_stream(&config.model, &history, tools, &mut cancel_rx, |token| {
on_token(token)
})
.await
.map_err(|e| format!("Ollama Error: {e}"))?
};
Ok(response.content.unwrap_or_default())
}
async fn execute_tool(call: &ToolCall, state: &SessionState) -> String {
use crate::io::{fs, search, shell};