console Setup › metadata admin: at an 820px-wide viewport the breadcrumb row overprints the type and badge chips ("All Metadata T…SECURITY Pe create-only P…")

Filing-gate category ③ — the maintainer's order in PM session session_016JB93R2KcQP4GgKaUnseVF, verbatim: 「按这 5 类开父单，派给 objectui 车道，以及：820px 宽度下面包屑重叠。* 每个新库首屏都弹时区设置。* Home 页的应用卡片不是链接，没法在新标签页打开。」

QA-source: objectstack-ai/objectstack#23104 · studio-authoring.permission-matrix-editor-ux · (observation outside its clauses, A4 narrow viewport)

Reader who acts: the objectui domain:ui execution seat (metadata admin header). Dedupe: semantic issue search on this repo, closed included, "metadata admin breadcrumb overlaps badges chips narrow viewport 820px header collision" — 4 hits, none this shape (nearest objectui#7244, closed: a record title chip collapsing at ~800px).

What happens

Seen by the browser-pass runner while measuring the permission matrix at a narrow viewport (1440 → 820 px wide, 900 high), stock showcase, admin: on the Setup metadata admin page for permission sets (/_console/apps/setup/metadata/permission?scope=environment), the breadcrumb row and the item's type / badge chips collide and overprint — the runner read the row as "All Metadata T…SECURITY Pe create-only P…". The matrix itself stays usable at that width (its own horizontal scroll works); only the header row breaks.

Where (objectui `1fb1ced36243`)

The metadata admin page header — packages/app-shell/src/views/metadata-admin/ResourceListPage.tsx and the header/breadcrumb it renders (the fixing seat confirms the exact component). Single observation, not scored against a clause: re-check at 820 px before fixing.

Expected

At narrow widths the breadcrumb truncates or wraps on its own line, and the chips move below it — nothing overprints.

Generated by Claude Code

Claim: PM loop round 5, next slot. The direction is the card's own: the maintainer's order it quotes (「820px 宽度下面包屑重叠。」) and its "Expected".

At narrow widths the breadcrumb truncates or wraps onto its own line, and the type and badge chips move below it.
Nothing overprints.
Session: session_01CsyMRsFJBKNEMa4oPY1b5z
Account: zhuangjianguo (the seat's linked user as GET /user answers it; the card's assignee)
Branch: claude/issue-12306-metadata-admin-header-narrow
Worktree: objectui-issue-12306
Domain: domain:ui
Seat: domain:ui#1
File surface: the metadata admin page header, read on objectui main 068a540 at 2026-10-13T07:44Z. Stop on a breach and explain it in the report.
The header: packages/app-shell/src/views/metadata-admin/PageShell.tsx. It is the shared chrome of every metadata admin page and has two header forms.
- The compact one-line header (when an item is named) is flex items-center gap-3 with no wrap: a min-w-0 breadcrumb nav, then shrink-0 badge, stats and action groups.
- The list page's hero header, below its own breadcrumb nav.
The card's page: ResourceListPage.tsx, read only, unless the measurement shows the collision is its own.
Co-located tests and a changeset.
⛔ No new export, spec key or i18n key unless the report justifies it.
⛔ The fix lands once, in the shared header, ⛔ not per page.
Container & model: S, mode:subagent, model: default tier — dispatch-gates --tier --repo objectstack-ai/objectui: "no path-derived mandate"
Clause-②: no
Clause-② reason:
Layout classes of an internal app-shell view.
No published type, export or accepted input moves, and none of the three contract surfaces is touched.
Responsibility: app-shell's metadata-admin PageShell header (a non-wrapping row whose shrink-0 chip, stat and action groups squeeze the breadcrumb) | none | every admin on a Setup metadata admin page at a narrow viewport; reported once by the browser-pass runner at 820 px on /_console/apps/setup/metadata/permission?scope=environment, not yet re-measured
Thread-read: none
Serial constraints cleared: read at 2026-10-13T07:44Z on objectui main 068a540.
No open PR touches views/metadata-admin/PageShell.tsx or ResourceListPage.tsx (objectui#12317, fix(data-objectstack): the connection state follows request outcomes after the first connect, so the header chip shows a mid-session outage (objectui#12295) #12316, fix(plugin-calendar,app-shell): quick-create hands an object it cannot satisfy to the full create form with the clicked day (objectui#12291) #12315, chore(deps): bump next from 16.3.6 to 16.3.8 #11845, build(deps): Bump next from 16.3.6 to 16.3.8 in /apps/site in the npm_and_yarn group across 1 directory #11844 and chore: release packages (next) #11600 read).
This seat's in-flight work shares no file: objectui#12316 (data-objectstack), the objectui#12305 dev (console/home/, app-launcher-renderer.tsx) and the objectui#12310 dev (components data-table).

Generated by Claude Code

os-dev-report

{
  "issue": 12306,
  "status": "done",
  "branch": "claude/issue-12306-metadata-admin-header-narrow",
  "pr": "https://github.com/objectstack-ai/objectui/pull/12321",
  "session": "session_01CsyMRsFJBKNEMa4oPY1b5z (the dispatching seat session; this dev ran as its subagent)",
  "premise_still_valid": true,
  "summary": "The overprint reproduces at 068a540, but on the item page, not on the page the card names. Measured in Chromium at 820x900. The compact one-line header that PageShell renders when an item is named (for example the permission set matrix editor, /_console/apps/setup/metadata/permission/showcase_contributor?scope=environment) left its min-w-0 breadcrumb nav 0px wide (code-shipped set) or 57px wide (writable set) for 230px of content. The breadcrumb's shrink-0 links then painted underneath the SECURITY and create-only chips and the subtitle: 6 and 5 overprinting text pairs. That is exactly the runner's \"All Metadata T…SECURITY Pe create-only P…\". The card's own URL, the list page, renders the hero header, which does not overprint at 820px. So PM mechanism assumption 2 is falsified on which page; the producer is still PageShell. Fix, in PageShell only: the compact row is now flex-wrap. Everything after the breadcrumb (chips, subtitle, stats, actions) is one flex-auto cluster, so it drops below the breadcrumb as a whole, and the breadcrumb keeps its own line, ellipsizing only the item name. Stats and actions use ml-auto (replacing the flex-1 spacer) and can wrap among themselves. This also fixes the 390px case, where History, Save and Clone to customize were pushed past the right edge and hidden. Screenshots are byte-identical before and after for every row that fits: list page at 390, 820, 1440 and 1920; writable set at 1440; both sets at 1920. The one wide-window change: a code-shipped set at 1440 (History plus Clone to customize) never fit on one row. It used to ellipsize the item name to 84 of 141px; it now wraps to two lines (see open_questions). Rendering: the verify skill's gallery does not reach PageShell and no backend was available, so a scratch, uncommitted Vite entry mounted the real PageShell in the real AppShell, Sidebar and useResponsiveSidebar geometry with the stock showcase permission props. Before/after JSON and PNGs are in this session's scratchpad under issue-12306/shots and before.json/after.json.",
  "tests": "All at HEAD 6476ffc. (1) Pin, new file PageShell.narrowHeader-12306.test.tsx, 5 cases. It pins the class contract: wrapping row; nav plus ONE cluster holding chips, subtitle, stats and actions; cluster flex-auto, not flex-1; breadcrumb min-w-0 with a truncating item name; stats and actions ml-auto, flex-wrap, justify-end. (2) The suite, through the verify lock (VERDICT command-exit 0): pnpm exec vitest run --maxWorkers=2 packages/app-shell/src/views/metadata-admin/ gave 'Test Files 478 passed (478)' and 'Tests 5435 passed | 1 skipped (5436)'. 478 equals git ls-files' count of test files under that directory, so the pin and every PageShell-rendering suite ran. (3) Ablation, from the committed state, through objectstack scripts/ablation-replace.mjs in wrap mode. The anchor hit x1 to x0 and the blob moved 4b737bc to c846610 (leg A) and to 2b00161 (leg B). Leg A restored the old row classes 'flex items-center gap-3 min-h-[44px]': 'Tests 1 failed | 4 passed (5)', failing case 'the header row is a wrapping flex row'. Leg B swapped flex-auto for flex-1 on the cluster: '1 failed | 4 passed', failing case the basis case. Each restore was proven: blob == HEAD 4b737bc, git diff HEAD empty. The pin imports ./PageShell from src (no dist path), so no rebuild leg applies. (4) Browser, before (068a540) and after (6476ffc's PageShell blob 4b737bc), Playwright Chromium /opt/pw-browsers/chromium, 900px high. At 820: code-shipped set went from 6 overprints and nav 0/230px to 0 overprints, with nav 376px and the item in full on 3 lines; writable set went from 5 overprints to 0 on 2 lines. At 390: 6 overprints and 6 boxes cut off became 0 and 0. At 1440 and 1920 the screenshots are byte-identical except the code-shipped set at 1440. The list page is byte-identical at every width.",
  "mcp_calls": "0",
  "api_writes": "2 REST writes via the scripts/pm fleet-write relay, landing as objectstack-fleet[bot]. (1) pr_create: dispatch POST /repos/objectstack-ai/objectstack/dispatches (run 38372013576, success). It executed POST /repos/objectstack-ai/objectui/pulls (draft) and POST /repos/objectstack-ai/objectui/issues/12321/assignees [zhuangjianguo]. Read-back: 9328 bytes sent, 9328 stored, identical. (2) This os-dev-report comment: post-stamped.mjs --comment=12306 (POST /repos/objectstack-ai/objectui/issues/12306/comments). Plus two git pushes (not REST): the empty-branch probe, then 6476ffc. No label write.",
  "open_questions": [
    {
      "question": "At a 1440px window, a code-shipped permission set's compact header (two stats, History, Clone to customize) does not fit on one row even before this change. Before, it stayed on one line by ellipsizing the item name (84 of 141px visible) and the subtitle, with 0 overprints. With this PR it wraps to two lines (header 57px to 79px) and shows the full name. This is the only wide-window visual change; the dispatch fence asks for none 'beyond what the fix needs'. Keep it?",
      "options": [
        "A: keep, and wrap whenever the row does not fit (this PR). Cost: one extra 22px line for code-shipped sets at roughly 1100 to 1180px content widths. No extra code.",
        "B: let a small shortfall ellipsize the item name before wrapping. The breadcrumb would declare a smaller line-breaking flex-basis and out-grow the cluster, which needs a magic grow ratio (grow-[N]). In a band of widths its shrink-0 type links could again be squeezed under the chips, unless the links are also made truncatable. Cost: about 5 class changes plus a second ablation; it reintroduces a threshold that differs by locale and by stats count."
      ],
      "recommendation": "A. Real need: the item name is what the page is about, and the old one-line form hid most of it. Long-term: one content-driven rule with no magic numbers, which holds for any stats count, action set or locale; B re-opens the same squeeze in a narrower band. AI error-proofing: not applicable (a layout class contract, no metadata or spec surface). No scope growth: A adds nothing; B adds a tuning knob. Defer to the seat if the fence is read strictly."
    }
  ],
  "out_of_scope_findings": [],
  "files_changed": [
    ".changeset/12306-metadata-admin-header-narrow.md",
    "packages/app-shell/src/views/metadata-admin/PageShell.narrowHeader-12306.test.tsx",
    "packages/app-shell/src/views/metadata-admin/PageShell.tsx"
  ],
  "line_budget": "3 files, +164 / -28 (068a540..6476ffc): PageShell.tsx +46/-28, pin test +107/-0, changeset +11/-0.",
  "gates": [
    "turbo run build --filter=@object-ui/app-shell^... --concurrency=2 (dependency closure, under the verify lock): exit 0, 'Tasks: 28 successful, 28 total' @6476ffc",
    "pnpm exec vitest run --maxWorkers=2 packages/app-shell/src/views/metadata-admin/ (under the lock): exit 0, 'Test Files 478 passed (478)', 'Tests 5435 passed | 1 skipped (5436)' @6476ffc",
    "pnpm --filter @object-ui/app-shell type-check (echoed 'tsc --noEmit && tsc -p tsconfig.test.json', under the lock): exit 0 @6476ffc",
    "eslint --no-inline-config --format json on the 3 changed files: exit 0. eslint classified the changeset as having no matching configuration and linted 2 TS files: 0 errors, 0 warnings. Proven narrowing: the population is eslint's own classification of the changed set; the file count comes from the JSON array length; invariance holds because the root eslint.config.js sets no parserOptions.project or projectService and no rule in eslint-rules/ reads the disk, so untouched files' verdicts cannot move. Full pnpm lint is CI's. @6476ffc",
    "node scripts/check-changeset-presence.mjs: exit 0, '2 source file(s) of 1 released package(s) changed, and this change declares 1 changeset(s)' @6476ffc",
    "pnpm check:changeset-claims: exit 0, 'No pending changeset names a file this change touches.' @6476ffc",
    "pnpm check:pending-changeset-literals: exit 0, 'No test source names a pending changeset.' @6476ffc",
    "pnpm check:new-line-citations: exit 0, 'VERDICT new-cross-file-line-citations: 0 new citation(s)' @6476ffc",
    "pnpm check:control-bytes: exit 0, 'check-control-bytes: OK' @6476ffc",
    "pnpm check:test-path-roots: exit 0, 'check-test-path-roots: OK' @6476ffc",
    "pnpm check:vi-mock-specifiers: exit 0, 'check-vi-mock-specifiers: OK' @6476ffc",
    "pnpm check:vi-mock-inherit (added; reads test files): exit 0, OK @6476ffc",
    "pnpm check:vi-mock-override-shape (added; reads test files): exit 0, OK @6476ffc",
    "pnpm check:unreferenced-sources (added; a new file under app-shell src): exit 0, 'Every shipped source file in every covered package is reachable.' @6476ffc",
    "check:i18n-* family: not run, because no string, i18n key or locale entry was added",
    "CI: not awaited, per contract; PR objectui#12321 is draft and in_progress"
  ],
  "deviations": [
    "Rendering path: the verify skill's preview gallery renders designers, not PageShell, and no backend was available (the objectstack checkout is not installed or built). The measurement used a scratch, uncommitted Vite entry that mounts the real PageShell inside the real AppShell, Sidebar and useResponsiveSidebar geometry with the stock showcase permission props; the stats values and item name are stand-ins. The harness is deleted.",
    "Page attribution: the collision is on the item (detail) page's compact header, not on the list page the card and PM assumption 2 name. ResourceListPage.tsx was not touched, and the list page header is byte-identical.",
    "Wide-window fence: one wide-window change, the code-shipped set at 1440 (one ellipsized line becomes two full lines). It is raised in open_questions rather than chosen silently.",
    "Gates added beyond the dispatch list, because they read test files or new src files: check:vi-mock-inherit, check:vi-mock-override-shape, check:unreferenced-sources. All passed.",
    "Commit trailer: per objectui AGENTS.md, the commit ends with the model-free pair (Claude-Session plus 'Co-authored-by: Claude'), not the harness's model-named Co-Authored-By line.",
    "A data-testid ('page-shell-header-meta') was added for the pin. No export, prop, type member, spec key or i18n key was added; Clause-② stays no."
  ]
}

Generated by Claude Code

Landed: objectui PR #12321 → `main` `67ca3af` · `domain:ui` seat 1 · `session_01CsyMRsFJBKNEMa4oPY1b5z` · 2026-10-13T09:22Z

Merged through the merge queue at 2026-10-13T09:21Z. This card closed completed by the PR's Fixes #12306. No other lane card closed at the merge.
Landed by content, not by sha: all 3 of the PR's files on main 67ca3af are blob-identical to the accepted head 6476ffc (ACCEPT 6142137834).
pm:dispatched was removed and read back. domain:ui, area:studio, the type and the priority stay.
The changeset rides the next objectui release: @object-ui/app-shell patch.
What is on main:
- The one-line header of a metadata admin item page (for example a permission set's matrix editor) wraps when its content does not fit.
- The breadcrumb keeps its own line and truncates only the item name.
- The chips, subtitle, stats and actions move below it, with stats and actions right-aligned. Nothing overprints at 820 px, and nothing is pushed off the edge at 390 px.
- When everything fits on one row the header is unchanged, and the list page header is unchanged.
Measured premise: the overprint was on the item page's compact header, not on the list page whose URL the card named. The producer, PageShell, is the same.

Generated by Claude Code

Navigation Menu

Repository navigation

console Setup › metadata admin: at an 820px-wide viewport the breadcrumb row overprints the type and badge chips ("All Metadata T…SECURITY Pe create-only P…") #12306

What happens

Where (objectui `1fb1ced36243`)

Expected

Landed: objectui PR #12321 → `main` `67ca3af` · `domain:ui` seat 1 · `session_01CsyMRsFJBKNEMa4oPY1b5z` · 2026-10-13T09:22Z

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

console Setup › metadata admin: at an 820px-wide viewport the breadcrumb row overprints the type and badge chips ("All Metadata T…SECURITY Pe create-only P…") #12306

Description

What happens

Where (objectui 1fb1ced36243)

Expected

Activity

objectstack-fleet commented on Oct 13, 2026

objectstack-fleet commented on Oct 13, 2026

objectstack-fleet commented on Oct 13, 2026

Landed: objectui PR #12321 → main 67ca3af · domain:ui seat 1 · session_01CsyMRsFJBKNEMa4oPY1b5z · 2026-10-13T09:22Z

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions

Where (objectui `1fb1ced36243`)

Landed: objectui PR #12321 → `main` `67ca3af` · `domain:ui` seat 1 · `session_01CsyMRsFJBKNEMa4oPY1b5z` · 2026-10-13T09:22Z