feat(platform): app details page + assorted UI polish fixes#2136
Merged
Conversation
Replace the bare "install it first" EmptyState (org route, app not installed) with a real pre-install details page: the full description, what the app brings (pages / workflows / agents as chip groups), and what it needs (required integrations), with Install as the CTA. The wizard (project pick / required integrations) lives inside, matching the one-click-vs-wizard split on the hub. Translations: en/de/fr - added apps.details.* (scope labels, includes / requires sections, setup hint); removed the now-orphaned apps.install.notInstalledTitle (the old EmptyState was its only user) Docs: N/A | Migrations: N/A | Storybook: N/A a11y: Install CTA is a button; chips are Badges; scope is a labelled Badge Tests: i18n parity/usage green; typecheck green
Two skeleton fixes in the shared DataTable: - The select column's skeleton used the 32px `action` shape, which in the pinned 40px column read edge-to-edge. Add a `checkbox` skeleton type (16px size-4) mirroring the real checkbox, keeping the gutter. - Skeleton rows used `min-h-12`, which CSS ignores on a table row (display: table-row); `h-12` acts as a min-height there, so the skeleton matches the loaded table's row height. Translations: N/A | Docs: N/A | Migrations: N/A | Storybook: N/A a11y: no change (skeleton is presentational) Tests: platform test:ui (data-table.test.tsx) green
Radix Popover, unlike Radix Select, does not auto-size its content to the trigger, so a full-width field (e.g. the install wizard's project picker) opened a 14.5rem dropdown centered under it. Bind min-width to --radix-popover-trigger-width via max(14.5rem, ...) so full-width triggers get a full-width dropdown while compact toolbar triggers keep the floor. Translations: N/A | Docs: N/A | Migrations: N/A | Storybook: N/A a11y: no change Tests: platform test:ui (searchable-select.test.tsx) green
Notification actions render outside the interactive row body (to avoid nested buttons), so they sat flush with no bottom gutter and ignored the body's content inset. Wrap children in pl-9 pr-4 pb-3: pl-9 (36px) lines actions up with the body text (px-4 + unread dot size-2 + gap-3); pb-3 restores the missing bottom gutter. Translations: N/A | Docs: N/A | Migrations: N/A | Storybook: N/A a11y: no change (actions already outside the interactive body) Tests: typecheck green
Pre-existing oxfmt breakage on main (merged via #2122) that fails the repo-wide Format CI check; unrelated to this PR but blocks its gate. Pure formatting, no content change.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What & why
Four independent UI fixes/improvements, split out from the canvas-viewer PR. Each is its own atomic commit.
feat: pre-install app details page — replaces the bare "install it first"EmptyState(org route, uninstalled app) with a real details page: full description, what the app brings (pages / workflows / agents as chip groups), what it needs (required integrations), Install CTA, with the wizard inside. Removes the now-orphanedapps.install.notInstalledTitlekey (the old EmptyState was its only user).fix: data-table checkbox skeleton + row height — adds acheckboxskeleton type (16pxsize-4, mirrors the real checkbox in the pinned 40px select column rather than the edge-to-edge 32pxactionshape); skeleton rows useh-12instead ofmin-h-12(CSS ignoresmin-heightondisplay: table-row, so rows were collapsing).fix: searchable-select dropdown width — binds the Popover min-width to--radix-popover-trigger-widthviamax(14.5rem, …), so a full-width trigger (the install wizard's project picker) opens a full-width dropdown while compact toolbar pickers keep the floor.fix: notification row action inset — wraps row actions inpl-9 pr-4 pb-3so they line up with the body text and regain the missing bottom gutter.Verification
typecheck+lintgreen against latestmainlint:sast(Opengrep) — 0 findings in changed filesparity+usageenforce green (incl. the orphaned-key removal — theusagecheck caught it)test:ui(data-table + searchable-select) green — 8 files / 79 testsDefinition of Done
apps.details.*, removed orphanedapps.install.notInstalledTitle. de-CH falls back to de.button; chips/scope areBadges; the data-table & searchable-select changes are presentational (no a11y semantics change).test:uigreen. No new e2e spec for the details page (presentational enhancement of the existing install flow; CI e2e + existing specs cover installation).services/platform, notpackages/uiprimitives).