Skip to content

feat: migrate UI layer to coss.com/ui (Base UI)#2

Closed
devin-ai-integration[bot] wants to merge 1 commit into
mainfrom
devin/1780145436-coss-ui-remake
Closed

feat: migrate UI layer to coss.com/ui (Base UI)#2
devin-ai-integration[bot] wants to merge 1 commit into
mainfrom
devin/1780145436-coss-ui-remake

Conversation

@devin-ai-integration

Copy link
Copy Markdown

Summary

Swaps the UI primitive layer from Radix UI → coss.com/ui (shadcn-style components built on Base UI), keeping all app features (coords, geocoding, map, custom theming, i18n, widgets) intact. No app logic, state, or Rust/Tauri backend changes; version left untouched.

The bulk of the work is adapting consumers to Base UI's API, which differs from Radix:

  • asChildrender prop. Radix wrapped a child; Base UI takes a JSX element on render. Triple-nested cases (tooltip → toolbar → button) nest render:
    - <TooltipTrigger asChild><Toolbar.Button asChild><Button .../></Toolbar.Button></TooltipTrigger>
    + <TooltipTrigger render={<ToolbarButton render={<Button .../>} />} />
  • Command → Autocomplete. coss Command is an Autocomplete alias; items are passed as an array and CommandList takes a render function; selection moved from onSelectonClick. Applied to theme-selector and language-selector.
    - <Command><CommandGroup>{items.map(i => <CommandItem onSelect=.../>)}</CommandGroup></Command>
    + <Command items={items}><CommandList>{(i) => <CommandItem onClick=.../>}</CommandList></Command>
  • Popover sizing --radix-popover-trigger-width--anchor-width; dropped Radix-only collisionPadding/avoidCollisions.
  • TooltipProvider delayDurationdelay.
  • Toolbar @radix-ui/react-toolbar → coss Toolbar/ToolbarButton (edit/marker/selection toolbars).
  • color-picker hue slider rebuilt on Base UI slider (@base-ui/react/slider) instead of radix-ui.

Stack cleanup:

  • Removed unused deps: radix-ui, @radix-ui/react-{scroll-area,select,separator,slot,toolbar}, cmdk.
  • Bundled Inter + Geist Mono via @fontsource-variable/* (offline desktop app) and wired --font-sans / --font-mono design tokens.
  • Added build.rollupOptions.output.manualChunks (icons/vendor/motion/dnd; leaflet kept in the lazy map-panel chunk) + chunkSizeWarningLimit, eliminating the bundle-size warning. lucide-react stays fully bundled on purpose — themes resolve their icon by name at runtime.

The sonner toast wrapper already maps to the design tokens (--popover, --border, --radius), so it's kept as-is.

Verification

  • bun run lint, bun run vite:build (tsc + vite) pass with no warnings.
  • Smoke-tested the web layer (bun run vite:dev): settings panel, Base UI Selects, migrated Command theme selector (switched Dark → Light), language selector, and switch all render and work; console clean.

Note: full app run requires the Tauri desktop bridge; the dev-server smoke test shows the expected "waiting for Tauri" sidebar state.

Link to Devin session: https://app.devin.ai/sessions/96349a14345f42beb48c8282af8425a8
Requested by: @wiktorekdev

Replace the Radix UI primitive layer with coss.com/ui components built on
Base UI, and refresh the stack:

- Migrate primitives (button, card, input, select, popover, tooltip,
  scroll-area, switch, command, slider, toolbar, spinner, autocomplete)
- Port consumers from Radix asChild -> Base UI render prop, fix
  TooltipProvider delay, --anchor-width sizing, and the Command ->
  Autocomplete API (items + onClick)
- Rebuild color-picker hue slider on Base UI slider
- Drop unused radix-ui / @radix-ui/* / cmdk deps
- Bundle Inter + Geist Mono via @fontsource and wire --font-sans/--font-mono
- Add manualChunks + chunkSizeWarningLimit to remove the bundle warning

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
@devin-ai-integration

Copy link
Copy Markdown
Author

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

  • Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
  • Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

  • Disable automatic comment, CI, and merge conflict monitoring

@vercel

vercel Bot commented May 30, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
geohelper Ready Ready Preview, Comment May 30, 2026 1:03pm

Repository owner deleted a comment from strix-security Bot May 30, 2026
@wiktorekdev

Copy link
Copy Markdown
Owner

leaving this for later cuz it has a lot of bugs to fix

@wiktorekdev wiktorekdev closed this Jun 5, 2026
Repository owner locked and limited conversation to collaborators Jun 5, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant