import React from 'react'
import config from 'config:sanity'
import RootComponent from 'part:@sanity/base/root'
import SnackbarProvider from 'part:@sanity/components/snackbar/provider'
import {userColorManager, UserColorManagerProvider} from '../user-color'
import ErrorHandler from './ErrorHandler'
import VersionChecker from './VersionChecker'
import MissingProjectConfig from './MissingProjectConfig'
import styles from './styles/SanityRoot.css'
import DevServerStatus from './DevServerStatus'

function SanityRoot() {
  const {projectId, dataset} = config.api || {}

  if (!projectId || !dataset) {
    return <MissingProjectConfig />
  }

  return (
    <div className={styles.root}>
      <UserColorManagerProvider manager={userColorManager}>
        <SnackbarProvider>
          <DevServerStatus />
          <ErrorHandler />
          <RootComponent />
          <VersionChecker />
        </SnackbarProvider>
      </UserColorManagerProvider>
    </div>
  )
}

export default SanityRoot

@@ -5,16 +5,37 @@
 rt React
+, %7BuseRef, useEffect%7D
  from 'r
@@ -126,16 +126,78 @@
 e/root'%0A
+import %7BPortalProvider%7D from 'part:@sanity/components/portal'%0A
 import S
@@ -645,16 +645,474 @@
 pi %7C%7C %7B%7D
+%0A  const rootRef = useRef(null)%0A  const portalRef = useRef(document.createElement('div'))%0A%0A  // attach the global portal element%0A  useEffect(() =%3E %7B%0A    // set a data attribute for debugging%0A    portalRef.current.setAttribute('data-portal', '')%0A%0A    if (rootRef.current) %7B%0A      rootRef.current.appendChild(portalRef.current)%0A    %7D%0A%0A    return () =%3E %7B%0A      if (rootRef.current) %7B%0A        rootRef.current.removeChild(portalRef.current)%0A      %7D%0A    %7D%0A  %7D, %5B%5D)
 %0A%0A  if (
@@ -1221,18 +1221,85 @@
 es.root%7D
-%3E%0A
+ ref=%7BrootRef%7D%3E%0A      %3CPortalProvider element=%7BportalRef.current%7D%3E%0A  
       %3CU
@@ -1358,16 +1358,18 @@
         
+  
 %3CSnackba
@@ -1389,16 +1389,18 @@
         
+ 
+ 
 %3CDevServ
@@ -1421,16 +1421,18 @@
         
+  
 %3CErrorHa
@@ -1436,24 +1436,26 @@
 rHandler /%3E%0A
+  
           %3CR
@@ -1480,16 +1480,18 @@
         
+  
 %3CVersion
@@ -1497,24 +1497,26 @@
 nChecker /%3E%0A
+  
         %3C/Sn
@@ -1537,16 +1537,18 @@
 %3E%0A      
+  
 %3C/UserCo
@@ -1563,24 +1563,48 @@
 erProvider%3E%0A
+      %3C/PortalProvider%3E%0A
     %3C/div%3E%0A 

Add the global portal provider