Update how blocks key child components for reference when ejecting, and ensure search fields in table blocks are keyed properly

This commit is contained in:
Andrew Kingston 2023-07-17 16:48:57 +01:00
parent 730e0b567c
commit ce24339e22
3 changed files with 19 additions and 14 deletions

View File

@ -8,27 +8,28 @@
let structureLookupMap = {}
const registerBlockComponent = (id, order, parentId, instance) => {
const registerBlockComponent = (id, parentId, order, instance) => {
// Ensure child map exists
if (!structureLookupMap[parentId]) {
structureLookupMap[parentId] = {}
}
// Add this instance in this order, overwriting any existing instance in
// this order in case of repeaters
structureLookupMap[parentId][order] = instance
structureLookupMap[parentId][id] = { order, instance }
}
const unregisterBlockComponent = (order, parentId) => {
const unregisterBlockComponent = (id, parentId) => {
// Ensure child map exists
if (!structureLookupMap[parentId]) {
return
}
delete structureLookupMap[parentId][order]
delete structureLookupMap[parentId][id]
}
const eject = () => {
// Start the new structure with the root component
let definition = structureLookupMap[$component.id][0]
let definition = Object.values(structureLookupMap[$component.id])[0]
.instance
// Copy styles from block to root component
definition._styles = {
@ -49,10 +50,12 @@
const attachChildren = (rootComponent, map) => {
// Transform map into children array
let id = rootComponent._id
const children = Object.entries(map[id] || {}).map(([order, instance]) => ({
order,
instance,
}))
const children = Object.values(map[id] || {}).map(
({ order, instance }) => ({
order,
instance,
})
)
if (!children.length) {
return
}

View File

@ -23,6 +23,8 @@
// Create a fake component instance so that we can use the core Component
// to render this part of the block, taking advantage of binding enrichment
$: id = `${block.id}-${context ?? rand}`
$: parentId = $component?.id
$: inBuilder = $builderStore.inBuilder
$: instance = {
_component: `@budibase/standard-components/${type}`,
_id: id,
@ -38,14 +40,14 @@
// Register this block component if we're inside the builder so it can be
// ejected later
$: {
if ($builderStore.inBuilder) {
block.registerComponent(id, order ?? 0, $component?.id, instance)
if (inBuilder) {
block.registerComponent(id, parentId, order ?? 0, instance)
}
}
onDestroy(() => {
if ($builderStore.inBuilder) {
block.unregisterComponent(order ?? 0, $component?.id)
if (inBuilder) {
block.unregisterComponent(id, parentId)
}
})
</script>

View File

@ -169,7 +169,7 @@
order={1}
>
{#if enrichedSearchColumns?.length}
{#each enrichedSearchColumns as column, idx}
{#each enrichedSearchColumns as column, idx (column.name)}
<BlockComponent
type={column.componentType}
props={{