Use ReactDOM.createRoot()

Author: labkey-nicka

elisa/src/client/RunDetails/app.tsx

@@ -1,11 +1,11 @@
 import React from 'react';
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import { App } from '@labkey/api';
 
 import { AppContext, RunDetails } from './RunDetails';
 
 import './RunDetails.scss';
 
 App.registerApp<AppContext>('elisaRunDetails', (target: string, ctx: AppContext) => {
-    ReactDOM.render(<RunDetails context={ctx} />, document.getElementById(target));
+    createRoot(document.getElementById(target)).render(<RunDetails context={ctx} />);
 });

elisa/src/client/RunDetails/dev.tsx

@@ -1,12 +1,13 @@
 import React from 'react';
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import { App } from '@labkey/api';
 
 import { AppContext, RunDetails } from './RunDetails';
 
 import './RunDetails.scss';
 
-App.registerApp<AppContext>('elisaRunDetails', (target: string, ctx: AppContext) => {
-    ReactDOM.render(<RunDetails context={ctx} />, document.getElementById(target));
-}, true /* hot */);
+const render = (target: string, ctx: AppContext): void => {
+    createRoot(document.getElementById(target)).render(<RunDetails context={ctx} />);
+};
 
+App.registerApp<AppContext>('elisaRunDetails', render, true);