Mvj 370 cra to vite

[henrinie-nc]

Almost everything changed, and may not be perfect.
I suggest reviewing commit by commit, otherwise it might be a tad too massive.

This pull request mainly contains the following:

• Switch to vite, removal of Webpack.
• Changes to how imports are done, could not get the previous way to work with Vite.
• Eslint updates, new config file.
• Removal of Mocha and its utilities, replaced with Vitest
• Updating multiple packages, adding typing packages
  • For instance, had to update React to 16.9 to make things smooth
• Use sass directly and removal of related webpack tooling
• Some work with the leaflet typing, and its packages - which is a bit of a mess

There's still additional work to be done:

• Sass gives ~130 Deprecation Warnings
• Typescript gives 266 errors (I did quite extensive work to reduce this number to even this)
• Eslint puts out a whopping 5487 errors
  • Requires config adjustments, and probably just honest fixing of things

[robertrytovuori]

Clearly a lot of work gone into this. I went through commits 1 by 1 but couldn't find anything that I thought required fixing. Looks good!

[NC-jsAhonen]

The local .env configs were a bit unclear. I got this working with these. I recommend adding these as an example to make setting up the dev environment easier (although tunnistamo exit will affect these in the near future):

# Required
VITE_API_URL=http://localhost:8001/v1
VITE_STORAGE_PREFIX=MVJ
PORT=3000
# The SSO OpenId Connect settings
VITE_OPENID_CONNECT_API_TOKEN_KEY=http://tunnistamo-backend:8000/mvj
VITE_OPENID_CONNECT_API_TOKEN_URL=http://tunnistamo-backend:8000/api-tokens/
VITE_OPENID_CONNECT_AUTHORITY_URL=http://tunnistamo-backend:8000/openid/
VITE_OPENID_CONNECT_CLIENT_ID=mvj-ui
VITE_OPENID_CONNECT_SCOPE=openid profile http://tunnistamo-backend:8000/mvj

[NC-jsAhonen]

I would approve this at this point.

To add to the list of work to be done in the future

Externalised source mapping issues, such as
Module "source-map-js" has been externalized for browser compatibility. Cannot access "source-map-js.SourceMapConsumer" in client code. See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details. source-map-js:9:14

Firefox browser compatibility issues

Error: Not allowed to define cross-origin object as property on [Object] or [Array] XrayWrapper
Warning: Warning: MouseEvent.mozInputSource is deprecated. Use PointerEvent.pointerType instead.

HMR issues with Firefox when doing code changes:

ReferenceError: can't access lexical declaration 'LeasePage' before initialization
[hmr] Failed to reload /src/leases/components/LeasePage.tsx. This could be due to syntax errors or importing non-existent modules. (see errors above)
`

[henrinie-nc]

The local .env configs were a bit unclear. I got this working with these. I recommend adding these as an example to make setting up the dev environment easier (although tunnistamo exit will affect these in the near future):

# Required
VITE_API_URL=http://localhost:8001/v1
VITE_STORAGE_PREFIX=MVJ
PORT=3000
# The SSO OpenId Connect settings
VITE_OPENID_CONNECT_API_TOKEN_KEY=http://tunnistamo-backend:8000/mvj
VITE_OPENID_CONNECT_API_TOKEN_URL=http://tunnistamo-backend:8000/api-tokens/
VITE_OPENID_CONNECT_AUTHORITY_URL=http://tunnistamo-backend:8000/openid/
VITE_OPENID_CONNECT_CLIENT_ID=mvj-ui
VITE_OPENID_CONNECT_SCOPE=openid profile http://tunnistamo-backend:8000/mvj

Those are configurable, did not change the defaults. Everyone could have their own specific config

[henrinie-nc]

I would approve this at this point.

To add to the list of work to be done in the future

Externalised source mapping issues, such as Module "source-map-js" has been externalized for browser compatibility. Cannot access "source-map-js.SourceMapConsumer" in client code. See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details. source-map-js:9:14

Firefox browser compatibility issues

Error: Not allowed to define cross-origin object as property on [Object] or [Array] XrayWrapper Warning: Warning: MouseEvent.mozInputSource is deprecated. Use PointerEvent.pointerType instead.

HMR issues with Firefox when doing code changes:

ReferenceError: can't access lexical declaration 'LeasePage' before initialization [hmr] Failed to reload /src/leases/components/LeasePage.tsx. This could be due to syntax errors or importing non-existent modules. (see errors above) `

Would make sense to add subtasks from these findings