From c0931d2b79fc0f6bab84d6ea7b136bd0f46f34b7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=CA=8Co=CA=9E=C9=A5s=CA=8E=C9=B9=20q=C7=9Dl=C6=83?=
 <gleb@ryshkov.com>
Date: Thu, 29 Sep 2022 09:24:28 -0400
Subject: [PATCH] fix: fixed nextjs/react hydration error when using portals
 (#1517)

Co-authored-by: Brandon Scott <contact@brandonscott.me>
---
 src/portal/src/Portal.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/portal/src/Portal.js b/src/portal/src/Portal.js
index d6ba8eb90..7357e61b9 100644
--- a/src/portal/src/Portal.js
+++ b/src/portal/src/Portal.js
@@ -17,9 +17,12 @@ export default class Portal extends Component {
       portalContainer.setAttribute('evergreen-portal-container', '')
       document.body.appendChild(portalContainer)
     }
+  }
 
+  componentDidMount() {
     this.el = document.createElement('div')
     portalContainer.appendChild(this.el)
+    this.forceUpdate()
   }
 
   componentWillUnmount() {
@@ -27,8 +30,7 @@ export default class Portal extends Component {
   }
 
   render() {
-    // This fixes SSR
-    if (!canUseDom) return null
+    if (!this.el) return null
     return ReactDOM.createPortal(this.props.children, this.el)
   }
 }