diff --git a/app/soapbox/main.tsx b/app/soapbox/main.tsx
index 41dd3a233a..671e7a7523 100644
--- a/app/soapbox/main.tsx
+++ b/app/soapbox/main.tsx
@@ -3,7 +3,7 @@
import './precheck';
import * as OfflinePluginRuntime from '@lcdp/offline-plugin/runtime';
import React from 'react';
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
import { defineMessages } from 'react-intl';
import { setSwUpdating } from 'soapbox/actions/sw';
@@ -34,9 +34,10 @@ function main() {
}
ready(() => {
- const mountNode = document.getElementById('soapbox') as HTMLElement;
+ const container = document.getElementById('soapbox') as HTMLElement;
+ const root = createRoot(container);
- ReactDOM.render(, mountNode);
+ root.render();
if (BuildConfig.NODE_ENV === 'production') {
// avoid offline in dev mode because it's harder to debug