use react 18 concurrent mode

packages/docs-new/package.json

@@ -10,8 +10,8 @@
   "dependencies": {
     "express": "^4.17.2",
     "reacord": "workspace:*",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
+    "react": "^18.0.0-rc.0",
+    "react-dom": "^18.0.0-rc.0",
     "react-head": "^3.4.0",
     "react-router-dom": "^6.2.1"
   },

packages/docs-new/src/entry.client.tsx

@@ -1,13 +1,18 @@
-import { hydrate } from "react-dom"
+import { createRoot } from "react-dom"
 import { HeadProvider } from "react-head"
 import { ReactLocation } from "react-location"
 import { App } from "./app"
 
 const location = new ReactLocation()
 
-hydrate(
+createRoot(document.querySelector("#app")!).render(
   <HeadProvider>
     <App location={location} />
   </HeadProvider>,
-  document.querySelector("#app"),
 )
+
+declare module "react-dom" {
+  export function createRoot(element: Element): {
+    render(element: React.ReactNode): void
+  }
+}