feat: react 19

.yarn/patches/recoil-patch-34a7806c1c.patch

@@ -0,0 +1,128 @@
+diff --git a/cjs/index.js b/cjs/index.js
+index 2fb571f97d46750ffbae0678c108876e0fe3ba3d..2d87e71fb82531ee027c6492ece520149eb3af1b 100644
+--- a/cjs/index.js
++++ b/cjs/index.js
+@@ -504,26 +504,7 @@ let ReactRendererVersionMismatchWarnOnce = false; // Check if the current render
+ // change we can't simply check if `React.useSyncExternalStore()` is defined.
+
+ function currentRendererSupportsUseSyncExternalStore() {
+-  var _ReactCurrentDispatch;
+-
+-  // $FlowFixMe[incompatible-use]
+-  const {
+-    ReactCurrentDispatcher,
+-    ReactCurrentOwner
+-  } =
+-  /* $FlowFixMe[prop-missing] This workaround was approved as a safer mechanism
+-   * to detect if the current renderer supports useSyncExternalStore()
+-   * https://fb.workplace.com/groups/reactjs/posts/9558682330846963/ */
+-  react.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+-  const dispatcher = (_ReactCurrentDispatch = ReactCurrentDispatcher === null || ReactCurrentDispatcher === void 0 ? void 0 : ReactCurrentDispatcher.current) !== null && _ReactCurrentDispatch !== void 0 ? _ReactCurrentDispatch : ReactCurrentOwner.currentDispatcher;
+-  const isUseSyncExternalStoreSupported = dispatcher.useSyncExternalStore != null;
+-
+-  if (useSyncExternalStore && !isUseSyncExternalStoreSupported && !ReactRendererVersionMismatchWarnOnce) {
+-    ReactRendererVersionMismatchWarnOnce = true;
+-    Recoil_recoverableViolation('A React renderer without React 18+ API support is being used with React 18+.');
+-  }
+-
+-  return isUseSyncExternalStoreSupported;
++  return true;
+ }
+
+ /**
+diff --git a/es/index.js b/es/index.js
+index 3cc366b4bfd910cfb2b3bf60d51c561a85c5d4b0..7a5074be9aecb31de68df614e442650d491528ae 100644
+--- a/es/index.js
++++ b/es/index.js
+@@ -498,26 +498,7 @@ let ReactRendererVersionMismatchWarnOnce = false; // Check if the current render
+ // change we can't simply check if `React.useSyncExternalStore()` is defined.
+
+ function currentRendererSupportsUseSyncExternalStore() {
+-  var _ReactCurrentDispatch;
+-
+-  // $FlowFixMe[incompatible-use]
+-  const {
+-    ReactCurrentDispatcher,
+-    ReactCurrentOwner
+-  } =
+-  /* $FlowFixMe[prop-missing] This workaround was approved as a safer mechanism
+-   * to detect if the current renderer supports useSyncExternalStore()
+-   * https://fb.workplace.com/groups/reactjs/posts/9558682330846963/ */
+-  react.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+-  const dispatcher = (_ReactCurrentDispatch = ReactCurrentDispatcher === null || ReactCurrentDispatcher === void 0 ? void 0 : ReactCurrentDispatcher.current) !== null && _ReactCurrentDispatch !== void 0 ? _ReactCurrentDispatch : ReactCurrentOwner.currentDispatcher;
+-  const isUseSyncExternalStoreSupported = dispatcher.useSyncExternalStore != null;
+-
+-  if (useSyncExternalStore && !isUseSyncExternalStoreSupported && !ReactRendererVersionMismatchWarnOnce) {
+-    ReactRendererVersionMismatchWarnOnce = true;
+-    Recoil_recoverableViolation('A React renderer without React 18+ API support is being used with React 18+.');
+-  }
+-
+-  return isUseSyncExternalStoreSupported;
++  return true;
+ }
+
+ /**
+diff --git a/native/index.js b/native/index.js
+index dcb8bc961bfc0595864a18436df9685f0bcff43d..46c6776353fd84c57592ff5b5d81c1556a29fdee 100644
+--- a/native/index.js
++++ b/native/index.js
+@@ -498,26 +498,7 @@ let ReactRendererVersionMismatchWarnOnce = false; // Check if the current render
+ // change we can't simply check if `React.useSyncExternalStore()` is defined.
+
+ function currentRendererSupportsUseSyncExternalStore() {
+-  var _ReactCurrentDispatch;
+-
+-  // $FlowFixMe[incompatible-use]
+-  const {
+-    ReactCurrentDispatcher,
+-    ReactCurrentOwner
+-  } =
+-  /* $FlowFixMe[prop-missing] This workaround was approved as a safer mechanism
+-   * to detect if the current renderer supports useSyncExternalStore()
+-   * https://fb.workplace.com/groups/reactjs/posts/9558682330846963/ */
+-  react.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+-  const dispatcher = (_ReactCurrentDispatch = ReactCurrentDispatcher === null || ReactCurrentDispatcher === void 0 ? void 0 : ReactCurrentDispatcher.current) !== null && _ReactCurrentDispatch !== void 0 ? _ReactCurrentDispatch : ReactCurrentOwner.currentDispatcher;
+-  const isUseSyncExternalStoreSupported = dispatcher.useSyncExternalStore != null;
+-
+-  if (useSyncExternalStore && !isUseSyncExternalStoreSupported && !ReactRendererVersionMismatchWarnOnce) {
+-    ReactRendererVersionMismatchWarnOnce = true;
+-    Recoil_recoverableViolation('A React renderer without React 18+ API support is being used with React 18+.');
+-  }
+-
+-  return isUseSyncExternalStoreSupported;
++  return true;
+ }
+
+ /**
+diff --git a/umd/index.js b/umd/index.js
+index 5e0cffb75926ceebd2d385776870d41c9941cf66..87329fc5ee193057a282f1255dcfd11935206973 100644
+--- a/umd/index.js
++++ b/umd/index.js
+@@ -504,26 +504,7 @@
+   // change we can't simply check if `React.useSyncExternalStore()` is defined.
+
+   function currentRendererSupportsUseSyncExternalStore() {
+-    var _ReactCurrentDispatch;
+-
+-    // $FlowFixMe[incompatible-use]
+-    const {
+-      ReactCurrentDispatcher,
+-      ReactCurrentOwner
+-    } =
+-    /* $FlowFixMe[prop-missing] This workaround was approved as a safer mechanism
+-     * to detect if the current renderer supports useSyncExternalStore()
+-     * https://fb.workplace.com/groups/reactjs/posts/9558682330846963/ */
+-    react.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+-    const dispatcher = (_ReactCurrentDispatch = ReactCurrentDispatcher === null || ReactCurrentDispatcher === void 0 ? void 0 : ReactCurrentDispatcher.current) !== null && _ReactCurrentDispatch !== void 0 ? _ReactCurrentDispatch : ReactCurrentOwner.currentDispatcher;
+-    const isUseSyncExternalStoreSupported = dispatcher.useSyncExternalStore != null;
+-
+-    if (useSyncExternalStore && !isUseSyncExternalStoreSupported && !ReactRendererVersionMismatchWarnOnce) {
+-      ReactRendererVersionMismatchWarnOnce = true;
+-      Recoil_recoverableViolation('A React renderer without React 18+ API support is being used with React 18+.');
+-    }
+-
+-    return isUseSyncExternalStoreSupported;
++    return true;
+   }
+
+   /**

apps/portal/.eslintrc.cjs → apps/portal/eslint.config.cjs

@@ -9,4 +9,5 @@ module.exports = {
       },
     ],
   },
+  files: ['src/**/*.(ts,tsx)'],
 }

