fix: solve the warning caused by react-helmet

ui/package.json

@@ -46,7 +46,7 @@
     "react": "^18.2.0",
     "react-bootstrap": "^2.5.0",
     "react-dom": "^18.2.0",
-    "react-helmet": "^6.1.0",
+    "react-helmet-async": "^1.3.0",
     "react-i18next": "^11.18.3",
     "react-router-dom": "^6.4.0",
     "swr": "^1.3.0",
@@ -108,4 +108,4 @@
     "pnpm": ">=7"
   },
   "license": "MIT"
-}
+}

ui/pnpm-lock.yaml

@@ -67,7 +67,7 @@ specifiers:
   react-app-rewired: ^2.2.1
   react-bootstrap: ^2.5.0
   react-dom: ^18.2.0
-  react-helmet: ^6.1.0
+  react-helmet-async: ^1.3.0
   react-i18next: ^11.18.3
   react-router-dom: ^6.4.0
   react-scripts: 5.0.1
@@ -102,7 +102,7 @@ dependencies:
   react: 18.2.0
   react-bootstrap: 2.5.0_7ey2zzynotv32rpkwno45fsx4e
   react-dom: 18.2.0_react@18.2.0
-  react-helmet: 6.1.0_react@18.2.0
+  react-helmet-async: 1.3.0_biqbaboplfbrettd7655fr4n2y
   react-i18next: 11.18.6_ulhmqqxshznzmtuvahdi5nasbq
   react-router-dom: 6.4.0_biqbaboplfbrettd7655fr4n2y
   swr: 1.3.0_react@18.2.0
@@ -9581,16 +9581,19 @@ packages:
     resolution: {integrity: sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==}
     dev: false
 
-  /react-helmet/6.1.0_react@18.2.0:
-    resolution: {integrity: sha512-4uMzEY9nlDlgxr61NL3XbKRy1hEkXmKNXhjbAIOVw5vcFrsdYbH2FEwcNyWvWinl103nXgzYNlns9ca+8kFiWw==}
+  /react-helmet-async/1.3.0_biqbaboplfbrettd7655fr4n2y:
+    resolution: {integrity: sha512-9jZ57/dAn9t3q6hneQS0wukqC2ENOBgMNVEhb/ZG9ZSxUetzVIw4iAmEU38IaVg3QGYauQPhSeUTuIUtFglWpg==}
     peerDependencies:
-      react: '>=16.3.0'
+      react: ^16.6.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.6.0 || ^17.0.0 || ^18.0.0
     dependencies:
-      object-assign: 4.1.1
+      '@babel/runtime': 7.19.0
+      invariant: 2.2.4
       prop-types: 15.8.1
       react: 18.2.0
+      react-dom: 18.2.0_react@18.2.0
       react-fast-compare: 3.2.0
-      react-side-effect: 2.1.2_react@18.2.0
+      shallowequal: 1.1.0
     dev: false
 
   /react-i18next/11.18.6_ulhmqqxshznzmtuvahdi5nasbq:
@@ -9747,14 +9750,6 @@ packages:
       - webpack-hot-middleware
       - webpack-plugin-serve
 
-  /react-side-effect/2.1.2_react@18.2.0:
-    resolution: {integrity: sha512-PVjOcvVOyIILrYoyGEpDN3vmYNLdy1CajSFNt4TDsVQC5KpTijDvWVoR+/7Rz2xT978D8/ZtFceXxzsPwZEDvw==}
-    peerDependencies:
-      react: ^16.3.0 || ^17.0.0 || ^18.0.0
-    dependencies:
-      react: 18.2.0
-    dev: false
-
   /react-transition-group/4.4.5_biqbaboplfbrettd7655fr4n2y:
     resolution: {integrity: sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==}
     peerDependencies:
@@ -10257,6 +10252,10 @@ packages:
   /setprototypeof/1.2.0:
     resolution: {integrity: sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==}
 
+  /shallowequal/1.1.0:
+    resolution: {integrity: sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==}
+    dev: false
+
   /shebang-command/2.0.0:
     resolution: {integrity: sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==}
     engines: {node: '>=8'}

ui/src/pages/Layout/index.tsx

@@ -1,7 +1,7 @@
 import { FC, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Outlet } from 'react-router-dom';
-import { Helmet } from 'react-helmet';
+import { Helmet, HelmetProvider } from 'react-helmet-async';
 
 import { SWRConfig } from 'swr';
 
@@ -56,11 +56,9 @@ const Layout: FC = () => {
   }
 
   return (
-    <>
+    <HelmetProvider>
       <Helmet>
-        {siteInfo ? (
-          <meta name="description" content={siteInfo.description} />
-        ) : null}
+        {siteInfo && <meta name="description" content={siteInfo.description} />}
       </Helmet>
       <SWRConfig
         value={{
@@ -74,7 +72,7 @@ const Layout: FC = () => {
         <Toast msg={toastMsg} variant={variant} onClose={closeToast} />
         <Footer />
       </SWRConfig>
-    </>
+    </HelmetProvider>
   );
 };