mohiit1502/Automata
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor(editor): Apply Prettier (no-changelog) (#4920)

Browse Source 
* ⚡ Adjust `format` script

* 🔥 Remove exemption for `editor-ui`

* 🎨 Prettify

* 👕 Fix lint
This commit is contained in:
Iván Ovejero
2022-12-14 10:04:10 +01:00
committed by GitHub
parent bcde07e032
commit 5ca2148c7e
284 changed files with 19247 additions and 15540 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
packages/editor-ui/src/components/ResourceLocator/ResourceLocator.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="resource-locator" ref="container">
<resource-locator-dropdown
:value="value ? value.value: ''"
:value="value ? value.value : ''"
:show="showResourceDropdown"
:filterable="isSearchable"
:filterRequired="requiresSearchFilter"
@@ -90,7 +90,7 @@
/>
<n8n-input
v-else
:class="{[$style.selectInput]: isListMode}"
:class="{ [$style.selectInput]: isListMode }"
:size="inputSize"
:value="valueToDisplay"
:disabled="isReadOnly"
@@ -122,14 +122,8 @@
:issues="parameterIssues"
/>
<div v-else-if="urlValue" :class="$style.openResourceLink">
<n8n-link
theme="text"
@click.stop="openResource(urlValue)"
>
<font-awesome-icon
icon="external-link-alt"
:title="getLinkAlt(valueToDisplay)"
/>
<n8n-link theme="text" @click.stop="openResource(urlValue)">
<font-awesome-icon icon="external-link-alt" :title="getLinkAlt(valueToDisplay)" />
</n8n-link>
</div>
</div>
@@ -193,7 +187,9 @@ export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
required: true,
},
value: {
type: [Object, String] as PropType<INodeParameterResourceLocator | NodeParameterValue | undefined>,
type: [Object, String] as PropType<
INodeParameterResourceLocator | NodeParameterValue | undefined
>,
},
inputSize: {
type: String,
@@ -255,13 +251,7 @@ export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
};
},
computed: {
...mapStores(
useNodeTypesStore,
useNDVStore,
useRootStore,
useUIStore,
useWorkflowsStore,
),
...mapStores(useNodeTypesStore, useNDVStore, useRootStore, useUIStore, useWorkflowsStore),
appName(): string {
if (!this.node) {
return '';
@@ -271,12 +261,13 @@ export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
return getAppNameFromNodeName(nodeType?.displayName || '');
},
selectedMode(): string {
if (typeof this.value !== 'object') { // legacy mode
if (typeof this.value !== 'object') {
// legacy mode
return '';
}
if (!this.value) {
return this.parameter.modes? this.parameter.modes[0].name : '';
return this.parameter.modes ? this.parameter.modes[0].name : '';
}
return this.value.mode;
@@ -318,7 +309,7 @@ export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
}
if (this.isListMode) {
return this.value? (this.value.cachedResultName || this.value.value) : '';
return this.value ? this.value.cachedResultName || this.value.value : '';
}
return this.value ? this.value.value : '';
@@ -329,7 +320,11 @@ export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
}
if (this.selectedMode === 'url') {
if (this.isValueExpression && typeof this.expressionComputedValue === 'string' && this.expressionComputedValue.startsWith('http')) {
if (
this.isValueExpression &&
typeof this.expressionComputedValue === 'string' &&
this.expressionComputedValue.startsWith('http')
) {
return this.expressionComputedValue;
}
@@ -339,7 +334,7 @@ export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
}
if (this.currentMode.url) {
const value = this.isValueExpression? this.expressionComputedValue : this.valueToDisplay;
const value = this.isValueExpression ? this.expressionComputedValue : this.valueToDisplay;
if (typeof value === 'string') {
const expression = this.currentMode.url.replace(/\{\{\$value\}\}/g, value);
const resolved = this.resolveExpression(expression);
@@ -354,7 +349,7 @@ export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
parameters: INodeParameters;
credentials: INodeCredentials | undefined;
filter: string;
} {
} {
return {
parameters: this.node.parameters,
credentials: this.node.credentials,
@@ -362,14 +357,17 @@ export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
};
},
currentRequestKey(): string {
const cacheKeys = {...this.currentRequestParams};
cacheKeys.parameters = Object.keys(this.node ? this.node.parameters : {}).reduce((accu: INodeParameters, param) => {
if (param !== this.parameter.name && this.node && this.node.parameters) {
accu[param] = this.node.parameters[param];
}
const cacheKeys = { ...this.currentRequestParams };
cacheKeys.parameters = Object.keys(this.node ? this.node.parameters : {}).reduce(
(accu: INodeParameters, param) => {
if (param !== this.parameter.name && this.node && this.node.parameters) {
accu[param] = this.node.parameters[param];
}
return accu;
}, {});
return accu;
},
{},
);
return stringify(cacheKeys);
},
currentResponse(): IResourceLocatorQuery | null {
@@ -378,12 +376,12 @@ export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
currentQueryResults(): IResourceLocatorResultExpanded[] {
const results = this.currentResponse ? this.currentResponse.results : [];
return results.map((result: INodeListSearchItems): IResourceLocatorResultExpanded => ({
...result,
...(
(result.name && result.url)? { linkAlt: this.getLinkAlt(result.name) } : {}
),
}));
return results.map(
(result: INodeListSearchItems): IResourceLocatorResultExpanded => ({
...result,
...(result.name && result.url ? { linkAlt: this.getLinkAlt(result.name) } : {}),
}),
);
},
currentQueryHasMore(): boolean {
return !!(this.currentResponse && this.currentResponse.nextPageToken);
@@ -422,8 +420,13 @@ export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
}
},
currentMode(mode: INodePropertyMode) {
if (mode.extractValue && mode.extractValue.regex && isResourceLocatorValue(this.value) && this.value.__regex !== mode.extractValue.regex) {
this.$emit('input', {...this.value, __regex: mode.extractValue.regex});
if (
mode.extractValue &&
mode.extractValue.regex &&
isResourceLocatorValue(this.value) &&
this.value.__regex !== mode.extractValue.regex
) {
this.$emit('input', { ...this.value, __regex: mode.extractValue.regex });
}
},
},
@@ -447,9 +450,13 @@ export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
},
getLinkAlt(entity: string) {
if (this.selectedMode === 'list' && entity) {
return this.$locale.baseText('resourceLocator.openSpecificResource', { interpolate: { entity, appName: this.appName } });
return this.$locale.baseText('resourceLocator.openSpecificResource', {
interpolate: { entity, appName: this.appName },
});
}
return this.$locale.baseText('resourceLocator.openResource', { interpolate: { appName: this.appName } });
return this.$locale.baseText('resourceLocator.openResource', {
interpolate: { appName: this.appName },
});
},
refreshList() {
this.cachedResponses = {};
@@ -533,7 +540,7 @@ export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
this.trackEvent('User changed resource locator mode', { mode: value });
},
trackEvent(event: string, params?: {[key: string]: string}): void {
trackEvent(event: string, params?: { [key: string]: string }): void {
this.$telemetry.track(event, {
instance_id: this.rootStore.instanceId,
workflow_id: this.workflowsStore.workflowId,
@@ -656,7 +663,11 @@ export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
}
if (mode) {
this.$emit('input', { __rl: true, value: ((this.value && typeof this.value === 'object')? this.value.value: ''), mode: mode.name });
this.$emit('input', {
__rl: true,
value: this.value && typeof this.value === 'object' ? this.value.value : '',
mode: mode.name,
});
}
}
},

80
packages/editor-ui/src/components/ResourceLocator/ResourceLocatorDropdown.vue
View File

@@ -10,7 +10,15 @@
<slot name="error"></slot>
</div>
<div :class="$style.searchInput" v-if="filterable && !errorView" @keydown="onKeyDown">
<n8n-input size="medium" :value="filter" :clearable="true" @input="onFilterInput" @blur="onSearchBlur" ref="search" :placeholder="$locale.baseText('resourceLocator.search.placeholder')">
<n8n-input
size="medium"
:value="filter"
:clearable="true"
@input="onFilterInput"
@blur="onSearchBlur"
ref="search"
:placeholder="$locale.baseText('resourceLocator.search.placeholder')"
>
<template #prefix>
<font-awesome-icon :class="$style.searchIcon" icon="search" />
</template>
@@ -19,14 +27,26 @@
<div v-if="filterRequired && !filter && !errorView && !loading" :class="$style.searchRequired">
{{ $locale.baseText('resourceLocator.mode.list.searchRequired') }}
</div>
<div :class="$style.messageContainer" v-else-if="!errorView && sortedResources.length === 0 && !loading">
<div
:class="$style.messageContainer"
v-else-if="!errorView && sortedResources.length === 0 && !loading"
>
{{ $locale.baseText('resourceLocator.mode.list.noResults') }}
</div>
<div v-else-if="!errorView" ref="resultsContainer" :class="{[$style.container]: true, [$style.pushDownResults]: filterable}" @scroll="onResultsEnd">
<div
v-else-if="!errorView"
ref="resultsContainer"
:class="{ [$style.container]: true, [$style.pushDownResults]: filterable }"
@scroll="onResultsEnd"
>
<div
v-for="(result, i) in sortedResources"
:key="result.value"
:class="{ [$style.resourceItem]: true, [$style.selected]: result.value === value, [$style.hovering]: hoverIndex === i }"
:class="{
[$style.resourceItem]: true,
[$style.selected]: result.value === value,
[$style.hovering]: hoverIndex === i,
}"
@click="() => onItemClick(result.value)"
@mouseenter="() => onItemHover(i)"
@mouseleave="() => onItemHoverLeave()"
@@ -51,7 +71,7 @@
</div>
</div>
<template #reference>
<slot />
<slot />
</template>
</n8n-popover>
</template>
@@ -110,33 +130,36 @@ export default Vue.extend({
computed: {
sortedResources(): IResourceLocatorResultExpanded[] {
const seen = new Set();
const { selected, notSelected } = this.resources.reduce((acc, item: IResourceLocatorResultExpanded) => {
if (seen.has(item.value)) {
const { selected, notSelected } = this.resources.reduce(
(acc, item: IResourceLocatorResultExpanded) => {
if (seen.has(item.value)) {
return acc;
}
seen.add(item.value);
if (this.value && item.value === this.value) {
acc.selected = item;
} else {
acc.notSelected.push(item);
}
return acc;
}
seen.add(item.value);
if (this.value && item.value === this.value) {
acc.selected = item;
} else {
acc.notSelected.push(item);
}
return acc;
}, { selected: null as IResourceLocatorResultExpanded | null, notSelected: [] as IResourceLocatorResultExpanded[] });
},
{
selected: null as IResourceLocatorResultExpanded | null,
notSelected: [] as IResourceLocatorResultExpanded[],
},
);
if (selected) {
return [
selected,
...notSelected,
];
return [selected, ...notSelected];
}
return notSelected;
},
},
methods: {
openUrl(event: MouseEvent ,url: string) {
openUrl(event: MouseEvent, url: string) {
event.preventDefault();
event.stopPropagation();
@@ -152,14 +175,13 @@ export default Vue.extend({
const items = this.$refs[`item-${this.hoverIndex}`] as HTMLElement[];
if (container && Array.isArray(items) && items.length === 1) {
const item = items[0];
if ((item.offsetTop + item.clientHeight) > (container.scrollTop + container.offsetHeight)) {
if (item.offsetTop + item.clientHeight > container.scrollTop + container.offsetHeight) {
const top = item.offsetTop - container.offsetHeight + item.clientHeight;
container.scrollTo({ top });
}
}
}
}
else if (e.key === 'ArrowUp') {
} else if (e.key === 'ArrowUp') {
if (this.hoverIndex > 0) {
this.hoverIndex--;
@@ -172,11 +194,9 @@ export default Vue.extend({
}
}
}
}
else if (e.key === 'Enter') {
} else if (e.key === 'Enter') {
this.$emit('input', this.sortedResources[this.hoverIndex].value);
}
},
onFilterInput(value: string) {
this.$emit('filter', value);
@@ -207,7 +227,7 @@ export default Vue.extend({
const container = this.$refs.resultsContainer as HTMLElement;
if (container) {
const diff = container.offsetHeight - (container.scrollHeight - container.scrollTop);
if (diff > -(SCROLL_MARGIN_PX) && diff < SCROLL_MARGIN_PX) {
if (diff > -SCROLL_MARGIN_PX && diff < SCROLL_MARGIN_PX) {
this.$emit('loadMore');
}
}