fix(frontend): wire currentPhase to WorkflowBar (normalized) + WidgetHost error handling
- sessionStore.applyEvent: on ui_request set currentPhase normalized from the descriptor's phase to its short id (e.g. "F4_schema_linking" -> "F4"), so WorkflowBar actually highlights the active phase; falls back to the existing phase when the descriptor has none. setPhase kept for resume/getSession. - Add pushToast store action; WidgetHost wraps postResponse in try/catch, pushes an error toast and keeps the widget pending on failure (clearPending only on success) so the user can retry. - Tests: store currentPhase normalization + no-phase passthrough + pushToast; new WorkflowBar.test.tsx asserting the matching phase is highlighted. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -6,10 +6,25 @@ import type { UiResponse } from "../api/types";
|
||||
export function WidgetHost({ sessionId }: { sessionId: string | null }) {
|
||||
const pending = useSessionStore((s) => s.pendingWidget);
|
||||
const clearPending = useSessionStore((s) => s.clearPending);
|
||||
const pushToast = useSessionStore((s) => s.pushToast);
|
||||
if (!pending) return null;
|
||||
const Renderer = resolve(pending.widget);
|
||||
const onRespond = async (r: UiResponse) => {
|
||||
if (sessionId) await postResponse(sessionId, r);
|
||||
if (sessionId) {
|
||||
try {
|
||||
await postResponse(sessionId, r);
|
||||
} catch (err) {
|
||||
// Surface feedback and keep the widget pending so the user can retry.
|
||||
pushToast({
|
||||
level: "error",
|
||||
text:
|
||||
err instanceof Error
|
||||
? `Invio risposta fallito: ${err.message}`
|
||||
: "Invio risposta fallito.",
|
||||
});
|
||||
return;
|
||||
}
|
||||
}
|
||||
clearPending();
|
||||
};
|
||||
return <Renderer descriptor={pending} onRespond={onRespond} />;
|
||||
|
||||
@@ -0,0 +1,22 @@
|
||||
// frontend/src/shell/WorkflowBar.test.tsx
|
||||
import { render, screen } from "@testing-library/react";
|
||||
import { WorkflowBar } from "./WorkflowBar";
|
||||
import { useSessionStore } from "../store/sessionStore";
|
||||
|
||||
beforeEach(() => useSessionStore.getState().resetSession());
|
||||
|
||||
test("highlights the phase matching currentPhase", () => {
|
||||
useSessionStore.getState().setPhase("F4");
|
||||
render(<WorkflowBar />);
|
||||
expect(screen.getByTestId("phase-F4")).toHaveAttribute("data-active", "true");
|
||||
// Other phases are not highlighted.
|
||||
expect(screen.getByTestId("phase-F1")).toHaveAttribute("data-active", "false");
|
||||
expect(screen.getByTestId("phase-F8")).toHaveAttribute("data-active", "false");
|
||||
});
|
||||
|
||||
test("no phase highlighted when currentPhase is null", () => {
|
||||
render(<WorkflowBar />);
|
||||
for (const id of ["F1", "F2", "F3", "F4", "F5", "F6", "F7", "F8"]) {
|
||||
expect(screen.getByTestId(`phase-${id}`)).toHaveAttribute("data-active", "false");
|
||||
}
|
||||
});
|
||||
Reference in New Issue
Block a user