Fix generator stop button not appearing

Author: celonymire

src/views/stress/message.ts

@@ -5,6 +5,7 @@ export enum WebviewMessageType {
 	STDIO = 1,
 	CLEAR = 2,
 	SHOW = 3,
+	RUNNING = 4,
 }
 export interface IStatusMessage {
 	type: WebviewMessageType.STATUS;
@@ -23,11 +24,16 @@ export interface IShowMessage {
 	type: WebviewMessageType.SHOW;
 	visible: boolean;
 }
+export interface IRunningMessage {
+	type: WebviewMessageType.RUNNING;
+	value: boolean;
+}
 export type WebviewMessage =
 	| IStatusMessage
 	| IStdioMessage
 	| IClearMessage
-	| IShowMessage;
+	| IShowMessage
+	| IRunningMessage;
 
 export enum ProviderMessageType {
 	LOADED = 0,

src/views/stress/provider/StressViewProvider.ts

@@ -189,6 +189,7 @@ export default class extends BaseViewProvider<ProviderMessage, WebviewMessage> {
 			}
 		}
 
+		super._postMessage({ type: WebviewMessageType.RUNNING, value: true });
 		for (let id = 0; id < 3; id++) {
 			super._postMessage({
 				type: WebviewMessageType.STATUS,
@@ -325,6 +326,7 @@ export default class extends BaseViewProvider<ProviderMessage, WebviewMessage> {
 				setTimeout(() => resolve(), delayBetweenTestcases),
 			);
 		}
+		super._postMessage({ type: WebviewMessageType.RUNNING, value: false });
 
 		if (!anyFailed && this._state[1].data.data !== this._state[2].data.data) {
 			this._state[1].status = Status.WA;

src/views/stress/webview/App.tsx

@@ -5,6 +5,7 @@ import { Status } from '~common/common';
 import { BLUE_COLOR, RED_COLOR } from '~common/webview';
 import { type PreactObservable, observable } from '~external/observable';
 import {
+	type IRunningMessage,
 	type IShowMessage,
 	type IStatusMessage,
 	type IStdioMessage,
@@ -26,6 +27,7 @@ const state: PreactObservable<IState[]> = observable([
 	{ data: '', status: Status.NA },
 ]);
 const showView = signal(true);
+const running = signal(false);
 
 const expand = (id: number) =>
 	postProviderMessage({ type: ProviderMessageType.VIEW, id });
@@ -47,6 +49,9 @@ window.addEventListener('message', (event: MessageEvent<WebviewMessage>) => {
 		case WebviewMessageType.SHOW:
 			handleShow(event.data);
 			break;
+		case WebviewMessageType.RUNNING:
+			handleRunning(event.data);
+			break;
 	}
 });
 
@@ -71,14 +76,18 @@ function handleShow({ visible }: IShowMessage) {
 	showView.value = visible;
 }
 
+function handleRunning({ value }: IRunningMessage) {
+	running.value = value;
+}
+
 export default function App() {
 	useEffect(
 		() => postProviderMessage({ type: ProviderMessageType.LOADED }),
 		[],
 	);
 
 	const button = useComputed(() => {
-		if (state[1].status === Status.RUNNING)
+		if (running.value)
 			return (
 				<button
 					type="button"