refactor(web): extract EmptyState — one shared empty-state line for all routes and sections #279

New issue

Closed

opened 2026-08-04 19:24:32 +02:00 by dominik.polakovics · 1 comment

dominik.polakovics commented

2026-08-04 19:24:32 +02:00

Owner

This was generated by AI during triage.

Split out of umbrella #276 (frontend component reuse, follow-up to #275).

The hand-rolled empty-state pattern … appears at ~16 production call sites across the web frontend: the list routes (Tokens, Credentials, History, Repos, RepoIssues, RepoCRs), RunChat (four distinct messages), NewRun, and the repo-/user-settings sections (Imports, Secrets, Schedules, Notifications). A visual or spacing fix to the pattern currently means touching every one of them.

Extract one shared component and migrate all call sites, preserving the current look. The agent brief follows in a comment.

> *This was generated by AI during triage.* Split out of umbrella #276 (frontend component reuse, follow-up to #275). The hand-rolled empty-state pattern `…` appears at ~16 production call sites across the web frontend: the list routes (Tokens, Credentials, History, Repos, RepoIssues, RepoCRs), RunChat (four distinct messages), NewRun, and the repo-/user-settings sections (Imports, Secrets, Schedules, Notifications). A visual or spacing fix to the pattern currently means touching every one of them. Extract one shared component and migrate all call sites, preserving the current look. The agent brief follows in a comment.

dominik.polakovics added the

enhancement

label

2026-08-04 19:24:32 +02:00

dominik.polakovics commented

2026-08-04 19:24:39 +02:00

Author

Owner

This was generated by AI during triage.

Agent Brief

Category: enhancement
Summary: Extract a shared EmptyState component and migrate every hand-rolled  call site to it.

Current behavior:
Routes and settings sections render their "nothing here yet" line by hand as some text. The pattern appears at roughly 16 production call sites: the list routes (Tokens, Credentials, History, Repos, RepoIssues, RepoCRs), RunChat (which has four distinct messages for ready / waiting for transcript / transcript gone / no messages), NewRun, and the repo- and user-settings sections (Imports, Secrets, Schedules, Notifications). Some messages are static strings; some are computed (History's per-outcome-filter message, RepoCRs' emptyText()).

Desired behavior:
One shared component (suggested name EmptyState) owns the empty-state markup and its empty class; every production call site renders through it. Its content slot is JSX so both static and computed messages work unchanged. No visual change — same element, same class, same text as today.

Key interfaces:

A new EmptyState component in the shared components directory, shaped and tested like SectionCard (small props surface, plain markup out, a colocated test file in the same style)
The empty CSS class stays the single styling hook and, after migration, is applied only by the component in production code

Acceptance criteria:

EmptyState exists with a colocated test following the SectionCard test style
Every production call site rendering  is migrated (test fixtures may keep raw markup)
A repo-wide search for hand-rolled class="empty" markup in production frontend code finds only the component
Computed messages (History's filter-dependent text, RepoCRs' computed text) render exactly as before
Existing frontend tests pass; no CSS changes

Out of scope:

Restyling or rewording any empty state
The other pattern families tracked by #276 (head rows, form cards, list rows, banners)

> *This was generated by AI during triage.* ## Agent Brief **Category:** enhancement **Summary:** Extract a shared `EmptyState` component and migrate every hand-rolled `` call site to it. **Current behavior:** Routes and settings sections render their "nothing here yet" line by hand as `some text`. The pattern appears at roughly 16 production call sites: the list routes (Tokens, Credentials, History, Repos, RepoIssues, RepoCRs), RunChat (which has four distinct messages for ready / waiting for transcript / transcript gone / no messages), NewRun, and the repo- and user-settings sections (Imports, Secrets, Schedules, Notifications). Some messages are static strings; some are computed (History's per-outcome-filter message, RepoCRs' `emptyText()`). **Desired behavior:** One shared component (suggested name `EmptyState`) owns the empty-state markup and its `empty` class; every production call site renders through it. Its content slot is JSX so both static and computed messages work unchanged. No visual change — same element, same class, same text as today. **Key interfaces:** - A new `EmptyState` component in the shared components directory, shaped and tested like `SectionCard` (small props surface, plain markup out, a colocated test file in the same style) - The `empty` CSS class stays the single styling hook and, after migration, is applied only by the component in production code **Acceptance criteria:** - [ ] `EmptyState` exists with a colocated test following the `SectionCard` test style - [ ] Every production call site rendering `` is migrated (test fixtures may keep raw markup) - [ ] A repo-wide search for hand-rolled `class="empty"` markup in production frontend code finds only the component - [ ] Computed messages (History's filter-dependent text, RepoCRs' computed text) render exactly as before - [ ] Existing frontend tests pass; no CSS changes **Out of scope:** - Restyling or rewording any empty state - The other pattern families tracked by #276 (head rows, form cards, list rows, banners)

dominik.polakovics added the

ready-for-agent

label

2026-08-04 19:24:39 +02:00

dominik.polakovics referenced this issue

2026-08-04 19:25:35 +02:00

Frontend component reuse: inventory repeated UI patterns, then file per-family extraction issues #276

dominik.polakovics referenced this issue

2026-08-04 19:25:35 +02:00

Frontend component reuse: inventory repeated UI patterns, then file per-family extraction issues #276

dominik.polakovics referenced this issue from a commit

2026-08-04 19:41:23 +02:00