docs(known-issues): UI consistency sweep (KI-214 to KI-235)

platform/known-issues.md

@@ -37,7 +37,7 @@ and missing pieces. Entries are **recorded, not fixed**; they feed the product r
 
 ## Findings from the detailed pages
 
-Collected while writing the detailed pages for each area (October 2026), checked against the running demo instance and the product source. KI-154 to KI-213 come from re-verifying every area on the Docker demo stack (`just demo-up`, October 2026), which also closed or updated older rows (marked *Status* or *Docker demo stack*). Same legend as above. **Open S1 items:** KI-059, KI-060, KI-112, KI-136, KI-159, KI-175, KI-187 (KI-040 is closed).
+Collected while writing the detailed pages for each area (October 2026), checked against the running demo instance and the product source. KI-154 to KI-213 come from re-verifying every area on the Docker demo stack (`just demo-up`, October 2026), which also closed or updated older rows (marked *Status* or *Docker demo stack*). KI-214 to KI-235 come from a whole-app UI consistency sweep of 78 screens (admin, light theme, 1440×900, same stack), then the dark theme, 768 and 390 px widths, the editors and a non-admin member. Same legend as above. **Open S1 items:** KI-059, KI-060, KI-112, KI-136, KI-159, KI-175, KI-187 (KI-040 is closed).
 
 ### Data API, Alerts and Apps
 
@@ -264,6 +264,28 @@ Collected while writing the detailed pages for each area (October 2026), checked
 | KI-153 | OpenAPI | Gap | S2 | Only the Data API bearer scheme is declared; session cookie and CSRF are not, so generated clients cannot authenticate. Most operations have no summary (only an `operationId`), and many descriptions are internal doc comments (long, referencing internal types and task numbers). *Steps:* `openapi.json`; `scripts/gen-api-reference.mjs` has to truncate descriptions. |
 | KI-155 | Demo stack | Docs | S3 | The demo edge does not route `/readyz` and `/healthz` to Egret: `curl http://egret.localtest.me:18080/readyz` answers 200 with the web app's HTML, which looks healthy whatever the backend state, so the generic first checks of the troubleshooting index do not work on the demo stack. |
 | KI-185 | Authentication | UX | S2 | An SSO user lands on *No workspaces yet* after the first sign-in and can do nothing until a workspace admin adds them; Egret only knows the user after that first sign-in, so the admin cannot add them beforehand. The demo guide documents this. *Workaround:* sign in once, then have an admin add the user. Seen by the demo-stack guide author, not re-observed. |
