LF-5206: Upgrade to Vite v5

[SayakaOno]

Description

Upgrade Vite to v5. (Most changes relate to SVG imports)
Migration guide: https://v5.vite.dev/guide/migration

• Upgrade vite, vitest, vite-plugin-svgr, vite-plugin-pwa, and vite-plugin-istanbul, which are incompatible with Vite v5
  • Migrate SVG imports from { ReactComponent as X } to default ?react query (breaking change in vite-plugin-svgr v4)
    • https://github.com/pd4d10/vite-plugin-svgr#usage
• Set moduleResolution to Bundler in tsconfig files (required for Rollup 4)
  • Fix @storybook/react/* wildcard imports to correct package paths
  • TypeScript’s Node module resolution previously allowed these, but Bundler mode (stricter subpath export rules) correctly rejects them. These were pre-existing issues exposed by this change.
• Fix missing key props in HarvestUseType and TransplantSpotlight (caught by pre-commit)
• Replace silenceDeprecations: ['legacy-js-api'] with api: 'modern-compiler'

Jira link: https://lite-farm.atlassian.net/browse/LF-5206

Type of change https://lite-farm.atlassian.net/browse/LF-5206

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

How Has This Been Tested?

Tested pnpm run dev and pnpm build & pnpm preview.

• Passes test case
• UI components visually reviewed on desktop view
• UI components visually reviewed on mobile view
• Other (please explain)

Checklist:

• I have commented my code, particularly in hard-to-understand areas
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• The precommit and linting ran successfully
• I have added or updated language tags for text that's part of the UI
• I have ordered translation keys alphabetically (optional: run pnpm i18n to help with this)
• I have added the GNU General Public License to all new files

[socket-security]

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance	License
	happy-dom@​15.11.7
	@​mui/​base@​5.0.0-beta.26
	eslint@​8.57.1
	i18next-parser@​5.4.0
	axios@​1.12.2 ⏵ 1.13.2
	@​storybook/​addon-mdx-gfm@​8.6.14
	@​storybook/​react-vite@​8.6.14
	@​types/​uuid@​10.0.0
	@​typescript-eslint/​parser@​5.62.0
	@​types/​react-router-dom@​5.3.3
	@​types/​prop-types@​15.7.15
	@​types/​history@​4.7.11
	eslint-config-prettier@​8.10.2
	@​storybook/​react@​8.6.14
	@​types/​react-redux@​7.1.34
	@​storybook/​addon-a11y@​8.6.14
	@​types/​react-table@​7.7.20
	file-saver@​2.0.5
	@​types/​react-dom@​18.3.7
	@​storybook/​addon-actions@​8.6.14
	@​types/​lodash-es@​4.17.12
	@​storybook/​addon-viewport@​8.6.14
	@​mui/​styles@​5.18.0
	@​types/​react@​18.3.26
	d3@​7.9.0
	i18next-resources-to-backend@​1.2.1
	@​babel/​core@​7.28.5
	@​types/​google.maps@​3.58.1
	clsx@​1.2.1
	@​reactour/​tour@​3.8.0
	imap-simple@​5.1.0
	eslint-plugin-json@​3.1.0
	i18next-http-backend@​3.0.2
See 43 more rows in the dashboard

View full report

[socket-security]

Warning

Review the following alerts detected in dependencies.

According to your organization's Security Policy, it is recommended to resolve "Warn" alerts. Learn more about Socket for GitHub.

Action	Severity	Alert  (click "▶" to expand/collapse)
Warn		Critical CVE: Happy DOM: VM Context Escape can lead to Remote Code Execution in npm happy-dom CVE: GHSA-37j7-fg3j-429f Happy DOM: VM Context Escape can lead to Remote Code Execution (CRITICAL) Affected versions: < 20.0.0 Patched version: 20.0.0 From: packages/webapp/package.json → npm/happy-dom@15.11.7 ℹ Read more on: This package | This alert | What is a critical CVE? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at support@socket.dev. Suggestion: Remove or replace dependencies that include known critical CVEs. Consumers can use dependency overrides or npm audit fix --force to remove vulnerable dependencies. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment @SocketSecurity ignore npm/happy-dom@15.11.7. You can also ignore all packages with @SocketSecurity ignore-all. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Warn		Obfuscated code: npm entities is 91.0% likely obfuscated Confidence: 0.91 Location: Package overview From: packages/webapp/pnpm-lock.yaml → npm/happy-dom@15.11.7 → npm/i18next-parser@5.4.0 → npm/entities@4.5.0 ℹ Read more on: This package | This alert | What is obfuscated code? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at support@socket.dev. Suggestion: Packages should not obfuscate their code. Consider not using packages with obfuscated code. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment @SocketSecurity ignore npm/entities@4.5.0. You can also ignore all packages with @SocketSecurity ignore-all. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Warn		Obfuscated code: npm entities is 91.0% likely obfuscated Confidence: 0.91 Location: Package overview From: packages/webapp/pnpm-lock.yaml → npm/i18next-parser@5.4.0 → npm/entities@6.0.1 ℹ Read more on: This package | This alert | What is obfuscated code? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at support@socket.dev. Suggestion: Packages should not obfuscate their code. Consider not using packages with obfuscated code. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment @SocketSecurity ignore npm/entities@6.0.1. You can also ignore all packages with @SocketSecurity ignore-all. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Warn		Protestware or unwanted behavior: npm es5-ext Note: The script attempts to run a local post-install script, which could potentially contain malicious code. The error handling suggests that it is designed to fail silently, which is a common tactic in malicious scripts. From: packages/webapp/pnpm-lock.yaml → npm/es5-ext@0.10.64 ℹ Read more on: This package | This alert | What is protestware? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at support@socket.dev. Suggestion: Consider that consuming this package may come along with functionality unrelated to its primary purpose. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment @SocketSecurity ignore npm/es5-ext@0.10.64. You can also ignore all packages with @SocketSecurity ignore-all. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.

View full report