SONAR-21017 Move to React 18's createRoot (see https://react.dev/blog/2022/03/08/react-18-upgrade-guide#updates-to-client-rendering-apis)

1 files changed, 3 insertions, 3 deletions

diff --git a/server/sonar-web/src/main/js/app/utils/startReactApp.tsx b/server/sonar-web/src/main/js/app/utils/startReactApp.tsx
index 985c80ab56b..9f071f050ce 100644
--- a/server/sonar-web/src/main/js/app/utils/startReactApp.tsx
+++ b/server/sonar-web/src/main/js/app/utils/startReactApp.tsx
@@ -21,7 +21,7 @@ import { ThemeProvider } from '@emotion/react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { lightTheme } from 'design-system';
 import * as React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import { Helmet, HelmetProvider } from 'react-helmet-async';
 import { IntlShape, RawIntlProvider } from 'react-intl';
 import {
@@ -259,8 +259,9 @@ export default function startReactApp(
   exportModulesAsGlobals();
 
   const el = document.getElementById('content');
+  const root = createRoot(el as HTMLElement);
 
-  render(
+  root.render(
     <HelmetProvider>
       <AppStateContextProvider appState={appState ?? DEFAULT_APP_STATE}>
         <AvailableFeaturesContext.Provider value={availableFeatures ?? DEFAULT_AVAILABLE_FEATURES}>
@@ -278,6 +279,5 @@ export default function startReactApp(
         </AvailableFeaturesContext.Provider>
       </AppStateContextProvider>
     </HelmetProvider>,
-    el,
   );
 }