diff --git a/packages/client/src/bootstrap.js b/packages/client/src/bootstrap.js
index c4171efcbd..13371170e1 100644
--- a/packages/client/src/bootstrap.js
+++ b/packages/client/src/bootstrap.js
@@ -1,9 +1,10 @@
import React from "react";
-import ReactDOM from "react-dom";
+import { createRoot } from "react-dom/client";
import App from "./App";
//import { registerSW } from "@docspace/common/sw/helper";
-const root = document.getElementById("root");
-if (root) ReactDOM.render(, root);
+const container = document.getElementById("root");
+const root = createRoot(container);
+if (root) root.render();
//registerSW();
diff --git a/packages/editor/src/client/bootstrap.js b/packages/editor/src/client/bootstrap.js
index 26d7656401..3a9cd1aef0 100644
--- a/packages/editor/src/client/bootstrap.js
+++ b/packages/editor/src/client/bootstrap.js
@@ -1,5 +1,5 @@
import React from "react";
-import { hydrate } from "react-dom";
+import { hydrateRoot } from "react-dom/client";
// import { registerSW } from "@docspace/common/sw/helper";
import App from "./App.js";
import pkg from "../../package.json";
@@ -11,17 +11,19 @@ const initialLanguage = window.initialLanguage;
initI18n(initialI18nStoreASC);
-hydrate(
- }>
-
- ,
- document.getElementById("root")
-);
-
+const container = document.getElementById("root");
+if (container) {
+ hydrateRoot(
+ container,
+ }>
+
+
+ );
+}
if (IS_DEVELOPMENT) {
const port = PORT || 5013;
const socketPath = pkg.socketPath;
diff --git a/packages/login/src/client/bootstrap.tsx b/packages/login/src/client/bootstrap.tsx
index 8827247187..1a866ba045 100644
--- a/packages/login/src/client/bootstrap.tsx
+++ b/packages/login/src/client/bootstrap.tsx
@@ -1,5 +1,5 @@
import React from "react";
-import { hydrate } from "react-dom";
+import { hydrateRoot } from "react-dom/client";
// import { registerSW } from "@docspace/common/sw/helper";
import pkg from "../../package.json";
import { initI18n } from "./helpers/utils";
@@ -14,15 +14,18 @@ if (isDesktopEditor) typeof window["AscDesktopEditor"];
initI18n(initialI18nStoreASC);
-hydrate(
- ,
- document.getElementById("root")
-);
+const container = document.getElementById("root");
+if (container) {
+ hydrateRoot(
+ container,
+
+ );
+}
if (IS_DEVELOPMENT) {
const port = PORT || 5011;