chore: update react v18, mui v5

[pviotti]

I have recently migrated to React v18 another project, and it's been painless so I thought it'd be the same for this one - oh boy, was I wrong. There's a few additional changes to make it work, due to some incompatibilities, APIs deprecation, introduction of new NPM packages, etc - a classic javascript version bump 😅

Basically:

• as you see in fix(deps): update react monorepo to v18 (major) #667 (comment) react v18 doesn't work with current version of Material UI
• the new major version of Material UI (5.x), changed package name (it's @mui/* now) and also changed the way it deals with themes and styles, so:
  • 2 new npm packages are needed (@emotion/react and @emotion/styled)
  • makeStyles and similar functions are not supported anymore - or, more precisely, they still work as a legacy feature, but not with react v18: you'd need to use @mui/styles, except

    @mui/styles is not compatible with React.StrictMode or React 18.
    

    so I had to remove all the custom theming stuff and move the injected custom style to a separate CSS, imported once in index.js.

I hope it makes sense (as much as it can..).
CSS is not exactly as before, and sometimes the MUI theme is prevailing (that's why I tried putting !important on some rules), but that can be fixed later I guess.

👋

Other references:

• https://mui.com/material-ui/migration/migration-v4/
• [@mui/styles] v5 is not compatible with React 18 mui/material-ui#32142
• makeStyles returns never mui/material-ui#28841
• [migration] How can I replace makeStyles in my code? mui/material-ui#32585
• [styles] makeStyles not working with theme  mui/material-ui#31030

close #681

[codecov-commenter]

Codecov Report

Merging #690 (a832bc5) into master (77cbc25) will not change coverage.
The diff coverage is n/a.

@@            Coverage Diff            @@
##             master     #690   +/-   ##
=========================================
  Coverage     51.14%   51.14%           
  Complexity     1447     1447           
=========================================
  Files           249      249           
  Lines          9879     9879           
  Branches       1092     1092           
=========================================
  Hits           5053     5053           
  Misses         4507     4507           
  Partials        319      319           

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 77cbc25...a832bc5. Read the comment docs.

[lupino3]

Hey Paolo! 👋🏼
Thanks a lot for the update! As you've seen, I attempted the update but failed miserably 😆

I understand the additions of !important (that also trigger Codacity), and they make total sense to me. Your changes preserve the functionality and UX while updating the dependencies, and that's perfect for me.

Thanks again for your contributions! Merging the PR as-is.