da37692485Codebase-wide sweep bringing the web client into strict compliance with the AGENTS.md TypeScript and Mantine/React conventions: ~170 inline 2+-static-prop elements extracted to named .withProps() constants across ~77 files, the AGENTS.md rule wording tightened to match (static-prop boundary + Accordion/Transition/data-*/Box exemptions), a real ScreenStage Box->Flex layout regression fixed (direction: column) with a Storybook regression guard, and an App.tsx double-cast tightened. Closes #1762.
67 lines
2.1 KiB
TypeScript
67 lines
2.1 KiB
TypeScript
import {
|
|
CloseButton,
|
|
Group,
|
|
Modal,
|
|
Stack,
|
|
Text,
|
|
Textarea,
|
|
} from "@mantine/core";
|
|
|
|
export interface OutputValidationModalProps {
|
|
opened: boolean;
|
|
onClose: () => void;
|
|
/** The app tool whose result failed output-schema validation. */
|
|
toolName?: string;
|
|
/** The full validation error message (one issue per line). */
|
|
message?: string;
|
|
}
|
|
|
|
const DetailModal = Modal.withProps({
|
|
withCloseButton: false,
|
|
size: "lg",
|
|
centered: true,
|
|
});
|
|
const HeaderRow = Group.withProps({
|
|
justify: "space-between",
|
|
wrap: "nowrap",
|
|
});
|
|
const DimText = Text.withProps({ size: "sm", c: "dimmed" });
|
|
const DetailsTextarea = Textarea.withProps({
|
|
"aria-label": "Validation details",
|
|
readOnly: true,
|
|
autosize: true,
|
|
minRows: 6,
|
|
maxRows: 18,
|
|
});
|
|
|
|
/**
|
|
* Shows the full output-schema validation error for an MCP App tool result.
|
|
* The inspector still renders the app (the result is forwarded verbatim to the
|
|
* view), but the result violates the tool's declared `outputSchema`, so strict
|
|
* MCP clients may refuse to render it — this modal surfaces the details a
|
|
* server developer needs to fix it. Opened from the warning toast.
|
|
*/
|
|
export function OutputValidationModal({
|
|
opened,
|
|
onClose,
|
|
toolName,
|
|
message,
|
|
}: OutputValidationModalProps) {
|
|
return (
|
|
<DetailModal opened={opened} onClose={onClose}>
|
|
<Stack gap="md">
|
|
<HeaderRow>
|
|
{/* `Modal.Title` names the dialog (wires `aria-labelledby`). */}
|
|
<Modal.Title flex={1}>Output schema validation</Modal.Title>
|
|
<CloseButton aria-label="Close" onClick={onClose} />
|
|
</HeaderRow>
|
|
<DimText>
|
|
{toolName
|
|
? `"${toolName}" returned structuredContent that does not match its declared outputSchema. The inspector renders the app anyway, but strict MCP clients may refuse to display it.`
|
|
: "The tool result's structuredContent does not match the declared outputSchema. The inspector renders the app anyway, but strict MCP clients may refuse to display it."}
|
|
</DimText>
|
|
<DetailsTextarea value={message ?? ""} />
|
|
</Stack>
|
|
</DetailModal>
|
|
);
|
|
}
|