Fix flashing of missing component settings panel when deleting components
This commit is contained in:
parent
8dd0658f18
commit
3630c73837
|
@ -2,7 +2,11 @@
|
|||
import AppPanel from "./_components/AppPanel.svelte"
|
||||
import * as routify from "@roxi/routify"
|
||||
import { syncURLToState } from "helpers/urlStateSync"
|
||||
import { screenStore, selectedScreen } from "stores/builder"
|
||||
import {
|
||||
screenStore,
|
||||
selectedScreen,
|
||||
selectedComponent,
|
||||
} from "stores/builder"
|
||||
import { onDestroy } from "svelte"
|
||||
import LeftPanel from "./_components/LeftPanel.svelte"
|
||||
|
||||
|
|
|
@ -574,15 +574,26 @@ export class ComponentStore extends BudiStore {
|
|||
return
|
||||
}
|
||||
|
||||
// Determine the next component to select after deletion
|
||||
// Determine the next component to select, and select it before deletion
|
||||
// to avoid an intermediate state of no component selection
|
||||
const state = get(this.store)
|
||||
let nextSelectedComponentId
|
||||
let nextId
|
||||
if (state.selectedComponentId === component._id) {
|
||||
nextSelectedComponentId = this.getNext()
|
||||
if (!nextSelectedComponentId) {
|
||||
nextSelectedComponentId = this.getPrevious()
|
||||
nextId = this.getNext()
|
||||
if (!nextId) {
|
||||
nextId = this.getPrevious()
|
||||
}
|
||||
}
|
||||
if (nextId) {
|
||||
// If this is the nav, select the screen instead
|
||||
if (nextId.endsWith("-navigation")) {
|
||||
nextId = nextId.replace("-navigation", "-screen")
|
||||
}
|
||||
this.update(state => {
|
||||
state.selectedComponentId = nextId
|
||||
return state
|
||||
})
|
||||
}
|
||||
|
||||
// Patch screen
|
||||
await screenStore.patch(screen => {
|
||||
|
@ -601,14 +612,6 @@ export class ComponentStore extends BudiStore {
|
|||
child => child._id !== component._id
|
||||
)
|
||||
})
|
||||
|
||||
// Update selected component if required
|
||||
if (nextSelectedComponentId) {
|
||||
this.update(state => {
|
||||
state.selectedComponentId = nextSelectedComponentId
|
||||
return state
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
copy(component, cut = false, selectParent = true) {
|
||||
|
|
|
@ -11,7 +11,6 @@
|
|||
export let componentId
|
||||
|
||||
$: currentValue = getGridVarValue(gridStyles, style)
|
||||
$: console.log(style, currentValue, value)
|
||||
$: active = currentValue === value
|
||||
</script>
|
||||
|
||||
|
|
Loading…
Reference in New Issue