+| KI-214 | UI consistency | Consistency | S3 | Page titles come in five sizes: 13 px (SQL Lab, the chart editor, an endpoint's detail page), 16 px (an app's viewer), 18 px (every Explore and Governance list), 20 px (a dashboard and a flow) and 24 px (the alert and report editor, Workspace settings, every Control Plane page, Governance → Data). Measured on the `h1` of 78 screens at 1440×900. Pick one title size per page type (list, detail, editor, settings) and put it in `ListPageShell` and a shared detail header. |
+| KI-215 | UI consistency | Consistency | S3 | There is no shared page width. Lists and Control Plane pages run edge to edge (content from x=248 to x=1416); Workspace settings starts at x=256; the alert and report editor is a centred 896 px column (x=384…1280); **Choose a visualization** is a centred 768 px column (x=448…1216). Moving between pages shifts the left edge of the content by up to 200 px. The source has no page container: `max-w-3xl` appears 29 times, `max-w-5xl` 9, `max-w-2xl` 9, `max-w-4xl` and `max-w-6xl` twice each. |
+| KI-216 | UI consistency | Consistency | S3 | Five tab styles for the same job. Dataset detail and People & groups use a grey pill strip (40 px high, 6 px radius); the chart editor's **Data / Display** and an endpoint's **Query / Config / …** use an underline; the flow editor (**Edit / Revisions / Executions / Triggers**) uses a small pill strip, the alert editor and the catalog detail (8 tabs) use a pill strip with an icon touching its label, with no gap; Control Plane → Engines (**Trino / StarRocks / RisingWave**) and Access Explorer use a smaller pill; Storage and Secrets use a pill strip with tiny icons. FE-PAGE-2 says detail sections use `ui/tabs`; 24 files do, and four hand-roll a tab list (`DashboardTabBar`, `PanelTabStrip`, `NamespaceFiles`, the Data API `Query.tsx`). |
+| KI-217 | UI consistency | UX | S3 | 15 files render a bare browser `<select>` (grey OS chevron, a different height, border and radius from the shared `ui/select` used by 94 files). On screen: the alert and report editor (Endpoint, Metric, condition operator, Repeat, Every, At, report Deliver and Format: about 22 selects in `ScheduleEditor.tsx`), the dataset **Columns** tab (**Role**), Workspace settings → Notifications (**Encryption**, see KI-012), and the dashboard editing panels: **Filter settings** (*Column to filter on*, *Type*, *Operator*) shows three of them on screen. FE-FORM-3 asks for a picker; nothing in the lint stops a `<select>`. |
+| KI-218 | UI consistency | UX | S3 | Audit log → **From** and **To** are the browser's own `datetime-local` inputs. The format follows the browser locale (here `dd/mm/yyyy, --:--`), the picker looks different in every browser, and the rest of Egret uses its own date pickers (the dashboard date filter, the Data API activity range). |
+| KI-219 | UI consistency | UX | S3 | Settings tables in the alert and report editor put paragraphs in the **Details** column: the Data API alert's **Endpoint**, **Metric** and **Window (seconds)** rows run 9 to 12 lines in a column about 200 px wide, and the first line is sometimes an internal instruction (*choose it deliberately, not by leaving this blank; every save sends this field either way*). The **Value** column beside them is mostly empty, and its controls have four different widths (about 195 px for a select, 305 px for a text box, a split row for **Condition**). FE-PAGE-5 asks for the `Setting | Details | Value` shape, which assumes a short *Details*. Keep it to one line and move the rest to the docs or an info tooltip. |
+| KI-220 | Alerts | UX | S3 | One tab, two idioms. The **Notification** tab of an alert starts with a card list (**Deliver to** → *Email*, *Addresses*, **Add delivery method**) and then, below, a `Setting | Details | Value` table (**Email subject**, **Opening note**, **Closing note**, **Attachment**). Other tabs are tables only. The form's primary button is **Save** or **Create** at the bottom right of the page, after the table; see KI-183 for the other two placements. |
+| KI-221 | Alerts | Defect | S3 | Deep links to an editor section depend on the type. `/alerts/new?type=dataapi_alert&section=what` opens the **Condition** tab (the key is `what`, the label is *Condition*), while `?section=condition` on the same page is ignored and the **General** tab opens, silently. An unknown `section` should fall back with a message, or the key should match the label. |
+| KI-222 | UI consistency | Consistency | S3 | Status badges use three styles. Control Plane lists use a solid dark-green pill (*active* for workspaces and users, *allow* in the audit log); the Explore lists use a light outline or tint (*Active*, *Success*, *Healthy*, *Live*, *Draft*); settings and some details use plain text with a dot (*Active* in the catalog settings). The same state reads *active* in Control Plane and *Active* in Explore, in lower and upper case. |
+| KI-223 | UI consistency | Consistency | S3 | Names in Control Plane and Governance lists (workspaces, catalogs, users, groups, roles, profiles) are teal links; names in Explore lists (datasets, charts, dashboards, apps, endpoints, flows) are black text that is also a link. |
+| KI-224 | UI consistency | Consistency | S3 | Detail headers have four forms: back link + coloured icon tile + title + chips (alert, catalog, storage, secret); back link + title, no tile (dataset, endpoint, new engine); an arrow button inside the title bar (an app's viewer); and no back link at all (Workspace settings, whose own sidebar takes its place). The back link is small grey text and easy to miss. |
+| KI-225 | Governance | UX | S3 | The Governance sidebar is a group per page: **Data**, **People & groups**, **Classification**, **Lineage** and **Engine & policy** each hold exactly one item with the same name, and each carries a collapse chevron. The first group label, *Governance overview*, wraps to two lines in the 224 px sidebar. The grouping adds a row and a click target per page and says nothing. |
+| KI-226 | Workflows | UX | S3 | The Triggers table header wraps (**Last evaluated**, **Last execution**, **Next run** break onto two lines), row heights vary from one to three lines because the *Last execution* cell stacks a badge, an id and a time, The **Enable**, **Disable**, **Pause backfills** … toolbar is always shown, with one hint per button under it (*Enable: Select triggers first …*) even when nothing can be selected. |
+| KI-227 | Control Plane | UX | S3 | Two pages show unfinished surfaces as if they were features. Engines has a **RisingWave** tab next to **Trino** and **StarRocks** and says in its description *RisingWave arrives in a later phase*. **Access & governance** gives the *Needs attention* card the height of the *Recent changes* card, so most of it is empty, and its **How access works** panel starts below the fold. |
+| KI-228 | SQL Lab | UX | S3 | After a run, the same result is announced three times: a green pill in the toolbar (*Done in 1.1 s · 40 rows*), a second pill in the Results tab strip, and a text line under the grid (*Done in 1.1 s*). KI-161 covers the wording; the repetition takes space from a panel that is already short (KI-229). |
+| KI-229 | SQL Lab | UX | S3 | The editor takes about two thirds of the page by default, so at 1440×900 the results grid shows 6 rows of a 40-row result and the footer line. |
+| KI-230 | Authorization | UX | S2 | A 403 replaces the whole page with a bare card (*403 — Forbidden · You don't have access to this page.*) with no sidebar, no header, no back link and no link to a workspace the user can open. A member who types or follows a link to another workspace, or to Control Plane or Governance, has only the browser's Back button. Seen as `member-sso` on `/explore/default/datasets`, `/control-plane` and `/governance`. |
+| KI-231 | Authorization | Consistency | S3 | The same refusal is worded four ways. **Endpoints** and **Clients** show a raw red box with the API's word (*forbidden*) under a title bar that still offers **+ Endpoint**, **Download OpenAPI** and **+ Service account**; Workspace settings → **Members** says *Only workspace admins can manage members*; Workspace settings → **Engines** says *Insufficient permissions · Requires workspace-admin to manage engines*; a page the user may not open at all gets KI-230. The sidebar still lists Endpoints and Clients for a user who can open neither. |
+| KI-232 | Responsive | Gap | S3 | At 390 px wide **SQL Lab** cannot be used: the editor and the schema Explorer share about 140 px, the toolbar cuts off after **Limit**, and the results panel is a strip about 160 px high. Egret has no small-screen layout for the editor; the pages that are lists or forms stay readable, but see KI-233. |
+| KI-233 | Responsive | UX | S3 | At 390 px, content is clipped at the right edge with no visible cue instead of scrolling or wrapping: the dashboards list loses its **Updated** column, the alert editor's **Details** text is cut mid-word, the tab strips of the alert editor (*Notification* is out of sight) and of Workspace settings (*Roles & permissions* is cut) show no arrow or fade, the title *New Data API alert* is truncated to *New Data API a…*, and the workspace picker shows *De* for *Default*. No page scrolls sideways at the document level. |
+| KI-234 | Responsive | Bug | S3 | At 768 px the app sidebar keeps its full 224 px, so tables lose their width: on **Datasets** the **Database** column wraps *trino-demo (trino)* onto three lines and its heading runs into **Source** (*DatabaseSource*, the same collision as KI-171). |
+| KI-235 | Dashboards | UX | S3 | The dashboard **Filter settings** side panel (340 px, see KI-068) is built from bare browser selects and a free **Default value** box, unlike the card settings panel that opens in the same place (grouped rows, switches, a styled picker). *Column to filter on* appears three times on the canvas behind it as the same grey placeholder. |
 
 ## Not verified
 
@@ -278,3 +300,4 @@ The Docker demo stack (`just demo-up`) now exercises what the earlier demo insta
 - **SQL Lab errors:** `connect:`, `timeout` and authentication errors (the only connection is healthy and not delegated).
 - **Demo stack lifecycle:** `just demo-up` from an empty machine and its build time, `demo-reset` and `demo-seed`, and the demo-stack upgrade path. Engine state after `demo-down`/`demo-up` is KI-213.
 - **Elsewhere:** tagging BI objects, and "Limit this filter's choices" on dashboards.
+- **UI consistency sweep (KI-214 to KI-235):** 78 admin screens in the light theme at 1440×900, the same 52 pages in the dark theme and at 768 and 390 px wide, the editors (SQL Lab with results, dashboard edit and filter settings, chart editor, flow editor, endpoint tabs, app editor) and a non-admin SSO member (`member-sso`, workspace *data-science-lab*). **Dark theme:** no defect found; a script found no light-coloured block on any of the 52 pages and 12 of them were checked by eye, and the native selects (KI-217) follow the dark palette. Not swept: the dashboard and chart editing panels beyond the screens above, the flow **Topology** and **Logs** views (this build has no such tabs), the app editor once started, and a non-admin on pages that need a connection (KI-159).