Upgrade to React 17 and use new JSX transform
One step at a time. Since React 17 introduced a potentially breaking change to how it does event delegation, I think it's safer to test it in production before moving to React 18.
While I'm at it, I'm taking advantage of the new JSX transform, which comes out of the box with CRA v4 and React 17. This new transform allows removing all the default React
imports everywhere, which I've done for the most part with a codemod. I know @valentin.valls you like having a global React
import, but React really wants us to move away from it, as it will allow future versions of React to be tree-shaken (= unused stuff removed at build time so as to reduce bundle size):
In addition to cleaning up unused imports, this will also help you prepare for a future major version of React (not React 17) which will support ES Modules and not have a default export.
Removing the default React
imports also brings us a step closer to being able to enable @typescript-eslint/consistent-type-imports
so types are imported with import type ...
.