WIP for fixing collaboration in new left panel

This commit is contained in:
Andrew Kingston 2023-08-23 14:45:23 +01:00
parent a7de2d8aca
commit 087812011f
5 changed files with 21 additions and 14 deletions

View File

@ -22,8 +22,8 @@
} }
const validate = id => { const validate = id => {
if (id === "screen") return true if (id === `${$store.selectedScreenId}-screen`) return true
if (id === "navigation") return true if (id === `${$store.selectedScreenId}-navigation`) return true
return !!findComponent($selectedScreen.props, id) return !!findComponent($selectedScreen.props, id)
} }
@ -42,9 +42,9 @@
onDestroy(stopSyncing) onDestroy(stopSyncing)
</script> </script>
{#if routeComponentId === "screen"} {#if routeComponentId === `${$store.selectedScreenId}-screen`}
<ScreenSettingsPanel /> <ScreenSettingsPanel />
{:else if routeComponentId === "navigation"} {:else if routeComponentId === `${$store.selectedScreenId}-navigation`}
<NavigationPanel /> <NavigationPanel />
{:else} {:else}
<ComponentSettingsPanel /> <ComponentSettingsPanel />

View File

@ -49,23 +49,27 @@
<NavItem <NavItem
text="Screen" text="Screen"
indentLevel={0} indentLevel={0}
selected={$store.selectedComponentId === "screen"} selected={$store.selectedComponentId ===
`${$store.selectedScreenId}-screen`}
opened opened
scrollable scrollable
icon="WebPage" icon="WebPage"
on:drop={onDrop} on:drop={onDrop}
on:click={() => { on:click={() => {
$store.selectedComponentId = "screen" $store.selectedComponentId = `${$store.selectedScreenId}-screen`
}} }}
id={`component-screen`} id={`component-screen`}
selectedBy={$userSelectedResourceMap["screen"]} selectedBy={$userSelectedResourceMap[
`${$store.selectedScreenId}-screen`
]}
> >
<ScreenslotDropdownMenu component={$selectedScreen?.props} /> <ScreenslotDropdownMenu component={$selectedScreen?.props} />
</NavItem> </NavItem>
<NavItem <NavItem
text="Navigation" text="Navigation"
indentLevel={0} indentLevel={0}
selected={$store.selectedComponentId === "navigation"} selected={$store.selectedComponentId ===
`${$store.selectedScreenId}-navigation`}
opened opened
scrollable scrollable
icon={$selectedScreen.showNavigation icon={$selectedScreen.showNavigation
@ -73,10 +77,12 @@
: "VisibilityOff"} : "VisibilityOff"}
on:drop={onDrop} on:drop={onDrop}
on:click={() => { on:click={() => {
$store.selectedComponentId = "navigation" $store.selectedComponentId = `${$store.selectedScreenId}-navigation`
}} }}
id={`component-nav`} id={`component-nav`}
selectedBy={$userSelectedResourceMap["navigation"]} selectedBy={$userSelectedResourceMap[
`${$store.selectedScreenId}-navigation`
]}
/> />
<ComponentTree <ComponentTree
level={0} level={0}

View File

@ -1,5 +1,6 @@
<script> <script>
import { redirect } from "@roxi/routify" import { redirect } from "@roxi/routify"
import { store } from "builderStore"
$redirect("./screen") $redirect(`./${$store.selectedScreenId}-screen`)
</script> </script>

View File

@ -4,7 +4,7 @@
$: { $: {
if ($frontendStore.screens.length > 0) { if ($frontendStore.screens.length > 0) {
$redirect(`./${$frontendStore.screens[0]._id}/screen`) $redirect(`./${$frontendStore.screens[0]._id}`)
} else { } else {
$redirect("./new") $redirect("./new")
} }

View File

@ -78,7 +78,7 @@
// changes. // changes.
$: selected = $: selected =
$builderStore.inBuilder && $builderStore.inBuilder &&
$builderStore.selectedComponentId === "navigation" $builderStore.selectedComponentId?.endsWith("-navigation")
$: { $: {
if (selected) { if (selected) {
const node = document.getElementsByClassName("nav-wrapper")?.[0] const node = document.getElementsByClassName("nav-wrapper")?.[0]
@ -152,7 +152,7 @@
use:styleable={$component.styles} use:styleable={$component.styles}
class:desktop={!mobile} class:desktop={!mobile}
class:mobile={!!mobile} class:mobile={!!mobile}
data-id="screen" data-id={`${$builderStore.screen?._id}-screen`}
data-name="Screen" data-name="Screen"
data-icon="WebPage" data-icon="WebPage"
> >