mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2024-12-24 20:24:05 -08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

fix(editor): Use selected input item for autocomplete (#10019)

Browse source
This commit is contained in:
Elias Meire 2024-07-12 10:11:59 +02:00 committed by GitHub
parent 56dd491bca
commit 1d2b403644
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
8 changed files with 42 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
packages/editor-ui/src/components/AssignmentCollection/Assignment.vue
View file

@ -88,7 +88,7 @@ const hint = computed(() => {
undefined,
ndvStore.isInputParentOfActiveNode
? {
targetItem: ndvStore.hoveringItem ?? undefined,
targetItem: ndvStore.expressionTargetItem ?? undefined,
inputNodeName: ndvStore.ndvInputNodeName,
inputRunIndex: ndvStore.ndvInputRunIndex,
inputBranchIndex: ndvStore.ndvInputBranchIndex,
@ -104,9 +104,7 @@ const hint = computed(() => {
return stringifyExpressionResult(result);
});
const highlightHint = computed(() =>
Boolean(hint.value && ndvStore.hoveringItem && ndvStore.isInputParentOfActiveNode),
);
const highlightHint = computed(() => Boolean(hint.value && ndvStore.getHoveringItem));
const valueIsExpression = computed(() => {
const { value } = assignment.value;

2
packages/editor-ui/src/components/InlineExpressionEditor/__tests__/InlineExpressionEditorOutput.test.ts
View file

@ -7,7 +7,6 @@ describe('InlineExpressionEditorOutput.vue', () => {
const { getByTestId } = renderComponent(InlineExpressionEditorOutput, {
pinia: createTestingPinia(),
props: {
hoveringItemNumber: 0,
visible: true,
segments: [
{
@ -56,7 +55,6 @@ describe('InlineExpressionEditorOutput.vue', () => {
const { getByTestId } = renderComponent(InlineExpressionEditorOutput, {
pinia: createTestingPinia(),
props: {
hoveringItemNumber: 0,
visible: true,
segments: [
{

2
packages/editor-ui/src/components/ParameterInputWrapper.vue
View file

@ -149,7 +149,7 @@ const parameterHint = computed(() => {
return props.hint;
});
const targetItem = computed(() => ndvStore.hoveringItem);
const targetItem = computed(() => ndvStore.expressionTargetItem);
const isInputParentOfActiveNode = computed(() => ndvStore.isInputParentOfActiveNode);

17
packages/editor-ui/src/composables/useExpressionEditor.ts
View file

@ -330,22 +330,7 @@ export const useExpressionEditor = ({
return result;
}
const targetItem = computed<TargetItem | null>(() => {
if (ndvStore.hoveringItem) {
return ndvStore.hoveringItem;
}
if (ndvStore.expressionOutputItemIndex && ndvStore.ndvInputNodeName) {
return {
nodeName: ndvStore.ndvInputNodeName,
runIndex: ndvStore.ndvInputRunIndex ?? 0,
outputIndex: ndvStore.ndvInputBranchIndex ?? 0,
itemIndex: ndvStore.expressionOutputItemIndex,
};
}
return null;
});
const targetItem = computed<TargetItem | null>(() => ndvStore.expressionTargetItem);
const resolvableSegments = computed<Resolvable[]>(() => {
return segments.value.filter((s): s is Resolvable => s.kind === 'resolvable');

5
packages/editor-ui/src/plugins/codemirror/completions/bracketAccess.completions.ts
View file

@ -1,5 +1,4 @@
import { resolveParameter } from '@/composables/useWorkflowHelpers';
import { prefixMatch, longestCommonPrefix } from './utils';
import { prefixMatch, longestCommonPrefix, resolveAutocompleteExpression } from './utils';
import type { Completion, CompletionContext, CompletionResult } from '@codemirror/autocomplete';
import type { Resolved } from './types';
import { escapeMappingString } from '@/utils/mappingUtils';
@ -31,7 +30,7 @@ export function bracketAccessCompletions(context: CompletionContext): Completion
let resolved: Resolved;
try {
resolved = resolveParameter(`={{ ${base} }}`);
resolved = resolveAutocompleteExpression(`={{ ${base} }}`);
} catch {
return null;
}

6
packages/editor-ui/src/plugins/codemirror/completions/datatype.completions.ts
View file

@ -1,4 +1,3 @@
import { resolveParameter } from '@/composables/useWorkflowHelpers';
import { VALID_EMAIL_REGEX } from '@/constants';
import { i18n } from '@/plugins/i18n';
import { useEnvironmentsStore } from '@/stores/environments.ee.store';
@ -48,6 +47,7 @@ import {
isSplitInBatchesAbsent,
longestCommonPrefix,
prefixMatch,
resolveAutocompleteExpression,
sortCompletionsAlpha,
splitBaseTail,
stripExcessParens,
@ -83,7 +83,7 @@ export function datatypeCompletions(context: CompletionContext): CompletionResul
let resolved: Resolved;
try {
resolved = resolveParameter(`={{ ${base} }}`);
resolved = resolveAutocompleteExpression(`={{ ${base} }}`);
} catch (error) {
return null;
}
@ -126,7 +126,7 @@ export function datatypeCompletions(context: CompletionContext): CompletionResul
function explicitDataTypeOptions(expression: string): Completion[] {
try {
const resolved = resolveParameter(`={{ ${expression} }}`);
const resolved = resolveAutocompleteExpression(`={{ ${expression} }}`);
return datatypeOptions({
resolved,
base: expression,

19
packages/editor-ui/src/plugins/codemirror/completions/utils.ts
View file

@ -82,7 +82,7 @@ export const isAllowedInDotNotation = (str: string) => {
export function receivesNoBinaryData() {
try {
return resolveParameter('={{ $binary }}')?.data === undefined;
return resolveAutocompleteExpression('={{ $binary }}')?.data === undefined;
} catch {
return true;
}
@ -92,7 +92,7 @@ export function hasNoParams(toResolve: string) {
let params;
try {
params = resolveParameter(`={{ ${toResolve}.params }}`);
params = resolveAutocompleteExpression(`={{ ${toResolve}.params }}`);
} catch {
return true;
}
@ -104,6 +104,21 @@ export function hasNoParams(toResolve: string) {
return paramKeys.length === 1 && isPseudoParam(paramKeys[0]);
}
export function resolveAutocompleteExpression(expression: string) {
const ndvStore = useNDVStore();
return resolveParameter(
expression,
ndvStore.isInputParentOfActiveNode
? {
targetItem: ndvStore.expressionTargetItem ?? undefined,
inputNodeName: ndvStore.ndvInputNodeName,
inputRunIndex: ndvStore.ndvInputRunIndex,
inputBranchIndex: ndvStore.ndvInputBranchIndex,
}
: {},
);
}
// ----------------------------------
// state-based utils
// ----------------------------------

19
packages/editor-ui/src/stores/ndv.store.ts
View file

@ -151,9 +151,6 @@ export const useNDVStore = defineStore(STORES.NDV, {
const parentNodes = workflow.getParentNodes(this.activeNode.name, NodeConnectionType.Main, 1);
return parentNodes.includes(inputNodeName);
},
hoveringItemNumber(): number {
return (this.hoveringItem?.itemIndex ?? 0) + 1;
},
getHoveringItem(): TargetItem | null {
if (this.isInputParentOfActiveNode) {
return this.hoveringItem;
@ -161,6 +158,22 @@ export const useNDVStore = defineStore(STORES.NDV, {
return null;
},
expressionTargetItem(): TargetItem | null {
if (this.getHoveringItem) {
return this.getHoveringItem;
}
if (this.expressionOutputItemIndex && this.ndvInputNodeName) {
return {
nodeName: this.ndvInputNodeName,
runIndex: this.ndvInputRunIndex ?? 0,
outputIndex: this.ndvInputBranchIndex ?? 0,
itemIndex: this.expressionOutputItemIndex,
};
}
return null;
},
isNDVOpen(): boolean {
return this.activeNodeName !== null;
},