fix(editor): Fix render key for dynamic number of handles on new canvas (no-changelog) (#11105)

This commit is contained in:
Alex Grozav 2024-10-04 16:38:46 +03:00 committed by GitHub
parent 565b117a52
commit 3950cab6dd
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 10 additions and 13 deletions

View file

@ -11,7 +11,6 @@ import CanvasHandleMainOutput from '@/components/canvas/elements/handles/render-
import CanvasHandleNonMainInput from '@/components/canvas/elements/handles/render-types/CanvasHandleNonMainInput.vue'; import CanvasHandleNonMainInput from '@/components/canvas/elements/handles/render-types/CanvasHandleNonMainInput.vue';
import CanvasHandleNonMainOutput from '@/components/canvas/elements/handles/render-types/CanvasHandleNonMainOutput.vue'; import CanvasHandleNonMainOutput from '@/components/canvas/elements/handles/render-types/CanvasHandleNonMainOutput.vue';
import { CanvasNodeHandleKey } from '@/constants'; import { CanvasNodeHandleKey } from '@/constants';
import { createCanvasConnectionHandleString } from '@/utils/canvasUtilsV2';
import { useCanvasNode } from '@/composables/useCanvasNode'; import { useCanvasNode } from '@/composables/useCanvasNode';
const props = defineProps< const props = defineProps<
@ -46,14 +45,6 @@ const handleType = computed(() =>
props.mode === CanvasConnectionMode.Input ? 'target' : 'source', props.mode === CanvasConnectionMode.Input ? 'target' : 'source',
); );
const handleString = computed(() =>
createCanvasConnectionHandleString({
mode: props.mode,
type: props.type,
index: props.index,
}),
);
const handleClasses = computed(() => [style.handle, style[props.type], style[props.mode]]); const handleClasses = computed(() => [style.handle, style[props.type], style[props.mode]]);
/** /**
@ -121,7 +112,7 @@ const RenderType = () => {
*/ */
function onAdd() { function onAdd() {
emit('add', handleString.value); emit('add', props.handleId);
} }
/** /**
@ -152,7 +143,7 @@ provide(CanvasNodeHandleKey, {
<template> <template>
<Handle <Handle
v-bind="$attrs" v-bind="$attrs"
:id="handleString" :id="handleId"
:class="handleClasses" :class="handleClasses"
:type="handleType" :type="handleType"
:position="position" :position="position"

View file

@ -260,7 +260,10 @@ onBeforeUnmount(() => {
:class="[$style.canvasNode, { [$style.showToolbar]: showToolbar }]" :class="[$style.canvasNode, { [$style.showToolbar]: showToolbar }]"
data-test-id="canvas-node" data-test-id="canvas-node"
> >
<template v-for="source in mappedOutputs" :key="source.handleId"> <template
v-for="source in mappedOutputs"
:key="`${source.handleId}(${source.index + 1}/${mappedOutputs.length})`"
>
<CanvasHandleRenderer <CanvasHandleRenderer
v-bind="source" v-bind="source"
:mode="CanvasConnectionMode.Output" :mode="CanvasConnectionMode.Output"
@ -271,7 +274,10 @@ onBeforeUnmount(() => {
/> />
</template> </template>
<template v-for="target in mappedInputs" :key="target.handleId"> <template
v-for="target in mappedInputs"
:key="`${target.handleId}(${target.index + 1}/${mappedInputs.length})`"
>
<CanvasHandleRenderer <CanvasHandleRenderer
v-bind="target" v-bind="target"
:mode="CanvasConnectionMode.Input" :mode="CanvasConnectionMode.Input"