jimfuqian/BB2-3508-replace-CRA-react-scripts-w-vite-for-frontend

[JFU-NAVA-PBC]

JIRA Ticket:
BB2-3508

Currently, our sample apps use the unmaintained create-react-app, which depends on the deprecated react-scripts lib. In order to fix these issues, we should remove these libraries and follow the steps to migrate to Vite from CRA.

What Does This PR Do?

Replace CRA (create-react-script) with Vite and perform refactor / version elevation etc as needed.

What Should Reviewers Watch For?

If you're reviewing this PR, please check for these things in particular:

• Exam the artifacts Added/Removed, artifacts (and dependencies) belong to CRA should be cleaned up
• Exam package.json: make sure equivalent CLIs are not lost but mapped to new CLIs (Vite CLIs)
• Check Docs (readmes at top level and client level) are consistent with the implementation

Validation

Steps:

1. Check out the PR to local repo
2. Follow the readme: e.g. to setup the app - edit server/.bluebutton-config.json to point to your registered BB2 app
3. From base dir, run: docker compose up (wait for containers built) and client and server components launch
4. Should see stdout like below (captured from python sample app, node sample app has similar stdout trace)

6. Now pointing browser to http://localhost:3000/ and going through the medicare.gov login (e.g BBUser00000) and data access grant screens, after click "Connect" on Data Access Grant page, the sample app will render Claims
7.

Note, if want to test the app running in Vite preview mode (sources are compiled and / or minified and provisioned in dist):

• Bring down the current containers by running: docker compose down
• Then spin the app up by running: BB2_APP_LAUNCH=preview docker compose up
• End User will have the same authorize and pull claims experience, but the FE (client) is launched from dist
• To verify it is in preview mode: check the std out of FE start, there is Vite CLI "$ vite preview" instead of "$ vite dev --host" (dev mode)

Also can verify other CLIs : lint, test, coverage:

(Need to bash into the client container to be in the context):

Steps:

List the container by running: docker container ls
bash into the client container:

docker exec -it bb2-3508-python-app-verify-pr-client-1 bash

yarn lint

Pass! there isn't many rules set yet...

yarn test

yarn coverage

Note, sample app selenium tests (docker compose based) still broken see BB2-3315

[stiwarisemanticbits]

LGTM,
checked out your branch and was able to access UI on localhost:3000