Replaced react-helmet-async with react-helmet

client/modules/About/pages/About.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { useSelector } from 'react-redux';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { Link } from 'react-router-dom';
 

client/modules/App/App.jsx

@@ -2,7 +2,7 @@ import PropTypes from 'prop-types';
 import React, { useEffect, useRef, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { useLocation } from 'react-router-dom';
-import { HelmetProvider } from 'react-helmet-async';
+import Helmet from 'react-helmet';
 import { showReduxDevTools } from '../../store';
 import DevTools from './components/DevTools';
 import { setPreviousPath } from '../IDE/actions/ide';
@@ -51,13 +51,11 @@ const App = ({ children }) => {
   const hide = hideCookieConsent(location.pathname);
 
   return (
-    <HelmetProvider>
-      <div className="app">
-        <CookieConsent hide={hide} />
-        {isMounted && showReduxDevTools() && <DevTools />}
-        {children}
-      </div>
-    </HelmetProvider>
+    <div className="app">
+      <CookieConsent hide={hide} />
+      {isMounted && showReduxDevTools() && <DevTools />}
+      {children}
+    </div>
   );
 };
 

client/modules/IDE/components/AddToCollectionList.jsx

@@ -1,6 +1,6 @@
 import PropTypes from 'prop-types';
 import React, { useEffect, useState } from 'react';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { useDispatch, useSelector } from 'react-redux';
 import styled from 'styled-components';

client/modules/IDE/components/AddToCollectionSketchList.jsx

@@ -1,6 +1,6 @@
 import PropTypes from 'prop-types';
 import React, { useEffect, useState } from 'react';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useDispatch, useSelector } from 'react-redux';
 import { useTranslation } from 'react-i18next';
 import { addToCollection, removeFromCollection } from '../actions/collections';

client/modules/IDE/components/AssetList.jsx

@@ -1,6 +1,6 @@
 import React, { useEffect } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import AssetListRow from './AssetListRow';
 import Loader from '../../App/components/loader';

client/modules/IDE/components/CollectionList/CollectionList.jsx

@@ -1,6 +1,6 @@
 import PropTypes from 'prop-types';
 import React, { useEffect, useState, useMemo } from 'react';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';

client/modules/IDE/components/Feedback.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import GitHubLogo from '../../../images/github.svg';
 

client/modules/IDE/components/Preferences/index.jsx

@@ -1,5 +1,5 @@
 import React, { useContext, useMemo, useRef, useState } from 'react';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useDispatch, useSelector } from 'react-redux';
 import { Tab, Tabs, TabList, TabPanel } from 'react-tabs';
 import { useTranslation } from 'react-i18next';

client/modules/IDE/components/SketchList.jsx

@@ -1,7 +1,7 @@
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import React, { useEffect, useState, useMemo, useCallback } from 'react';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { connect } from 'react-redux';
 import { useTranslation } from 'react-i18next';
 import { bindActionCreators } from 'redux';

client/modules/IDE/pages/FullView.jsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useDispatch, useSelector } from 'react-redux';
 import { useParams } from 'react-router-dom';
 import PreviewFrame from '../components/PreviewFrame';

client/modules/IDE/pages/IDEView.jsx

@@ -2,7 +2,7 @@ import React, { useEffect, useRef, useState } from 'react';
 import { useLocation, Prompt, useParams } from 'react-router-dom';
 import { useDispatch, useSelector } from 'react-redux';
 import { useTranslation } from 'react-i18next';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import SplitPane from 'react-split-pane';
 import IDEKeyHandlers from '../components/IDEKeyHandlers';
 import Sidebar from '../components/Sidebar';

client/modules/Legal/pages/Legal.jsx

@@ -1,7 +1,7 @@
 import axios from 'axios';
 import PropTypes from 'prop-types';
 import React, { useEffect, useState } from 'react';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import styled from 'styled-components';
 import RouterTab from '../../../common/RouterTab';

client/modules/User/components/Collection.jsx

@@ -1,7 +1,7 @@
 import PropTypes from 'prop-types';
 import React, { useEffect } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import classNames from 'classnames';
 import * as CollectionsActions from '../../IDE/actions/collections';

client/modules/User/components/CollectionCreate.jsx

@@ -1,5 +1,5 @@
 import React, { useMemo, useState } from 'react';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { useDispatch } from 'react-redux';
 

client/modules/User/pages/AccountView.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { useSelector } from 'react-redux';
 import { Tab, Tabs, TabList, TabPanel } from 'react-tabs';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { useHistory, useLocation } from 'react-router-dom';
 import { parse } from 'query-string';

client/modules/User/pages/EmailVerificationView.jsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useMemo } from 'react';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useLocation, useHistory } from 'react-router-dom';
 import { useSelector, useDispatch } from 'react-redux';
 import { useTranslation } from 'react-i18next';

