feat: migrate from CRA to Vite + React 19

[devin-ai-integration]

Summary

Session A of a 4-session parallel migration. Migrates the foundational build toolchain from Create React App (react-scripts) to Vite, and upgrades React from v17 to v19.

Changes

• Removed: react-scripts, web-vitals, src/reportWebVitals.js
• Added: vite, @vitejs/plugin-react
• Upgraded: react and react-dom to ^19.0.0
• Created vite.config.js with path aliases replicating CRA's src baseUrl behavior for absolute imports (components/, constants/, context/, hooks/, lib/, styles/)
• Moved public/index.html → project root index.html, removed %PUBLIC_URL% references and CRA-specific HTML comments, added Vite module script entry point
• Renamed src/index.js → src/main.jsx, migrated from ReactDOM.render to createRoot API
• Updated package.json scripts: start → vite, build → vite build, added preview → vite preview; removed eslintConfig and browserslist sections

Scope

Only touches build config and the entry point. No component files were modified — Alert.jsx, Modal.jsx, test files, etc. are handled by other parallel sessions.

Review & Testing Checklist for Human

• Run npm run start and verify the app loads at http://localhost:5173 with the game board visible
• Run npm run build and verify it produces a dist/ folder without errors
• Verify absolute imports (e.g. import X from 'components/...') resolve correctly at runtime
• Confirm no regressions in dark mode, high contrast mode, or game functionality

Notes

• Dev server confirmed running and returning HTTP 200 on localhost:5173
• The test and eject scripts were removed since they relied on react-scripts; testing infrastructure can be re-added in a follow-up session
• fix, check, and prepare scripts are preserved as-is

Link to Devin session: https://app.devin.ai/sessions/a3a42c9610ce4c8faa175d386f2b08f8
Requested by: @shahmir-masood

---

Devin Review

Status	Commit
⚪ Not started	—

Run Devin Review

💡 Connect your GitHub account to enable automatic code reviews.

[devin-ai-integration]

🤖 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 and CI monitoring

[devin-ai-integration]

Devin Review found 1 potential issue.

View 3 additional findings in Devin Review.

[devin-ai-integration]

🔴 react-transition-group v4.4.2 uses removed findDOMNode API from React 19

The PR upgrades React from 17 to 19, but keeps react-transition-group at v4.4.2. This version internally calls ReactDOM.findDOMNode() when no nodeRef prop is provided, and findDOMNode was removed in React 19. The CSSTransition components in src/components/Modal/Modal.jsx:13 and src/components/Alert/Alert.jsx:17-22 do not pass a nodeRef prop, which means they rely on the findDOMNode code path. This will cause a runtime crash when modals or alerts are shown/hidden.

Affected CSSTransition usages without nodeRef

In Modal.jsx:

<CSSTransition in={isOpen} timeout={300} classNames={'fade'} unmountOnExit>

In Alert.jsx:

<CSSTransition in={isVisible} timeout={300} classNames={'fadeIn'} unmountOnExit>

Both need a nodeRef prop to avoid the findDOMNode call, or react-transition-group needs to be upgraded to a version compatible with React 19.

Prompt for agents

The PR upgrades React to 19, but react-transition-group v4.4.2 uses ReactDOM.findDOMNode which was removed in React 19. There are two approaches to fix this:

1. Upgrade react-transition-group to a version that supports React 19 (if available), OR
2. Add nodeRef props to all CSSTransition usages to avoid the findDOMNode code path.

For approach 2, you need to:
- In src/components/Modal/Modal.jsx: Create a ref with useRef() and pass it as nodeRef to CSSTransition, and attach the ref to the wrapping div inside.
- In src/components/Alert/Alert.jsx: Similarly create a ref and pass nodeRef to CSSTransition, attaching the ref to the span element inside.

The nodeRef prop tells react-transition-group to use the provided ref instead of calling findDOMNode internally.

---

Was this helpful? React with 👍 or 👎 to provide feedback.

[devin-ai-integration]

Good catch — this is a known compatibility concern with the React 19 upgrade. However, modifying Modal.jsx and Alert.jsx is explicitly out of scope for this PR (Session A). Those component files are being handled by other parallel sessions in this 4-session migration. The nodeRef additions to CSSTransition usages will be addressed there.