From 98050b96ec0f0f2f98714fb93349bc5c2bd8518b Mon Sep 17 00:00:00 2001
From: Peter Colapietro <petercolapietro+spacehippie@gmail.com>
Date: Tue, 6 Sep 2022 20:04:22 -0400
Subject: [PATCH] chore(react): add custom web index

- https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html#updates-to-client-rendering-apis
- https://redwoodjs.com/docs/cli-commands#setup-custom-web-index
---
 web/src/index.js | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)
 create mode 100644 web/src/index.js

diff --git a/web/src/index.js b/web/src/index.js
new file mode 100644
index 0000000..52f891b
--- /dev/null
+++ b/web/src/index.js
@@ -0,0 +1,17 @@
+import { hydrateRoot, createRoot } from 'react-dom/client'
+
+import App from './App'
+/**
+ * When `#redwood-app` isn't empty then it's very likely that you're using
+ * prerendering. So React attaches event listeners to the existing markup
+ * rather than replacing it.
+ * https://reactjs.org/docs/react-dom.html#hydrate
+ */
+const redwoodAppElement = document.getElementById('redwood-app')
+
+if (redwoodAppElement.children?.length > 0) {
+  hydrateRoot(redwoodAppElement, <App />)
+} else {
+  const root = createRoot(redwoodAppElement)
+  root.render(<App />)
+}