denozord/router-lists-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
b0c8a0a4bbd642ad22c0bbf0c3cde20ebf1c8fb6
router-lists-ui/frontend/docs/SHADCN_MIGRATION_AUDIT.md
T
denozord b0c8a0a4bb
Publish Docker image / build-and-push (push) Successful in 2m6s
Details
Refactor frontend structure and update dependencies 
- Changed the main entry point from main.jsx to main.tsx for TypeScript support.
- Removed Tabler JS import and integrated Tailwind CSS for styling.
- Updated package.json and package-lock.json to include new dependencies such as @fontsource-variable/geist and tailwindcss, while removing unused ones.
- Enhanced Vite configuration with path aliasing for improved import management.
- Deleted unused App.css and App.jsx files to streamline the project structure.

Made-with: Cursor
2026-04-26 14:56:48 +07:00

1.7 KiB
Raw Blame History

SHADCN Migration Audit

Scope

  • Frontend path: frontend/src
  • Goal: full replacement of Tabler UI with shadcn/ui + Tailwind tokens.

Findings

  • Direct Tabler dependencies are present in frontend/package.json:
    • @tabler/core
    • @tabler/icons-react
  • Tabler runtime imports are used in frontend/src/main.jsx:
    • @tabler/core/dist/css/tabler.min.css
    • @tabler/core/dist/js/tabler.min.js
  • Bootstrap/Tabler data API is used in layout and modal flows (data-bs-*, show.bs.*, hide.bs.*).
  • frontend/src/index.css contains a large Tabler-coupled style layer (--tblr-*, .navbar-*, .btn-*, .card-*, .table-* patterns).

Migration Priority (Feature-first with platform dependencies)

  1. App shell and navigation
    • App.jsx
    • routing shell + sidebar/topbar behavior
  2. Core UI and design tokens
    • components/ui generation via shadcn
    • theme provider + global token CSS
  3. High traffic features
    • Dashboard, ServerManager, FilterManager
  4. Cross-feature shared components
    • modal, table, command/alerts/feedback components
  5. Remaining pages
    • all managers/tools pages not covered in p3

Hotspots (high coupling)

  • frontend/src/App.jsx (layout, routing, theme, i18n in one file)
  • frontend/src/index.css (global overrides and hardcoded values)
  • frontend/src/components/* (large number of Tabler class usages)

Enforcement Checklist

  • No @tabler/* imports or dependencies.
  • No data-bs-* attributes or Bootstrap event listeners.
  • No hardcoded color/radius/spacing values in components.
  • shadcn primitives generated through plugin/CLI only.
  • components/ui treated as base layer; composition happens in components/shared.
Reference in New Issue View Git Blame Copy Permalink