Context
Dependabot PR #460 attempted to bump 29 frontend packages simultaneously, including 6+ major version upgrades. The PR fails CI because these are breaking changes requiring code migration. PR #460 will be closed.
Scope
Migrate the dataviewer frontend through these major framework upgrades incrementally, one at a time, with passing CI at each step:
| Package |
Current |
Target |
Migration Complexity |
| Tailwind CSS |
3.4 |
4.x |
High — CSS-first config, @import syntax, no tailwind.config.js |
| React |
18.3 |
19.x |
High — forwardRef removal, ref as prop, hooks behavior |
| TypeScript |
5.6 |
6.x |
Medium — stricter type checking |
| Vite |
6.4 |
8.x |
Medium — plugin API changes |
| ESLint |
9.x |
10.x |
Low — flat config updates |
| MSAL browser/react |
4.x/3.x |
5.x/5.x |
Medium — new auth API surface |
| tailwind-merge |
2.x |
3.x |
Low — API alignment with Tailwind 4 |
Suggested Order
- Tailwind CSS 3→4 + tailwind-merge 2→3 (foundation — affects all component styling)
- React 18→19 + @types/react 18→19 (core runtime)
- TypeScript 5→6 (type system — fix any new errors from steps 1-2)
- Vite 6→8 + @vitejs/plugin-react (build tooling)
- ESLint 9→10 + eslint-plugin-react-hooks 5→7 (linting)
- MSAL 4→5 / 3→5 (auth — test in deployed environment)
- Minor/patch bumps for remaining packages (lucide-react, recharts, zustand, etc.)
Acceptance Criteria
Context
Dependabot PR #460 attempted to bump 29 frontend packages simultaneously, including 6+ major version upgrades. The PR fails CI because these are breaking changes requiring code migration. PR #460 will be closed.
Scope
Migrate the dataviewer frontend through these major framework upgrades incrementally, one at a time, with passing CI at each step:
@importsyntax, notailwind.config.jsforwardRefremoval,refas prop, hooks behaviorSuggested Order
Acceptance Criteria
.github/dependabot.ymlupdated to ignore major versions already tracked here