mirror of
https://github.com/n8n-io/n8n.git
synced 2024-11-14 00:24:07 -08:00
Add context to schema view to ensure unique ids
This commit is contained in:
parent
0db658c6d0
commit
7a23d9c98b
|
@ -155,6 +155,7 @@ async function onDrop(expression: string, event: MouseEvent) {
|
||||||
:mapping-enabled="!isReadOnly"
|
:mapping-enabled="!isReadOnly"
|
||||||
:connection-type="NodeConnectionType.Main"
|
:connection-type="NodeConnectionType.Main"
|
||||||
pane-type="input"
|
pane-type="input"
|
||||||
|
context="modal"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -34,6 +34,7 @@ type Props = {
|
||||||
paneType: 'input' | 'output';
|
paneType: 'input' | 'output';
|
||||||
connectionType?: NodeConnectionType;
|
connectionType?: NodeConnectionType;
|
||||||
search?: string;
|
search?: string;
|
||||||
|
context?: 'ndv' | 'modal';
|
||||||
};
|
};
|
||||||
|
|
||||||
type SchemaNode = {
|
type SchemaNode = {
|
||||||
|
@ -58,6 +59,7 @@ const props = withDefaults(defineProps<Props>(), {
|
||||||
connectionType: NodeConnectionType.Main,
|
connectionType: NodeConnectionType.Main,
|
||||||
search: '',
|
search: '',
|
||||||
mappingEnabled: false,
|
mappingEnabled: false,
|
||||||
|
context: 'ndv',
|
||||||
});
|
});
|
||||||
|
|
||||||
const draggingPath = ref<string>('');
|
const draggingPath = ref<string>('');
|
||||||
|
@ -381,7 +383,7 @@ watch(
|
||||||
:level="0"
|
:level="0"
|
||||||
:parent="null"
|
:parent="null"
|
||||||
:pane-type="paneType"
|
:pane-type="paneType"
|
||||||
:sub-key="snakeCase(currentNode.node.name)"
|
:sub-key="`${props.context}_${snakeCase(currentNode.node.name)}`"
|
||||||
:mapping-enabled="mappingEnabled"
|
:mapping-enabled="mappingEnabled"
|
||||||
:dragging-path="draggingPath"
|
:dragging-path="draggingPath"
|
||||||
:distance-from-active="currentNode.depth"
|
:distance-from-active="currentNode.depth"
|
||||||
|
@ -427,7 +429,7 @@ watch(
|
||||||
:level="0"
|
:level="0"
|
||||||
:parent="null"
|
:parent="null"
|
||||||
:pane-type="paneType"
|
:pane-type="paneType"
|
||||||
:sub-key="`output_${nodeSchema.type}-0-0`"
|
:sub-key="`${props.context}_output_${nodeSchema.type}-0-0`"
|
||||||
:mapping-enabled="mappingEnabled"
|
:mapping-enabled="mappingEnabled"
|
||||||
:dragging-path="draggingPath"
|
:dragging-path="draggingPath"
|
||||||
:node="node"
|
:node="node"
|
||||||
|
|
|
@ -5,6 +5,7 @@ import { checkExhaustive } from '@/utils/typeGuards';
|
||||||
import { shorten } from '@/utils/typesUtils';
|
import { shorten } from '@/utils/typesUtils';
|
||||||
import { getMappedExpression } from '@/utils/mappingUtils';
|
import { getMappedExpression } from '@/utils/mappingUtils';
|
||||||
import TextWithHighlights from './TextWithHighlights.vue';
|
import TextWithHighlights from './TextWithHighlights.vue';
|
||||||
|
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
schema: Schema;
|
schema: Schema;
|
||||||
|
@ -95,7 +96,7 @@ const getIconBySchemaType = (type: Schema['type']): string => {
|
||||||
:data-depth="level"
|
:data-depth="level"
|
||||||
data-target="mappable"
|
data-target="mappable"
|
||||||
>
|
>
|
||||||
<font-awesome-icon :icon="getIconBySchemaType(schema.type)" size="sm" />
|
<FontAwesomeIcon :icon="getIconBySchemaType(schema.type)" size="sm" />
|
||||||
<TextWithHighlights
|
<TextWithHighlights
|
||||||
v-if="isSchemaParentTypeArray"
|
v-if="isSchemaParentTypeArray"
|
||||||
:content="props.parent?.key"
|
:content="props.parent?.key"
|
||||||
|
@ -120,12 +121,12 @@ const getIconBySchemaType = (type: Schema['type']): string => {
|
||||||
|
|
||||||
<input v-if="level > 0 && isSchemaValueArray" :id="subKey" type="checkbox" inert checked />
|
<input v-if="level > 0 && isSchemaValueArray" :id="subKey" type="checkbox" inert checked />
|
||||||
<label v-if="level > 0 && isSchemaValueArray" :class="$style.toggle" :for="subKey">
|
<label v-if="level > 0 && isSchemaValueArray" :class="$style.toggle" :for="subKey">
|
||||||
<font-awesome-icon icon="angle-right" />
|
<FontAwesomeIcon icon="angle-right" />
|
||||||
</label>
|
</label>
|
||||||
|
|
||||||
<div v-if="isSchemaValueArray" :class="$style.sub">
|
<div v-if="isSchemaValueArray" :class="$style.sub">
|
||||||
<div :class="$style.innerSub">
|
<div :class="$style.innerSub">
|
||||||
<run-data-schema-item
|
<RunDataSchemaItem
|
||||||
v-for="s in schemaArray"
|
v-for="s in schemaArray"
|
||||||
:key="s.key ?? s.type"
|
:key="s.key ?? s.type"
|
||||||
:schema="s"
|
:schema="s"
|
||||||
|
|
|
@ -702,13 +702,13 @@ exports[`RunDataSchema.vue > renders schema for data 1`] = `
|
||||||
</div>
|
</div>
|
||||||
<input
|
<input
|
||||||
checked=""
|
checked=""
|
||||||
id="set_1-hobbies"
|
id="ndv_set_1-hobbies"
|
||||||
inert=""
|
inert=""
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
/>
|
/>
|
||||||
<label
|
<label
|
||||||
class="toggle"
|
class="toggle"
|
||||||
for="set_1-hobbies"
|
for="ndv_set_1-hobbies"
|
||||||
>
|
>
|
||||||
<svg
|
<svg
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
|
@ -1138,13 +1138,13 @@ exports[`RunDataSchema.vue > renders schema for data 2`] = `
|
||||||
</div>
|
</div>
|
||||||
<input
|
<input
|
||||||
checked=""
|
checked=""
|
||||||
id="set_2-hobbies"
|
id="ndv_set_2-hobbies"
|
||||||
inert=""
|
inert=""
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
/>
|
/>
|
||||||
<label
|
<label
|
||||||
class="toggle"
|
class="toggle"
|
||||||
for="set_2-hobbies"
|
for="ndv_set_2-hobbies"
|
||||||
>
|
>
|
||||||
<svg
|
<svg
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
|
@ -1575,13 +1575,13 @@ exports[`RunDataSchema.vue > renders schema in output pane 1`] = `
|
||||||
</div>
|
</div>
|
||||||
<input
|
<input
|
||||||
checked=""
|
checked=""
|
||||||
id="output_object-0-0-hobbies"
|
id="ndv_output_object-0-0-hobbies"
|
||||||
inert=""
|
inert=""
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
/>
|
/>
|
||||||
<label
|
<label
|
||||||
class="toggle"
|
class="toggle"
|
||||||
for="output_object-0-0-hobbies"
|
for="ndv_output_object-0-0-hobbies"
|
||||||
>
|
>
|
||||||
<svg
|
<svg
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
|
@ -1967,13 +1967,13 @@ exports[`RunDataSchema.vue > renders schema with spaces and dots 1`] = `
|
||||||
</div>
|
</div>
|
||||||
<input
|
<input
|
||||||
checked=""
|
checked=""
|
||||||
id="set_1-hello world"
|
id="ndv_set_1-hello world"
|
||||||
inert=""
|
inert=""
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
/>
|
/>
|
||||||
<label
|
<label
|
||||||
class="toggle"
|
class="toggle"
|
||||||
for="set_1-hello world"
|
for="ndv_set_1-hello world"
|
||||||
>
|
>
|
||||||
<svg
|
<svg
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
|
@ -2060,13 +2060,13 @@ exports[`RunDataSchema.vue > renders schema with spaces and dots 1`] = `
|
||||||
</div>
|
</div>
|
||||||
<input
|
<input
|
||||||
checked=""
|
checked=""
|
||||||
id="set_1-hello world-0"
|
id="ndv_set_1-hello world-0"
|
||||||
inert=""
|
inert=""
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
/>
|
/>
|
||||||
<label
|
<label
|
||||||
class="toggle"
|
class="toggle"
|
||||||
for="set_1-hello world-0"
|
for="ndv_set_1-hello world-0"
|
||||||
>
|
>
|
||||||
<svg
|
<svg
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
|
@ -2144,13 +2144,13 @@ exports[`RunDataSchema.vue > renders schema with spaces and dots 1`] = `
|
||||||
</div>
|
</div>
|
||||||
<input
|
<input
|
||||||
checked=""
|
checked=""
|
||||||
id="set_1-hello world-0-test"
|
id="ndv_set_1-hello world-0-test"
|
||||||
inert=""
|
inert=""
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
/>
|
/>
|
||||||
<label
|
<label
|
||||||
class="toggle"
|
class="toggle"
|
||||||
for="set_1-hello world-0-test"
|
for="ndv_set_1-hello world-0-test"
|
||||||
>
|
>
|
||||||
<svg
|
<svg
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
|
|
Loading…
Reference in a new issue