modelcontextprotocol/inspector
Watch
1
0
Fork
You've already forked inspector
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 2

refactor(web): sweep AGENTS.md TypeScript + Mantine rule violations (#1771)

Browse source 
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:
Cliff Hall 2026-07-25 11:38:49 -04:00 • committed by GitHub
commit da37692485
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 1567 additions and 991 deletions
Download patch file Download diff file Expand all files Collapse all files

36
clients/web/src/App.css
View file

@ -266,15 +266,6 @@ body {
}
}
@keyframes inspector-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* Both motions travel downward: enter descends from above into place, exit
descends from place to below — used for the header crossfade (#1450). */
@keyframes inspector-fade-slide-in {
@ -318,10 +309,6 @@ body {
animation: inspector-pulse 1.5s ease-in-out infinite;
}
.inspector-spin {
animation: inspector-spin 1s linear infinite;
}
/* Applied (via the `tabGlow` Text variant) to a tab label; the glow starts full
and fades, running only while `data-glow="on"` on a freshly-appeared tab. */
.tab-glow[data-glow="on"] {
@ -343,13 +330,6 @@ body {
animation: inspector-fade-slide-out 300ms ease both;
}
/* The title and tab bar additionally share one grid cell so one replaces the
other in place during the center crossfade. */
.header-stack-cell {
grid-area: 1 / 1;
place-self: center;
}
/* Honor reduced-motion for the header animations this PR adds (#1450): skip the
fade/slide and the new-tab glow, leaving the elements at their resting state.
Selectors match the originals' specificity so they win inside the query. */
@ -528,12 +508,6 @@ body {
background-color: var(--mantine-primary-color-light-hover);
}
/* ── Grid alignment ─────────────────────────────────────── */
.grid-align-start {
align-items: start;
}
/* ── Markdown content (third-party HTML from react-markdown) ───── */
.markdown-content {
@ -583,16 +557,6 @@ body {
cursor: grabbing;
}
/*
* Sticky re-auth banner bar. Positioning (pos/top) and background are set via
* Mantine props on the Box; z-index and box-shadow have no Mantine style-prop
* shorthand, so they live here.
*/
.reauth-banner-bar {
z-index: 200;
box-shadow: var(--mantine-shadow-sm);
}
/*
* Draggable vertical divider between the primary screen area and the pinned
* monitoring column (#1616). The col-resize cursor, the hover/active accent,