diff --git a/frontend/app/components/assistant-ui/thread.tsx b/frontend/app/components/assistant-ui/thread.tsx
index 592f9ca..14d4b01 100644
--- a/frontend/app/components/assistant-ui/thread.tsx
+++ b/frontend/app/components/assistant-ui/thread.tsx
@@ -384,6 +384,7 @@ const Composer: FC = () => {
 const ComposerAction: FC = () => {
 	const runtimeRunning = useAuiState((s) => s.thread.isRunning);
 	const replayedRun = useReplayedRunState();
+	const cancelSessionId = replayedRun.sessionId;
 	return (
 		<div className="aui-composer-action-wrapper relative flex items-center justify-between">
 			<div className="flex items-center gap-1">
@@ -414,6 +415,10 @@ const ComposerAction: FC = () => {
 						size="icon"
 						className="aui-composer-cancel size-8 rounded-full"
 						aria-label="Stop generating"
+						onClick={() => {
+							if (!cancelSessionId) return;
+							void cancelLatestRun(cancelSessionId).catch(() => undefined);
+						}}
 					>
 						<SquareIcon className="aui-composer-cancel-icon size-3 fill-current" />
 					</Button>