client/modules/User/pages/LoginView.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Link } from 'react-router-dom';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import LoginForm from '../components/LoginForm';
 import SocialAuthButton from '../components/SocialAuthButton';

client/modules/User/pages/NewPasswordView.jsx

@@ -1,7 +1,7 @@
 import React, { useEffect } from 'react';
 import classNames from 'classnames';
 import { useDispatch, useSelector } from 'react-redux';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { useParams } from 'react-router-dom';
 import NewPasswordForm from '../components/NewPasswordForm';

client/modules/User/pages/ResetPasswordView.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { Link } from 'react-router-dom';
 import classNames from 'classnames';
 import { useSelector } from 'react-redux';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import ResetPasswordForm from '../components/ResetPasswordForm';
 import RootPage from '../../../components/RootPage';

client/modules/User/pages/SignupView.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Link } from 'react-router-dom';
-import { Helmet } from 'react-helmet-async';
+import { Helmet } from 'react-helmet';
 import { useTranslation, Trans } from 'react-i18next';
 import SignupForm from '../components/SignupForm';
 import SocialAuthButton from '../components/SocialAuthButton';

client/test-utils.js

@@ -20,7 +20,6 @@ import { createMemoryHistory } from 'history';
 import { I18nextProvider } from 'react-i18next';
 import { ThemeProvider as StyledThemeProvider } from 'styled-components';
 import { Context as ResponsiveContext } from 'react-responsive';
-import { HelmetProvider } from 'react-helmet-async';
 
 import i18n from './i18n-test';
 import ThemeProvider from './modules/App/components/ThemeProvider';
@@ -56,15 +55,13 @@ ResponsiveProvider.defaultProps = {
 
 const Providers = ({ children, ...options }) => (
   // eslint-disable-next-line react/jsx-filename-extension
-  <HelmetProvider>
-    <StyledThemeProvider theme={{ ...theme[Theme.light] }}>
-      <I18nextProvider i18n={i18n}>
-        <ResponsiveProvider {...options}>
-          <Router history={history}>{children}</Router>
-        </ResponsiveProvider>
-      </I18nextProvider>
-    </StyledThemeProvider>
-  </HelmetProvider>
+  <StyledThemeProvider theme={{ ...theme[Theme.light] }}>
+    <I18nextProvider i18n={i18n}>
+      <ResponsiveProvider {...options}>
+        <Router history={history}>{children}</Router>
+      </ResponsiveProvider>
+    </I18nextProvider>
+  </StyledThemeProvider>
 );
 
 Providers.propTypes = {
@@ -101,17 +98,15 @@ function reduxRender(
 ) {
   function Wrapper({ children }) {
     return (
-      <HelmetProvider>
-        <I18nextProvider i18n={i18n}>
-          <Provider store={store}>
-            <ThemeProvider>
-              <ResponsiveProvider {...renderOptions}>
-                <Router history={history}>{children}</Router>
-              </ResponsiveProvider>
-            </ThemeProvider>
-          </Provider>
-        </I18nextProvider>
-      </HelmetProvider>
+      <I18nextProvider i18n={i18n}>
+        <Provider store={store}>
+          <ThemeProvider>
+            <ResponsiveProvider {...renderOptions}>
+              <Router history={history}>{children}</Router>
+            </ResponsiveProvider>
+          </ThemeProvider>
+        </Provider>
+      </I18nextProvider>
     );
   }
 

package.json

@@ -232,7 +232,6 @@
     "react-final-form": "^6.5.3",
     "react-ga": "^3.3.0",
     "react-helmet": "^5.1.3",
-    "react-helmet-async": "^2.0.5",
     "react-i18next": "^11.11.3",
     "react-icons": "^4.11.0",
     "react-markdown": "^6.0.3",

update-helmet.js

@@ -9,20 +9,20 @@ async function updateHelmetImports(filePath) {
   try {
     const content = await readFile(filePath, 'utf8');
 
-    // Check if the file imports Helmet from react-helmet
+    // Check if the file imports Helmet from react-helmet-async
     if (
-      content.includes("import { Helmet } from 'react-helmet'") ||
-      content.includes("import Helmet from 'react-helmet'")
+      content.includes("import { Helmet } from 'react-helmet-async'") ||
+      content.includes("import { HelmetProvider } from 'react-helmet-async'")
     ) {
       // Replace the import statement
       const updatedContent = content
         .replace(
-          "import { Helmet } from 'react-helmet'",
-          "import { Helmet } from 'react-helmet-async'"
+          "import { Helmet } from 'react-helmet-async'",
+          "import { Helmet } from 'react-helmet'"
         )
         .replace(
-          "import Helmet from 'react-helmet'",
-          "import { Helmet } from 'react-helmet-async'"
+          "import { HelmetProvider } from 'react-helmet-async'",
+          "import Helmet from 'react-helmet'"
         );
 
       // Write the updated content back to the file