refactor(web): sweep AGENTS.md TypeScript + Mantine rule violations (#1771)
Codebase-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.
This commit is contained in:
parent
8aba3122c5
commit
da37692485
1 changed files with 1567 additions and 991 deletions
|
|
@ -6,6 +6,23 @@ import type {
|
|||
} from "@inspector/core/mcp/types.js";
|
||||
import { MessageDirectionFilter } from "../MessageDirectionFilter/MessageDirectionFilter";
|
||||
|
||||
const SearchInput = TextInput.withProps({
|
||||
placeholder: "Search...",
|
||||
rightSectionPointerEvents: "auto",
|
||||
});
|
||||
|
||||
// h5 (not h6) so it sits one level below the screen's h4 heading — avoids an axe
|
||||
// `heading-order` skip; `size="h6"` keeps the small visual size.
|
||||
const MethodFilterTitle = Title.withProps({
|
||||
order: 5,
|
||||
size: "h6",
|
||||
});
|
||||
|
||||
const MethodSelect = Select.withProps({
|
||||
placeholder: "All methods",
|
||||
clearable: true,
|
||||
});
|
||||
|
||||
export interface ProtocolControlsProps {
|
||||
searchText: string;
|
||||
methodFilter?: MessageMethod;
|
||||
|
|
@ -30,29 +47,21 @@ export function ProtocolControls({
|
|||
return (
|
||||
<Stack gap="md">
|
||||
<Title order={4}>Protocol</Title>
|
||||
<TextInput
|
||||
placeholder="Search..."
|
||||
<SearchInput
|
||||
value={searchText}
|
||||
onChange={(event) => onSearchChange(event.currentTarget.value)}
|
||||
rightSectionPointerEvents="auto"
|
||||
rightSection={
|
||||
searchText ? <ClearButton onClick={() => onSearchChange("")} /> : null
|
||||
}
|
||||
/>
|
||||
|
||||
{/* h5 (not h6) so it sits one level below the screen's h4 heading — avoids
|
||||
an axe `heading-order` skip; `size="h6"` keeps the small visual size. */}
|
||||
<Title order={5} size="h6">
|
||||
Filter by Method
|
||||
</Title>
|
||||
<Select
|
||||
placeholder="All methods"
|
||||
<MethodFilterTitle>Filter by Method</MethodFilterTitle>
|
||||
<MethodSelect
|
||||
data={availableMethods}
|
||||
value={methodFilter ?? null}
|
||||
onChange={(value) =>
|
||||
onMethodFilterChange((value as MessageMethod | null) ?? undefined)
|
||||
}
|
||||
clearable
|
||||
/>
|
||||
|
||||
<MessageDirectionFilter
|
||||
|
|
|
|||
Loading…
Reference in a new issue