Upgrading React to latest 19.0.0^ version

[rootp1]

React 19 Readiness and Tooling Modernization

Summary

This PR moves @greedybear-project/gb-ui closer to React 19 compatibility and modernizes the local development and test setup.

The main goals of this change are:

• remove React patterns that are legacy or discouraged in modern React
• migrate the example app and tests away from Create React App
• align core dependencies with a React 19-based development flow
• keep the public component API behavior as stable as possible while doing the upgrade work

This is a broad maintenance PR touching application code, the example app, test tooling, and dependency management.

What Changed

1. React 19 compatibility cleanup

• replaced legacy ReactDOM.render usage with createRoot
• updated ConfirmModal to use react-dom/client
• removed function-component defaultProps usage and converted defaults to parameter defaults
• removed function-component propTypes declarations across the component library and example app

This keeps the codebase aligned with modern React expectations and reduces noise from patterns that are no longer the preferred approach in recent React versions.

2. Example app migration from CRA to Vite

• replaced the example app entrypoint with a Vite-style root index.html
• renamed the example entry file from index.js to index.jsx
• renamed the example smoke test from App.test.js to App.test.jsx
• replaced react-scripts commands with vite and vitest
• added Vite and Vitest config for the example app

This makes the example app faster to run locally and brings it in line with the new unit test setup.

3. Test tooling migration

• replaced react-scripts test with vitest
• added root vitest.config.mjs
• added root vitest.setup.mjs
• updated the example test to use @testing-library/react

This gives us a simpler and more modern test path for React 19 work.

4. Dependency updates

• upgraded peer support for react and react-dom to ^19.0.0
• updated several runtime and development dependencies, including:
• zustand
• react-select
• @testing-library/react
• @testing-library/jest-dom
• reactstrap
• react-router-dom
• axios-hooks

5. Library compatibility adjustments

• updated Zustand store creation to the current API
• switched persisted storage setup to createJSONStorage
• hardened a few components with safer defaults and defensive optional chaining
• kept the bulk of component signatures and exported names unchanged

File Groups Touched

Tooling and config

• package.json
• package-lock.json
• .eslintrc
• vitest.config.mjs
• vitest.setup.mjs
• example/package.json
• example/vite.config.mjs
• example/vitest.config.mjs
• example/vitest.setup.mjs
• example/index.html

Example app migration

• example/src/index.jsx
• example/src/App.test.jsx
• multiple example sections updated for JSX/test/tooling compatibility

Component library cleanup

• alerts, buttons, charts, containers, form components, icons, lists, misc utilities, modals, nav, table, tabs, text, time, stores

Most of these changes are mechanical cleanup rather than intentional behavior changes.

Behavior Notes

The intent of this PR is compatibility and maintenance, not a redesign of the component library.

Expected behavior changes are limited to:

• modernized mounting behavior for the example app and confirm modal
• updated test runner and local example workflow
• safer default handling in many components where defaults previously lived in defaultProps

Why This PR Is Large

This migration spans several concerns at once:

• React 19 preparation
• removal of legacy function component patterns
• test runner migration
• example app migration
• dependency refresh

These changes are related, and splitting them too aggressively would have made review harder because the compatibility work depends on the tooling and dependency updates.

[rootp1]

Hi @regulartim, could you share the preferred PR style for this issue?
For example, would you like changes split into smaller PRs or combined into a single one? I just want to align before submitting for review.

[rootp1]

and also,
@regulartim since react 19 no longer applies propTypes checks for function components, I removed them across the library.

Before finalizing, I wanted to check what direction you’d prefer going forward for prop validation:

1. Keep the current baseline (no runtime validation for now)
2. Introduce a runtime validation (somethin like Zod)
3. Treat TypeScript as the replacement and move toward that instead!

[regulartim]

Hey @rootp1 ! Thanks for your work! :)

could you share the preferred PR style for this issue?

It's fine the way it is. 👍

I wanted to check what direction you’d prefer going forward for prop validation

Keep the current baseline.

Is this ready to review then?

[rootp1]

Hey @rootp1 ! Thanks for your work! :)

Hi @regulartim. Thanks for the appreciation.

This PR isn’t ready for review yet.
As I predicted, the CI checks are failing due to strict peer dependency conflicts.

For example, react-json-view@1.21.3 requires React versions up to 17, which conflicts with the current setup. There are around 4–5 similar packages (react-table) causing the same issue.
I’ve identified a few possible replacements and would like to confirm them with you before proceeding.

[regulartim]

I’ve identified a few possible replacements and would like to confirm them with you before proceeding.

OK :)

[rootp1]

OK :)

@regulartim,
I’ve been looking into the dependency conflicts and wanted to run these replacements by you before proceeding:

• react-table to @tanstack/react-table
• react-json-view to @microlink/react-json-view

Along with this, I'll have to adjust the related code :

1. by removing the old react-table hooks (useTable, useRowSelect, useExpanded, useAsyncDebounce) and migrated the logic to TanStack Table APIs
2. replacing debouncing with our internal useAsyncDebounce where needed

Let me know if you’re okay with these changes, and I’ll move ahead accordingly.

[rootp1]

@regulartim,

Just to add a bit more context, most of the changes would actually be driven by the shift to TanStack Table. The API differences compared to react-table are quite significant

[regulartim]

Hey @rootp1 ! Thanks for investigating!

Let me know if you’re okay with these changes, and I’ll move ahead accordingly.

Yes, I am ok with that. 👍

[rootp1]

Hey @rootp1 ! Thanks for investigating!

Let me know if you’re okay with these changes, and I’ll move ahead accordingly.

Yes, I am ok with that. 👍

Hey @regulartim, Thanks for confirmation.
I’ve started working on the new changes based on this.
I’ll keep the changes posted as I progress and open a PR once everything is ready.

[rootp1]

How react-table looked like

How tanstack/react-table looks like now

(just demonstration screenshots)

[rootp1]

@regulartim, the visual testing of the Tanstack/react-table passed sucessfully

[rootp1]

@regulartim as far as I checked, the implementation is qualified from my side, with lint errors

[regulartim]

Alright, thanks! :)

[rootp1]

Alright, thanks! :)

Good Morning @regulartim,
If any caveats are left, please let me know.

[regulartim]

Thanks again @rootp1 ! This looks like it was a lot more work than I thought.

[rootp1]

Thanks again @rootp1 ! This looks like it was a lot more work than I thought.

Thanks @regulartim! It was a bit larger than expected, there might still be some edge case breakages, happy to help fix if anything shows up.