[WIP] - Start moving to React

[DarthHater]

Current progress

Quick Stats:

Search Page (home):

Search Page (searching):

Search Page (advanced search modal open):

Artifact details page:

This is a very basic PR so far that deletes all Angular things, and is slowly moving towards using React

This is not to be merged into main, this is where we start rebuilding the project

To get started:

• Make sure you are on node v14.18.1 or higher I believe
• yarn in the root, so have yarn as well
• yarn start should open the app, and livereload

yarn test can now be used to run unit tests, it's using jest

To get search things working, use a CORS unblocker of some form. I use: https://add0n.com/access-control.html

This pull request thus far, makes the following changes:

• Adds react
• Moves to node v14.18.1+ for building things (we really should try and hit 16 or higher as we do this)
• Uses webpack to build things, and run a dev server (opens at localhost:3000)
• Adds in react-router-dom, and implements a few basic routes, with supporting config for webpack
• Adds in eslint, and config for prettier and uh, regular linting things (manifests as yarn lint)
• Implemented very basic pages for Artifact, Search, and Stats
• Adds in @sonatype/react-shared-components AKA RSC
• Uses React.Context to provide a artifactFactory, which should allow swapping in new Services over time a lot easier as this Factory takes a initialClient, which is an interface for ArtifactServiceInterface. MYSTIC STYLES. Some of this was gleaned from: https://blog.testdouble.com/posts/2021-03-19-react-context-for-dependency-injection-not-state/
• Wraps the app in a provider, so now everything has access to that factory
• Partially implements search, works with a CORS unblocker of some form at current time (due to search.maven.org cors settings)
• Implements Stats page, adds query to the ArtifactServicesFactory and SolrService
• Injects runtime config at bootup, reading config.json in the root of the project (see src/index.tsx. Strongly typed this as well.
• Implements the parseOnGrouping function verbatim from the old site, so that queries get translated to something SOLR can use
• Adds in jest ts-jest and the other needed helpers for testing
• Updates README to mention new dev workflow, etc...

Basic constraints:

• Right now just keep on trucking with the SOLR search stuff
• Ideally this site gets deployed 100% separately from the backend, so let's imagine it lives in an S3 bucket or some dumb place at some point where it's more or less not connected to the backend
• Make sure the config for endpoints etc... is hot swappable, or something akin, such that the site can be deployed pointed against a different backend
• Ideally, let's keep the URLs the same as the existing site, so if we were to use this experiment, it can happen fairly seamlessly, low effort, etc...

TODO:

• [X] Implement Search (just very basic, I searched, I got a result back)
• [X] Implement typeahead search (so populate dropdown)
• [X] Implement query parser so that the advanced search options get sent to Solr correctly (SearchUtils.ts)
• [X] Implement runtime config option (config.json in the site root will control runtime settings)
• [X] Implement advanced search options modal
• [ ] Follow up on RSC bug RSC-769 (related to use of NxSearchDropdown and how we push to history)
• [ ] Implement Artifact list pages (list of versions for an artifact)
• [ ] Implement Artifact display pages (ok so I found a specific version, show me the details)
• [x] Implement Stats page
• [X] Unit Test framework
• [ ] Write unit tests for components and utils
• [ ] SEO fun times, so react on the server side, generate site maps, the fun stuff
• [ ] Explore a mobile friendly view of RSC with this rewrite
• [ ] Have a lot of fun?

[dbradicich]

That component details page looks great :)