diff --git a/app/gui/src/dashboard/components/Devtools/EnsoDevtools.tsx b/app/gui/src/dashboard/components/Devtools/EnsoDevtools.tsx
index 894cdb06e3e0..a9ac0b4079c3 100644
--- a/app/gui/src/dashboard/components/Devtools/EnsoDevtools.tsx
+++ b/app/gui/src/dashboard/components/Devtools/EnsoDevtools.tsx
@@ -6,7 +6,8 @@
import * as React from 'react'
import * as authProvider from '#/providers/AuthProvider'
-import { useShowEnsoDevtools } from './EnsoDevtoolsProvider'
+import { useEffect } from 'react'
+import { ensoDevtoolsStore, useShowEnsoDevtools } from './EnsoDevtoolsProvider'
const EnsoDevtoolsImpl = React.lazy(() =>
import('./EnsoDevtoolsImpl').then((mod) => ({ default: mod.EnsoDevtools })),
@@ -18,6 +19,12 @@ export function EnsoDevtools() {
const showEnsoDevtools = useShowEnsoDevtools()
+ useEffect(() => {
+ if (isEnsoTeamMember) {
+ addToggleDevtoolsToWindow()
+ }
+ }, [isEnsoTeamMember])
+
const shouldDisplayDevtools = (() => {
if (showEnsoDevtools == null) {
return isEnsoTeamMember
@@ -32,3 +39,12 @@ export function EnsoDevtools() {
return
}
+
+/**
+ * Adds the `toggleDevtools` function to the window object.
+ */
+function addToggleDevtoolsToWindow() {
+ if (typeof window !== 'undefined') {
+ window.toggleDevtools = ensoDevtoolsStore.getState().toggleDevtools
+ }
+}
diff --git a/app/gui/src/dashboard/components/Devtools/EnsoDevtoolsProvider.tsx b/app/gui/src/dashboard/components/Devtools/EnsoDevtoolsProvider.tsx
index a6ccbbbfbbed..8c2ba8f2dce9 100644
--- a/app/gui/src/dashboard/components/Devtools/EnsoDevtoolsProvider.tsx
+++ b/app/gui/src/dashboard/components/Devtools/EnsoDevtoolsProvider.tsx
@@ -88,9 +88,9 @@ export const ensoDevtoolsStore = zustand.createStore()(
}),
{
name: 'ensoDevtools',
+ // eslint-disable-next-line @typescript-eslint/no-magic-numbers
+ version: 1.1,
partialize: (state) => ({
- showDevtools: state.showDevtools,
- showEnsoDevtools: state.showEnsoDevtools,
animationsDisabled: state.animationsDisabled,
}),
},
@@ -169,7 +169,3 @@ export function useSetShowDevtools() {
unsafeEnableTransition: true,
})
}
-
-if (typeof window !== 'undefined') {
- window.toggleDevtools = ensoDevtoolsStore.getState().toggleDevtools
-}
diff --git a/app/gui/src/dashboard/layouts/UserMenu.tsx b/app/gui/src/dashboard/layouts/UserMenu.tsx
index a5391baea47c..cf74d7fac61e 100644
--- a/app/gui/src/dashboard/layouts/UserMenu.tsx
+++ b/app/gui/src/dashboard/layouts/UserMenu.tsx
@@ -12,6 +12,7 @@ import { useText } from '#/providers/TextProvider'
import { Plan } from '#/services/Backend'
import { download } from '#/utilities/download'
import { getDownloadUrl } from '#/utilities/github'
+import { IS_DEV_MODE } from 'enso-common/src/detect'
import { useNavigate } from 'react-router-dom'
import { LOGIN_PATH } from '../appUtils'
import { useToggleEnsoDevtools } from '../components/Devtools'
@@ -62,7 +63,7 @@ export default function UserMenu(props: UserMenuProps) {
}}
/>
- {user.isEnsoTeamMember && (
+ {user.isEnsoTeamMember && IS_DEV_MODE && (
{