Index Page to Groundwork/React

[krowvin]

Update Landing Page to Groundwork + React using Vite.js

This PR is for issue #572

NOTE THIS PR SHOULD NOT BE APPROVED UNTIL CONFIRMED WORKING ON VARIOUS URL PATHS
See Route Issues below - Looking for assistance and suggestions on this!

Major Changes:

• Converted from vanillaJS/CSS to React/Tailwind
• Followed the groundwork guidelines to implement the Groundwork components created for WM/USACE
• Converted the static pages to client-side routed pages via react-router-dom (see below)
• Requires a build step:
  From the cwms-data-api\src\main\webapp-src path run npm run to see the available commands or open cwms-data-api/src/main/webapp-src/package.json and look at scripts.

1. Run npm run build
2. Copy the contents that get output into dist to the webapps directory (there is a script that will do this for windows in the package.json)

Things of Note:

• Groundwork recommends Redux-Bundler as the client-side routing framework. However, in testing I attempted to use both this and react-router-dom to override the dynamic client-side routing.
• The cwms-data-api/src/main/webapp/WEB-INF/web.xml had to be edited to handle 404 Not Found errors and pass them back to the client to handle the client-side routing. There may be a better way to handle this.

Route Issues

I was able to get this working by hard coding the base path in vite.js and in cwms-data-api\src\main\webapp-src\src\bundles\route-bundle.js

However, we need this to be dynamic for the district T7s.

I took two attempts at this:

• Once with redux-bundler -> Initial commits
• Another try with react-router-dom -> Current HEAD state

If you would like to jump to the commit where I had redux-bundler setup the commit hash is 7c572b4635d13bbcbd907bab3a47a9b12732c2ce