Hide GUI2 when not in Editor tab (#8445)

Fixes #8443

# Important Notes
None
This commit is contained in:
somebody1234 2023-12-12 22:18:10 +10:00 committed by GitHub
parent 80f94a21e1
commit 56a6dcc875
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 11 additions and 2 deletions

View File

@ -299,6 +299,10 @@ class Main implements AppRunner {
ideElement.style.top = '-100vh'
ideElement.style.display = 'fixed'
}
const ide2Element = document.getElementById('app')
if (ide2Element) {
ide2Element.style.display = 'none'
}
/** TODO [NP]: https://github.com/enso-org/cloud-v2/issues/345
* `content` and `dashboard` packages **MUST BE MERGED INTO ONE**. The IDE

View File

@ -16,6 +16,8 @@ const LOADER_ELEMENT_ID = 'loader'
const TOP_BAR_X_OFFSET_PX = 96
/** The `id` attribute of the element into which the IDE will be rendered. */
const IDE_ELEMENT_ID = 'root'
/** The `id` attribute of the element into which the new IDE will be rendered. */
const IDE2_ELEMENT_ID = 'app'
const IDE_CDN_BASE_URL = 'https://cdn.enso.org/ide'
const JS_EXTENSION: Record<backendModule.BackendType, string> = {
[backendModule.BackendType.remote]: '.js.gz',
@ -51,6 +53,10 @@ export default function Editor(props: EditorProps) {
ideElement.style.display = 'absolute'
}
}
const ide2Element = document.getElementById(IDE2_ELEMENT_ID)
if (ide2Element != null) {
ide2Element.style.display = hidden ? 'none' : ''
}
}, [hidden])
React.useEffect(() => {

View File

@ -49,7 +49,7 @@ export default function PageSwitcher(props: PageSwitcherProps) {
const { page, setPage, isEditorDisabled } = props
return (
<div
className={`flex items-center rounded-full shrink-0 gap-4 ${
className={`cursor-default pointer-events-auto flex items-center rounded-full shrink-0 gap-4 ${
page === Page.editor ? 'bg-frame backdrop-blur-3xl px-3 -mx-3' : ''
}`}
>
@ -63,7 +63,6 @@ export default function PageSwitcher(props: PageSwitcherProps) {
active={page === pageData.page}
disabled={isDisabled}
error={ERRORS[pageData.page]}
className="cursor-default pointer-events-auto"
onClick={() => {
setPage(pageData.page)
}}