diff --git a/packages/suite-desktop-ui/package.json b/packages/suite-desktop-ui/package.json
index b52b3c8406e..4c078010aec 100644
--- a/packages/suite-desktop-ui/package.json
+++ b/packages/suite-desktop-ui/package.json
@@ -27,6 +27,7 @@
"@trezor/utils": "workspace:*",
"react": "18.2.0",
"react-dom": "18.2.0",
+ "react-helmet-async": "^2.0.4",
"react-markdown": "^9.0.1",
"react-redux": "8.0.7",
"react-router-dom": "^5.2.0",
diff --git a/packages/suite-desktop-ui/src/Main.tsx b/packages/suite-desktop-ui/src/Main.tsx
index d66e38332f4..17ac73fb8e0 100644
--- a/packages/suite-desktop-ui/src/Main.tsx
+++ b/packages/suite-desktop-ui/src/Main.tsx
@@ -1,5 +1,6 @@
import { Provider as ReduxProvider } from 'react-redux';
import { Router as RouterProvider } from 'react-router-dom';
+import { HelmetProvider } from 'react-helmet-async';
import { createRoot } from 'react-dom/client';
import { init as initSentry } from '@sentry/electron/renderer';
@@ -34,6 +35,7 @@ import * as STORAGE from 'src/actions/suite/constants/storageConstants';
import { DesktopUpdater } from './support/DesktopUpdater';
import { AppRouter } from './support/Router';
import { TorLoadingScreen } from './support/screens/TorLoadingScreen';
+import { StrictMode } from 'react';
const Main = () => {
useTor();
@@ -41,30 +43,34 @@ const Main = () => {
const formattersConfig = useFormattersConfig();
return (
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
);
};
diff --git a/packages/suite-web/package.json b/packages/suite-web/package.json
index b1dc5738c66..c00665b7c70 100644
--- a/packages/suite-web/package.json
+++ b/packages/suite-web/package.json
@@ -22,7 +22,7 @@
"cypress-real-events": "^1.11.0",
"react": "18.2.0",
"react-dom": "18.2.0",
- "react-helmet": "^6.1.0",
+ "react-helmet-async": "^2.0.4",
"react-redux": "8.0.7",
"react-router": "^5.2.0",
"react-router-dom": "^5.2.0",
@@ -44,7 +44,6 @@
"@types/cypress-image-snapshot": "^3.1.8",
"@types/react": "18.2.79",
"@types/react-dom": "18.2.19",
- "@types/react-helmet": "^6.1.11",
"@types/react-router": "^5.1.20",
"@types/react-router-dom": "^5.1.7",
"chrome-remote-interface": "^0.33.0",
diff --git a/packages/suite-web/src/Main.tsx b/packages/suite-web/src/Main.tsx
index e4cf8862161..f5b1191b49c 100644
--- a/packages/suite-web/src/Main.tsx
+++ b/packages/suite-web/src/Main.tsx
@@ -25,6 +25,8 @@ import { ModalContextProvider } from 'src/support/suite/ModalContext';
import AppRouter from './support/Router';
import { useCypress } from './support/useCypress';
import { FormatterProvider } from '@suite-common/formatters';
+import { HelmetProvider } from 'react-helmet-async';
+import { StrictMode } from 'react';
const Main = () => {
useCypress();
@@ -33,28 +35,32 @@ const Main = () => {
const formattersConfig = useFormattersConfig();
return (
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
);
};
diff --git a/packages/suite-web/src/support/Router.tsx b/packages/suite-web/src/support/Router.tsx
index 49c5803374f..5421ae35e69 100644
--- a/packages/suite-web/src/support/Router.tsx
+++ b/packages/suite-web/src/support/Router.tsx
@@ -144,10 +144,6 @@ const components: Record>> = {
};
const AppRouter = () => (
- // inititating strict mode higher would throw an error from react-helmet
- // TODO: replace react-helmet with a maintained alternative
- // strict mode is commented out because of its interplay with compose errors in send form
- //
}>
{routes.map(route => (
@@ -160,7 +156,6 @@ const AppRouter = () => (
))}
- //
);
export default memo(AppRouter);
diff --git a/packages/suite/package.json b/packages/suite/package.json
index ae38aefbe4f..8b3e55f8853 100644
--- a/packages/suite/package.json
+++ b/packages/suite/package.json
@@ -94,7 +94,7 @@
"react": "18.2.0",
"react-dom": "18.2.0",
"react-focus-lock": "^2.9.7",
- "react-helmet": "^6.1.0",
+ "react-helmet-async": "^2.0.4",
"react-hook-form": "^7.50.1",
"react-intl": "^6.6.2",
"react-markdown": "^9.0.1",
diff --git a/packages/suite/src/components/suite/Metadata.tsx b/packages/suite/src/components/suite/Metadata.tsx
index fa45bacfbb1..333b593a183 100644
--- a/packages/suite/src/components/suite/Metadata.tsx
+++ b/packages/suite/src/components/suite/Metadata.tsx
@@ -1,5 +1,5 @@
import { SUITE_URL } from '@trezor/urls';
-import Helmet from 'react-helmet';
+import { Helmet } from 'react-helmet-async';
import { useIntl } from 'react-intl';
import messages from 'src/support/messages';
diff --git a/yarn.lock b/yarn.lock
index 1bc7e9a0ab6..38f14d0c481 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -10959,6 +10959,7 @@ __metadata:
"@types/react-dom": "npm:18.2.19"
react: "npm:18.2.0"
react-dom: "npm:18.2.0"
+ react-helmet-async: "npm:^2.0.4"
react-markdown: "npm:^9.0.1"
react-redux: "npm:8.0.7"
react-router-dom: "npm:^5.2.0"
@@ -11018,7 +11019,6 @@ __metadata:
"@types/cypress-image-snapshot": "npm:^3.1.8"
"@types/react": "npm:18.2.79"
"@types/react-dom": "npm:18.2.19"
- "@types/react-helmet": "npm:^6.1.11"
"@types/react-router": "npm:^5.1.20"
"@types/react-router-dom": "npm:^5.1.7"
chrome-remote-interface: "npm:^0.33.0"
@@ -11028,7 +11028,7 @@ __metadata:
cypress-real-events: "npm:^1.11.0"
react: "npm:18.2.0"
react-dom: "npm:18.2.0"
- react-helmet: "npm:^6.1.0"
+ react-helmet-async: "npm:^2.0.4"
react-redux: "npm:8.0.7"
react-router: "npm:^5.2.0"
react-router-dom: "npm:^5.2.0"
@@ -11146,7 +11146,7 @@ __metadata:
react: "npm:18.2.0"
react-dom: "npm:18.2.0"
react-focus-lock: "npm:^2.9.7"
- react-helmet: "npm:^6.1.0"
+ react-helmet-async: "npm:^2.0.4"
react-hook-form: "npm:^7.50.1"
react-intl: "npm:^6.6.2"
react-markdown: "npm:^9.0.1"
@@ -12521,15 +12521,6 @@ __metadata:
languageName: node
linkType: hard
-"@types/react-helmet@npm:^6.1.11":
- version: 6.1.11
- resolution: "@types/react-helmet@npm:6.1.11"
- dependencies:
- "@types/react": "npm:*"
- checksum: 10/e329d8ad82c365fec7dd7d91c8b6d167faac30cef0d9f1e27d7e895172a0ebfa65829fb4acabbe79283b01cbbe5840a845caeb50148ceef6f3fad42b3c2c4bdc
- languageName: node
- linkType: hard
-
"@types/react-qr-reader@npm:^2.1.7":
version: 2.1.7
resolution: "@types/react-qr-reader@npm:2.1.7"
@@ -33413,10 +33404,10 @@ __metadata:
languageName: node
linkType: hard
-"react-fast-compare@npm:^3.1.1":
- version: 3.2.0
- resolution: "react-fast-compare@npm:3.2.0"
- checksum: 10/26ed35d425f197f04c85d572eac943d901a2713335b79483d4f3f94ee5caf97f20678f89bedd385ace9b1637890c88fc5442d732bad0871135643d9703312cd7
+"react-fast-compare@npm:^3.2.2":
+ version: 3.2.2
+ resolution: "react-fast-compare@npm:3.2.2"
+ checksum: 10/a6826180ba75cefba1c8d3ac539735f9b627ca05d3d307fe155487f5d0228d376dac6c9708d04a283a7b9f9aee599b637446635b79c8c8753d0b4eece56c125c
languageName: node
linkType: hard
@@ -33463,17 +33454,17 @@ __metadata:
languageName: node
linkType: hard
-"react-helmet@npm:^6.1.0":
- version: 6.1.0
- resolution: "react-helmet@npm:6.1.0"
+"react-helmet-async@npm:^2.0.4":
+ version: 2.0.4
+ resolution: "react-helmet-async@npm:2.0.4"
dependencies:
- object-assign: "npm:^4.1.1"
- prop-types: "npm:^15.7.2"
- react-fast-compare: "npm:^3.1.1"
- react-side-effect: "npm:^2.1.0"
+ invariant: "npm:^2.2.4"
+ react-fast-compare: "npm:^3.2.2"
+ shallowequal: "npm:^1.1.0"
peerDependencies:
- react: ">=16.3.0"
- checksum: 10/eff25231384bb0a229870a0552839953a59af17f0ff5e8bca1b8c8fdf19a329e4c00c7fa2fcedc8be5d73f5c7bebb30cf9a32ea58efc7c8f726a10dba51f48a2
+ react: ^16.6.0 || ^17.0.0 || ^18.0.0
+ react-dom: ^16.6.0 || ^17.0.0 || ^18.0.0
+ checksum: 10/8f18cb27e8f5821811d715906b5fe279d4ce7e1e0ef1a565d90d64db386d2e4676fe7f4182d27393eccf7b03ace7d65fb4c406f945d43de3b57acaaa54711831
languageName: node
linkType: hard
@@ -33978,15 +33969,6 @@ __metadata:
languageName: node
linkType: hard
-"react-side-effect@npm:^2.1.0":
- version: 2.1.2
- resolution: "react-side-effect@npm:2.1.2"
- peerDependencies:
- react: ^16.3.0 || ^17.0.0 || ^18.0.0
- checksum: 10/8c31aaec5b383d942ff1775b12c45022239d1250d1a00a238bac3c07e0fe266c71991e2814ae16a5d9b855bcd96ba95817d48ab3f34738f0bb32036ebb1abb1a
- languageName: node
- linkType: hard
-
"react-smooth@npm:^4.0.0":
version: 4.0.0
resolution: "react-smooth@npm:4.0.0"
@@ -35833,7 +35815,7 @@ __metadata:
languageName: node
linkType: hard
-"shallowequal@npm:1.1.0":
+"shallowequal@npm:1.1.0, shallowequal@npm:^1.1.0":
version: 1.1.0
resolution: "shallowequal@npm:1.1.0"
checksum: 10/f4c1de0837f106d2dbbfd5d0720a5d059d1c66b42b580965c8f06bb1db684be8783538b684092648c981294bf817869f743a066538771dbecb293df78f765e00