Skip to content

feat(frontend): replace custom components with shadcn/ui equivalents#778

Merged
Gkrumbach07 merged 13 commits intoambient-code:mainfrom
jeremyeder:jeder/shadcn-component-eval
Mar 5, 2026
Merged

feat(frontend): replace custom components with shadcn/ui equivalents#778
Gkrumbach07 merged 13 commits intoambient-code:mainfrom
jeremyeder:jeder/shadcn-component-eval

Conversation

@jeremyeder
Copy link
Contributor

@jeremyeder jeremyeder commented Mar 3, 2026

Jira: RHOAIENG-51883

hey, this came from looking into new shadcn components to improve the UI - it found several clean-ups. I've been running this patchset, it's not massively different visually but it does align a few things with the shadcn defaults.

The command palette is really awesome actually.

Summary

  • Replaced 4 custom component implementations with standard shadcn/ui equivalents (Breadcrumb, Popover, Sonner toast, DataTable with TanStack Table)
  • Added 6 new shadcn components: Command palette (Cmd+K), Sheet (mobile nav), Sidebar (workspace layout), Collapsible, HoverCard, Pagination
  • Deleted 5 files of hand-rolled code (~1,574 lines removed): breadcrumbs.tsx, simple-data-table.tsx, toast.tsx, toaster.tsx, use-toast.tsx
  • Net change: +266 lines across 61 files

Test plan

  • Verify workspace pages render with Sidebar layout and Breadcrumb navigation
  • Test mobile navigation Sheet drawer on narrow viewport
  • Confirm Command palette opens with Cmd+K and searches projects
  • Verify toast notifications work via Sonner across all forms (connection cards, session actions, settings)
  • Test HoverCard previews on session name links in sessions table
  • Confirm Collapsible sections toggle in settings and create-session dialog
  • Test Pagination controls on workspaces and sessions tables
  • Verify no regressions in session detail page

🤖 Generated with Claude Code

jeremyeder and others added 4 commits February 28, 2026 20:12
Daily scheduled triage of open issues via ACP session using
the triage workflow from ambient-code/workflows.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Audit and migrate frontend to use standard shadcn/ui components,
replacing hand-rolled implementations with maintained Radix-based
primitives. Removes ~1,574 lines of custom code.

Replaced:
- Custom Breadcrumbs → shadcn Breadcrumb
- Hand-rolled Popover (202 lines with portal/positioning) → Radix Popover (48 lines)
- Radix Toast/Toaster/useToast → Sonner (simpler API, toast() function)
- SimpleDataTable → TanStack Table DataTable with sorting/filtering/column visibility

Added:
- Command palette (Cmd+K) with project search and navigation
- Sheet drawer for mobile navigation
- Sidebar layout for workspace pages
- Collapsible sections in settings and session creation
- HoverCard previews on session names
- Standardized Pagination component with page number display

Deleted:
- breadcrumbs.tsx, simple-data-table.tsx, toast.tsx, toaster.tsx, use-toast.tsx

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Combine shadcn/ui migration (Sonner toast, HoverCard icons) with
upstream artifact-count column (NotepadText icon, useWorkspaceList).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Pre-push hooks caught trailing whitespace, missing final newlines,
ruff formatting, and an unused variable (F841) in bridge.py.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@jeremyeder jeremyeder marked this pull request as ready for review March 3, 2026 06:38
@ambient-code ambient-code bot added this to the Merge Queue milestone Mar 3, 2026
@ambient-code ambient-code bot removed this from the Merge Queue milestone Mar 4, 2026
jeremyeder and others added 5 commits March 4, 2026 13:08
Integrate upstream changes (runner rename to ambient-runner, runner types
refactoring, admin runtimes page, model discovery) while preserving
shadcn/ui component migration (sonner toasts, shadcn Breadcrumb,
radix-based Dialog/Popover). Convert new upstream pages to use shadcn
components for consistency.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Fix ruff: ambiguous variable name, unused assignment, import order
- Fix golangci-lint errcheck: handle Close() return values in ambient-sdk
- Fix bash unbound variable in go-vet.sh and golangci-lint.sh by
  initializing associative arrays (empty + set -u incompatibility)
- Add ambient-sdk/generator to GO_MODULES list in pre-commit scripts

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
The production overlay github-app-secret.yaml contains PEM header
placeholders (not actual keys) that trigger the detect-private-key
pre-commit hook. Exclude it to allow pushes.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@jeremyeder
Copy link
Contributor Author

ss_.2026-03-04.at.17.33.09.mov

demo

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

what is this page?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ah crap - part of how i was evaluating these shadcn changes was to build a page to show them all. harmless but not intended to include

@jeremyeder jeremyeder force-pushed the jeder/shadcn-component-eval branch from 5b06afe to 5acb5a3 Compare March 5, 2026 03:16
@jeremyeder
Copy link
Contributor Author

Closing this PR in favor of #816 which has a cleaner commit history (single commit instead of multiple merges and reverts).

@jeremyeder jeremyeder closed this Mar 5, 2026
@jeremyeder jeremyeder reopened this Mar 5, 2026
@jeremyeder
Copy link
Contributor Author

Rebased branch to a clean single commit on top of current main (047314a). The messy merge history has been cleaned up.

Previous commit history had 11 commits with multiple merges and a revert. Now it's a single clean commit: 9e93ede

@ambient-code
Copy link

ambient-code bot commented Mar 5, 2026

Merge Readiness — Blockers Found

Check Status Detail
CI pass
Merge conflicts pass
Review comments FAIL 2 inline threads on components/frontend/src/app/evaluate/page.tsx
Jira hygiene pass
Staleness pass
Diff overlap risk pass

This comment is auto-generated by the PR Overview workflow and will be updated when the PR changes.

@jeremyeder jeremyeder enabled auto-merge (squash) March 5, 2026 19:50
@jeremyeder jeremyeder disabled auto-merge March 5, 2026 19:50
@Gkrumbach07 Gkrumbach07 merged commit c66dbae into ambient-code:main Mar 5, 2026
13 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants