vite migration

[sainak]

Proposed Changes

• migrate build tools to vite
• upgraded storybook and stories

TODO

• verify that all components work as expected in a production build
• fix service worker (checkout vite-pwa)
• fix ci issues
• fix storybook
• fix generated css file size

@coronasafe/care-fe-code-reviewers @coronasafe/code-reviewers

Merge Checklist

• Add specs that demonstrate bug / test a new feature.
• Update product documentation.
• Ensure that UI text is kept in I18n files.
• Prep screenshot or demo video for changelog entry, and attach it to issue.
• Request for Peer Reviews
• Completion of QA

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
care-storybook	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Apr 3, 2023 2:36pm

[netlify]

✅ Deploy Preview for care-egov-staging ready!

Name	Link
🔨 Latest commit	137616f
🔍 Latest deploy log	https://app.netlify.com/sites/care-egov-staging/deploys/642ae401f7155b000787fccf
😎 Deploy Preview	https://deploy-preview-5140--care-egov-staging.netlify.app/
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[sainak]

@rithviknishad the components contaning the phone number field break while previewing a production build, I'm not able to pin point the actual issue but here's the error that I got

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: [missing argument].[missing argument]

please check this issue

Edit: fixed it

[sainak]

@rithviknishad the issue is fixed now.
We will have to be careful with what external libraries we use.

[gigincg]

@sainak Can you update the netlify.toml and the Dockerfile so that @mathew-alex Can test this out in those environments?

cc: @rithviknishad

[sainak]

@gigincg changes to deployment config won't be needed as internally npm run build is calling vite
You can see the latest deploy preview, the components are working fine now but the css file is quite large as compared to cra builds, service worker might be broken, and I'm working on fixing the storybook

[shivankacker]

Just to quantify the impact of this PR, starting the current CRA app takes 1 minute and 36 seconds on my laptop with 16 gb ram and an i5-11400H @ 2.70GHz 2.69 GHz CP.
The Vite app takes just 40 seconds to start which makes the app start 215% faster than before. Hot reload also takes considerably less time than before. This allows CARE to be developed in less powerful computers. Great feat @sainak

[sainak]

@rithviknishad please update the ci for storybook the build commnad is build:storybook and the dist folder is build-storybook
also can you verify if the service worker is working correctly?

[sainak]

@gigincg @mathew-alex the PR is ready to be merged in develop with one breaking change that is the env variable PUBLIC_URL needs to be renamed to REACT_PUBLIC_URL

[github-actions]

👋 Hi, @sainak,
Conflicts have been detected against the base branch. Please rebase your branch against the base branch.

---

This message is automatically generated by prince-chrismc/label-merge-conflicts-action so don't hesitate to report issues/improvements there.

[shivankacker]

LGTM!

[github-actions]

👋 Hi, @sainak,
Conflicts have been detected against the base branch. Please rebase your branch against the base branch.

---

This message is automatically generated by prince-chrismc/label-merge-conflicts-action so don't hesitate to report issues/improvements there.

[khavinshankar]

@sainak can you fix the merge conflicts

[sonarqubecloud]

SonarCloud Quality Gate failed.   

0 Bugs
0 Vulnerabilities
1 Security Hotspot
1 Code Smell

No Coverage information
1.1% Duplication