apps/portal/package.json

@@ -10,7 +10,7 @@
   "scripts": {
     "dev": "vite --host",
     "build": "vite build",
-    "lint": "eslint src",
+    "lint": "eslint",
     "check-types": "tsc --noEmit",
     "e2e": "playwright test",
     "storybook": "storybook dev -p 6007",
@@ -59,15 +59,15 @@
     "md5": "^2.3.0",
     "mipd": "^0.0.7",
     "posthog-js": "^1.93.6",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
+    "react": "19.0.0-beta-26f2496093-20240514",
+    "react-dom": "19.0.0-beta-26f2496093-20240514",
     "react-i18next": "^11.18.6",
     "react-infinite-scroller": "^1.2.6",
     "react-object-view": "^0.3.4",
     "react-router-dom": "^6.12.0",
     "react-use": "^17.4.0",
     "react-winbox": "^1.5.0",
-    "recoil": "^0.7.7",
+    "recoil": "patch:recoil@patch%3Arecoil@npm%253A0.7.7%23./.yarn/patches/recoil-npm-0.7.7-4452f58b67.patch%3A%3Aversion=0.7.7&hash=782944&locator=talisman-web%2540workspace%253A.#~/.yarn/patches/recoil-patch-34a7806c1c.patch",
     "safety-match": "^0.4.4",
     "threads": "^1.7.0",
     "victory": "^36.6.8",
@@ -100,8 +100,9 @@
     "@types/react-infinite-scroller": "^1.2.3",
     "@types/react-router-dom": "^5.3.3",
     "@vitejs/plugin-react": "^4.2.1",
+    "babel-plugin-react-compiler": "0.0.0-experimental-c23de8d-20240515",
     "dotenv": "^16.3.1",
-    "eslint": "^8.33.0",
+    "eslint": "^9.2.0",
     "eslint-config-prettier": "^8.6.0",
     "eslint-plugin-storybook": "^0.6.15",
     "prop-types": "^15.8.1",

apps/portal/vite.config.ts

@@ -7,7 +7,7 @@ export default defineConfig({
     react({
       jsxImportSource: '@emotion/react',
       babel: {
-        plugins: ['@emotion/babel-plugin'],
+        plugins: ['babel-plugin-react-compiler', '@emotion/babel-plugin'],
       },
     }),
     svgr(),

package.json

@@ -22,7 +22,7 @@
     "@commitlint/cli": "^18.4.3",
     "@commitlint/config-conventional": "^18.4.3",
     "@trivago/prettier-plugin-sort-imports": "^4.3.0",
-    "eslint": "^8.33.0",
+    "eslint": "^9.2.0",
     "husky": "^8.0.3",
     "prettier": "^2.8.8",
     "pretty-quick": "^3.1.3",
@@ -45,6 +45,7 @@
     "@types/react": "^18.2.57",
     "json-stream-stringify": "2.0.4",
     "recoil@^0.7.7": "patch:recoil@npm%3A0.7.7#./.yarn/patches/recoil-npm-0.7.7-4452f58b67.patch",
-    "threads@^1.7.0": "patch:threads@npm%3A1.7.0#./.yarn/patches/threads-npm-1.7.0-c432dbb3e9.patch"
+    "threads@^1.7.0": "patch:threads@npm%3A1.7.0#./.yarn/patches/threads-npm-1.7.0-c432dbb3e9.patch",
+    "recoil@npm:^0.6.1": "patch:recoil@patch%3Arecoil@npm%253A0.7.7%23./.yarn/patches/recoil-npm-0.7.7-4452f58b67.patch%3A%3Aversion=0.7.7&hash=782944&locator=talisman-web%2540workspace%253A.#~/.yarn/patches/recoil-patch-34a7806c1c.patch"
   }
 }

packages/eslint-config/package.json

@@ -3,14 +3,15 @@
   "name": "@talismn/eslint-config",
   "version": "0.0.0",
   "dependencies": {
-    "@typescript-eslint/eslint-plugin": "^5.43.0",
-    "eslint-config-prettier": "^8.8.0",
-    "eslint-config-standard-with-typescript": "latest",
-    "eslint-plugin-import": "^2.25.2",
-    "eslint-plugin-n": "^15.0.0",
-    "eslint-plugin-promise": "^6.0.0",
-    "eslint-plugin-react": "latest",
-    "eslint-plugin-react-hooks": "^4.6.0"
+    "@typescript-eslint/eslint-plugin": "^7.9.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-config-standard-with-typescript": "^43.0.1",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-n": "^17.7.0",
+    "eslint-plugin-promise": "^6.1.1",
+    "eslint-plugin-react": "^7.34.1",
+    "eslint-plugin-react-compiler": "0.0.0-experimental-53bb89e-20240515",
+    "eslint-plugin-react-hooks": "^4.6.2"
   },
   "peerDependencies": {
     "eslint": "*",

packages/eslint-config/react.js

@@ -1,6 +1,6 @@
 module.exports = {
   extends: ['@talismn', 'plugin:react/recommended', 'plugin:react/jsx-runtime', 'plugin:react-hooks/recommended'],
-  plugins: ['react'],
+  plugins: ['react', 'eslint-plugin-react-compiler'],
   settings: {
     react: {
       version: 'detect',
@@ -10,5 +10,6 @@ module.exports = {
     'react/display-name': 'off',
     'react/no-unescaped-entities': 'off',
     'react/no-unknown-property': ['error', { ignore: ['css'] }],
+    'react-compiler/react-compiler': 2,
   },
 }

packages/icons/.eslintrc.cjs → packages/icons/eslint.config.cjs

@@ -2,4 +2,5 @@ module.exports = {
   root: true,
   extends: '@talismn/eslint-config/react',
   ignorePatterns: ['src/components'],
+  files: ['src/**/*.(ts,tsx)'],
 }

packages/icons/package.json

@@ -13,20 +13,20 @@
     "dev": "tsc --build --watch tsconfig.json",
     "build": "rm -rf build && tsc --build tsconfig.json",
     "codegen": "npx @svgr/cli -- src/svgs",
-    "lint": "eslint src",
+    "lint": "eslint",
     "check-types": "tsc --noEmit"
   },
   "devDependencies": {
     "@svgr/cli": "^8.0.1",
     "@talismn/eslint-config": "workspace:^",
     "@talismn/tsconfig": "workspace:^",
     "@types/react": "^18.3.1",
-    "eslint": "^8.37.0",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
+    "eslint": "^9.2.0",
+    "react": "^19.0.0-beta-26f2496093-20240514",
+    "react-dom": "^19.0.0-beta-26f2496093-20240514",
     "typescript": "^5.4.5"
   },
   "peerDependencies": {
-    "react": "18.x"
+    "react": "19.x"
   }
 }

packages/math/.eslintrc.cjs → packages/math/eslint.config.cjs

@@ -1,4 +1,5 @@
 module.exports = {
   root: true,
   extends: '@talismn',
+  files: ['src/**/*.(ts,tsx)'],
 }

packages/math/package.json

@@ -8,12 +8,12 @@
     "dev": "tsc --build --watch tsconfig.json",
     "build": "rm -rf build && tsc --build tsconfig.json",
     "test": "vitest run",
-    "lint": "eslint src",
+    "lint": "eslint",
     "check-types": "tsc --noEmit"
   },
   "devDependencies": {
     "@talismn/tsconfig": "workspace:^",
-    "eslint": "^8.39.0",
+    "eslint": "^9.2.0",
     "typescript": "^5.4.5",
     "vitest": "^1.6.0"
   }

packages/react-polkadot-api/.eslintrc.cjs → packages/react-polkadot-api/eslint.config.cjs

@@ -1,4 +1,5 @@
 module.exports = {
   root: true,
   extends: '@talismn',
+  files: ['src/**/*.(ts,tsx)'],
 }

packages/react-polkadot-api/package.json

@@ -7,7 +7,7 @@
   "scripts": {
     "dev": "tsc --build --watch tsconfig.json",
     "build": "rm -rf build && tsc --build tsconfig.json",
-    "lint": "eslint src",
+    "lint": "eslint",
     "check-types": "tsc --noEmit"
   },
   "dependencies": {
@@ -18,13 +18,13 @@
     "@talismn/eslint-config": "workspace:^",
     "@talismn/tsconfig": "workspace:^",
     "@types/react": "^18.3.1",
-    "eslint": "^8.33.0",
-    "recoil": "^0.7.7",
+    "eslint": "^9.2.0",
+    "recoil": "patch:recoil@patch%3Arecoil@npm%253A0.7.7%23./.yarn/patches/recoil-npm-0.7.7-4452f58b67.patch%3A%3Aversion=0.7.7&hash=782944&locator=talisman-web%2540workspace%253A.#~/.yarn/patches/recoil-patch-34a7806c1c.patch",
     "typescript": "^5.4.5"
   },
   "peerDependencies": {
     "@polkadot/api": ">= 9.x",
-    "react": ">= 18.x",
+    "react": "19.x",
     "recoil": ">= 0.7.x"
   }
 }

