Merge pull request #12756 from Budibase/fix/multitep-formblock-update-checking

Added value caching to alleviate Multistep form button menu closing
This commit is contained in:
deanhannigan 2024-01-10 17:22:17 +00:00 committed by GitHub
commit 36e8070650
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 18 additions and 7 deletions

View File

@ -6,7 +6,7 @@
import { Helpers } from "@budibase/bbui" import { Helpers } from "@budibase/bbui"
import { derived, writable } from "svelte/store" import { derived, writable } from "svelte/store"
import { Utils } from "@budibase/frontend-core" import { Utils } from "@budibase/frontend-core"
import { cloneDeep } from "lodash" import { cloneDeep, isEqual } from "lodash"
export let componentInstance export let componentInstance
export let componentBindings export let componentBindings
@ -21,21 +21,32 @@
const currentStep = derived(multiStepStore, state => state.currentStep) const currentStep = derived(multiStepStore, state => state.currentStep)
const componentType = "@budibase/standard-components/multistepformblockstep" const componentType = "@budibase/standard-components/multistepformblockstep"
let cachedValue
let cachedInstance = {}
$: if (!isEqual(cachedValue, value)) {
cachedValue = value
}
$: if (!isEqual(componentInstance, cachedInstance)) {
cachedInstance = componentInstance
}
setContext("multi-step-form-block", multiStepStore) setContext("multi-step-form-block", multiStepStore)
$: stepCount = value?.length || 0 $: stepCount = cachedValue?.length || 0
$: updateStore(stepCount) $: updateStore(stepCount)
$: dataSource = getDatasourceForProvider($currentAsset, componentInstance) $: dataSource = getDatasourceForProvider($currentAsset, cachedInstance)
$: emitCurrentStep($currentStep) $: emitCurrentStep($currentStep)
$: stepLabel = getStepLabel($multiStepStore) $: stepLabel = getStepLabel($multiStepStore)
$: stepDef = getDefinition(stepLabel) $: stepDef = getDefinition(stepLabel)
$: stepSettings = value?.[$currentStep] || {} $: stepSettings = cachedValue?.[$currentStep] || {}
$: defaults = Utils.buildMultiStepFormBlockDefaultProps({ $: defaults = Utils.buildMultiStepFormBlockDefaultProps({
_id: componentInstance._id, _id: cachedInstance._id,
stepCount: $multiStepStore.stepCount, stepCount: $multiStepStore.stepCount,
currentStep: $multiStepStore.currentStep, currentStep: $multiStepStore.currentStep,
actionType: componentInstance.actionType, actionType: cachedInstance.actionType,
dataSource: componentInstance.dataSource, dataSource: cachedInstance.dataSource,
}) })
$: stepInstance = { $: stepInstance = {
_id: Helpers.uuid(), _id: Helpers.uuid(),