Merge main into prod: AI Aggregator toggle + Sass @import to @use migration

Changes:
- Added AI_AGGREGATOR preference toggle (default: ON)
- Migrated 170+ SCSS files from deprecated @import to @use syntax
- Added i18next package dependency
- Updated package versions

Conflict resolution:
- SCSS files: kept @use syntax from main
- dapp.connect.tsx: kept cleaner version from main (removed redundant initialState)
- package.json: kept main version with newer packages and i18next

Author: nmajutee

package-lock.json

@@ -28,9 +28,9 @@
     "lint": "lint-staged"
   },
   "dependencies": {
-    "@capacitor-firebase/messaging": "^7.2.0",
+    "@capacitor-firebase/messaging": "^7.3.1",
     "@capacitor/action-sheet": "^7.0.2",
-    "@capacitor/android": "^7.4.2",
+    "@capacitor/android": "^7.4.3",
     "@capacitor/app": "^7.0.1",
     "@capacitor/browser": "^7.0.2",
     "@capacitor/camera": "^7.0.2",
@@ -42,7 +42,7 @@
     "@capacitor/push-notifications": "^7.0.1",
     "@capacitor/toast": "^7.0.2",
     "@capgo/capacitor-social-login": "^7.11.4",
-    "@datadog/browser-rum": "^6.19.0",
+    "@datadog/browser-rum": "^6.22.0",
     "@emoji-mart/react": "^1.1.1",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.1",
@@ -64,6 +64,7 @@
     "dotenv": "^17.2.3",
     "ethers": "^6.15.0",
     "firebase": "^11.10.0",
+    "i18next": "^25.7.1",
     "i18next-browser-languagedetector": "^8.2.0",
     "iso-country-currency": "^0.7.2",
     "js-base64": "^3.7.8",
@@ -80,7 +81,7 @@
     "react-error-boundary": "^6.0.0",
     "react-google-recaptcha": "^3.1.0",
     "react-helmet": "^6.1.0",
-    "react-hook-form": "^7.58.0",
+    "react-hook-form": "^7.65.0",
     "react-i18next": "^15.7.3",
     "react-infinite-scroller": "^1.2.6",
     "react-intersection-observer": "^9.16.0",
@@ -118,7 +119,7 @@
     "@storybook/test": "^8.6.12",
     "@swc/core": "^1.13.3",
     "@swc/jest": "^0.2.38",
-    "@testing-library/dom": "^10.4.0",
+    "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "^6.6.4",
     "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^14.6.1",
@@ -133,17 +134,18 @@
     "@types/react-infinite-scroller": "^1.2.5",
     "@typescript-eslint/eslint-plugin": "^8.31.1",
     "@typescript-eslint/parser": "^8.45.0",
-    "@vitejs/plugin-react-swc": "^3.11.0",
+    "@vitejs/plugin-react-swc": "^4.1.0",
     "autoprefixer": "^10.4.21",
     "babel-loader": "^10.0.0",
+    "caniuse-lite": "^1.0.30001759",
     "cypress": "^14.5.4",
     "cypress-file-upload": "^5.0.8",
     "eslint": "^9.34.0",
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-cypress": "^5.1.1",
     "eslint-plugin-i18next": "^6.1.3",
     "eslint-plugin-import": "^2.31.0",
-    "eslint-plugin-jsdoc": "^51.0.1",
+    "eslint-plugin-jsdoc": "^50.6.3",
     "eslint-plugin-jsx-a11y": "^6.10.2",
     "eslint-plugin-prettier": "^5.5.4",
     "eslint-plugin-react": "^7.37.5",
@@ -157,7 +159,7 @@
     "lint-staged": "^16.2.3",
     "postcss": "^8.5.6",
     "prettier": "^3.6.2",
-    "sass": "^1.87.0",
+    "sass": "^1.93.2",
     "storybook": "^8.6.14",
     "tailwindcss": "^3.4.17",
     "ts-jest": "^29.4.1",

package.json

@@ -544,6 +544,14 @@ export const PREFERENCES_TOGGLES = [
     subtitle: 'Do you offer payment in crypto?',
     value: 'OFF',
   },
+
+ // AI Aggregator preference toggle to ON
+  {
+    key: 'AI_AGGREGATOR',
+    title: 'AI Aggregator',
+    subtitle: 'Enable AI Aggregator features.',
+    value: 'ON',
+  },
 ];
 
 export const PREFERENCES_CULTURE_QUESTIONS = [

src/constants/PREFERENCES.ts

@@ -52,19 +52,6 @@ const WALLET_TYPES = {
 } as const;
 
 export const useWeb3 = () => {
-  const initialState = {
-    wallet: null,
-    walletProvider: null,
-    provider: null,
-    signer: null,
-    account: '',
-    chainId: null,
-    connected: false,
-    network: null,
-    networkName: '',
-    testnet: config.dappENV === 'testnet',
-    balance: null,
-  };
   const dispatch = useDispatch();
   const walletState = useSelector((state: RootState) => state.wallet);
   const [pendingConnector, setPendingConnector] = useState<Connector<CreateConnectorFn> | null>(walletState.wallet);
@@ -164,7 +151,6 @@ export const useWeb3 = () => {
     dispatch(resetWalletState());
     localStorage.removeItem('walletType');
     localStorage.removeItem('selectedWallet');
-    setWalletState(initialState);
   };
 
   useEffect(() => {

src/dapp/dapp.connect.tsx

@@ -1,9 +1,9 @@
 // @import url('https://fonts.googleapis.com/css2?family=Hahmlet&family=Work+Sans');
 // @import url(https://fonts.googleapis.com/css?family=Hahmlet:700|Work+Sans:bold);
-@import './styles/constants/primitives';
-@import './styles/base/reset';
-@import './styles/icons.scss';
-@import './styles/tailwind.scss';
+@use './styles/constants/primitives' as *;
+@use './styles/base/reset' as *;
+@use './styles/icons.scss' as *;
+@use './styles/tailwind.scss' as *;
 
 @layer base {
     @font-face {

src/index.scss

@@ -1,4 +1,4 @@
-@import 'src/styles/constants/_primitives.scss';
+@use 'src/styles/constants/primitives' as *;
 
 .container {
     display: flex;

src/modules/Auth/components/IntroHeader/header.module.scss

@@ -1,4 +1,4 @@
-@import 'src/styles/constants/_primitives.scss';
+@use 'src/styles/constants/primitives' as *;
 
 .btn {
     width: 100%;

src/modules/Auth/components/LinkedInButton/index.module.scss

@@ -1,4 +1,4 @@
-@import 'src/styles/constants/_primitives.scss';
+@use 'src/styles/constants/primitives' as *;
 
 .container {
     width: 100%;

src/modules/Auth/components/Step/index.module.scss

@@ -1,4 +1,4 @@
-@import 'src/styles/constants/_primitives.scss';
+@use 'src/styles/constants/primitives' as *;
 
 .review {
     max-width: 656px;

src/modules/Auth/containers/ServiceIntro/service-intro.module.scss

@@ -1,4 +1,4 @@
-@import 'src/styles/constants/_primitives.scss';
+@use 'src/styles/constants/primitives' as *;
 
 .resend {
     color: $color-primary-700;