packages/ui/.eslintrc.cjs → packages/ui/eslint.config.cjs

@@ -1,4 +1,5 @@
 module.exports = {
   root: true,
   extends: ['@talismn/eslint-config/react', 'plugin:storybook/recommended'],
+  files: ['src/**/*.(ts,tsx)'],
 }

packages/ui/package.json

@@ -14,7 +14,7 @@
   "scripts": {
     "dev": "tsc --build --watch tsconfig.build.json",
     "build": "rm -rf build && tsc --build tsconfig.build.json",
-    "lint": "eslint src",
+    "lint": "eslint",
     "check-types": "tsc --noEmit",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build"
@@ -50,20 +50,20 @@
     "@types/mime-types": "^2.1.1",
     "@types/react": "^18.3.1",
     "babel-loader": "^8.3.0",
-    "eslint": "^8.37.0",
+    "eslint": "^9.2.0",
     "eslint-plugin-storybook": "^0.6.15",
     "framer-motion": "^11.1.9",
     "mime-db": "^1.52.0",
     "prop-types": "^15.8.1",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
+    "react": "^19.0.0-beta-26f2496093-20240514",
+    "react-dom": "^19.0.0-beta-26f2496093-20240514",
     "storybook": "^7.6.5",
     "typescript": "^5.4.5"
   },
   "peerDependencies": {
     "@emotion/react": "11.x",
     "@talismn/web-icons": "*",
     "framer-motion": "11.x",
-    "react": "18.x"
+    "react": "19.x"
   }
 }

packages/utils/package.json

@@ -16,6 +16,6 @@
     "typescript": "^5.4.5"
   },
   "peerDependencies": {
-    "react": "18.x"
+    "react": "19.x"
   }
 }