admin/n8n-enterprise-unlocked
1
0
Fork 0
mirror of https://github.com/Abdulazizzn/n8n-enterprise-unlocked.git synced 2025-12-17 01:56:46 +00:00
Code Issues 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

200
packages/editor-ui/src/components/NodeCredentials.vue
View File

@@ -1,17 +1,22 @@
<template>
<div v-if="credentialTypesNodeDescriptionDisplayed.length" :class="['node-credentials', $style.container]">
<div v-for="credentialTypeDescription in credentialTypesNodeDescriptionDisplayed" :key="credentialTypeDescription.name">
<div
v-if="credentialTypesNodeDescriptionDisplayed.length"
:class="['node-credentials', $style.container]"
>
<div
v-for="credentialTypeDescription in credentialTypesNodeDescriptionDisplayed"
:key="credentialTypeDescription.name"
>
<n8n-input-label
:label="$locale.baseText(
'nodeCredentials.credentialFor',
{
:label="
$locale.baseText('nodeCredentials.credentialFor', {
interpolate: {
credentialType: credentialTypeNames[credentialTypeDescription.name]
}
}
)"
credentialType: credentialTypeNames[credentialTypeDescription.name],
},
})
"
:bold="false"
:set="issues = getIssues(credentialTypeDescription.name)"
:set="(issues = getIssues(credentialTypeDescription.name))"
size="small"
color="text-dark"
>
@@ -22,10 +27,7 @@
size="small"
/>
</div>
<div
v-else
:class="issues.length ? $style.hasIssues : $style.input"
>
<div v-else :class="issues.length ? $style.hasIssues : $style.input">
<n8n-select
:value="getSelectedId(credentialTypeDescription.name)"
@change="(value) => onCredentialSelected(credentialTypeDescription.name, value)"
@@ -33,10 +35,11 @@
size="small"
>
<n8n-option
v-for="(item) in getCredentialOptions(credentialTypeDescription.name)"
v-for="item in getCredentialOptions(credentialTypeDescription.name)"
:key="item.id"
:label="item.name"
:value="item.id">
:value="item.id"
>
</n8n-option>
<n8n-option
:key="NEW_CREDENTIALS_TEXT"
@@ -47,16 +50,30 @@
</n8n-select>
<div :class="$style.warning" v-if="issues.length">
<n8n-tooltip placement="top" >
<n8n-tooltip placement="top">
<template #content>
<titled-list :title="`${$locale.baseText('nodeCredentials.issues')}:`" :items="issues" />
<titled-list
:title="`${$locale.baseText('nodeCredentials.issues')}:`"
:items="issues"
/>
</template>
<font-awesome-icon icon="exclamation-triangle" />
</n8n-tooltip>
</div>
<div :class="$style.edit" v-if="selected[credentialTypeDescription.name] && isCredentialExisting(credentialTypeDescription.name)">
<font-awesome-icon icon="pen" @click="editCredential(credentialTypeDescription.name)" class="clickable" :title="$locale.baseText('nodeCredentials.updateCredential')" />
<div
:class="$style.edit"
v-if="
selected[credentialTypeDescription.name] &&
isCredentialExisting(credentialTypeDescription.name)
"
>
<font-awesome-icon
icon="pen"
@click="editCredential(credentialTypeDescription.name)"
class="clickable"
:title="$locale.baseText('nodeCredentials.updateCredential')"
/>
</div>
</div>
</n8n-input-label>
@@ -72,11 +89,7 @@ import {
INodeUpdatePropertiesInformation,
IUser,
} from '@/Interface';
import {
ICredentialType,
INodeCredentialDescription,
INodeCredentialsDetails,
} from 'n8n-workflow';
import { ICredentialType, INodeCredentialDescription, INodeCredentialsDetails } from 'n8n-workflow';
import { genericHelpers } from '@/mixins/genericHelpers';
import { nodeHelpers } from '@/mixins/nodeHelpers';
@@ -85,7 +98,7 @@ import { showMessage } from '@/mixins/showMessage';
import TitledList from '@/components/TitledList.vue';
import mixins from 'vue-typed-mixins';
import {getCredentialPermissions} from "@/permissions";
import { getCredentialPermissions } from '@/permissions';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui';
import { useUsersStore } from '@/stores/users';
@@ -93,12 +106,7 @@ import { useWorkflowsStore } from '@/stores/workflows';
import { useNodeTypesStore } from '@/stores/nodeTypes';
import { useCredentialsStore } from '@/stores/credentials';
export default mixins(
genericHelpers,
nodeHelpers,
restApi,
showMessage,
).extend({
export default mixins(genericHelpers, nodeHelpers, restApi, showMessage).extend({
name: 'NodeCredentials',
props: [
'readonly',
@@ -108,7 +116,7 @@ export default mixins(
components: {
TitledList,
},
data () {
data() {
return {
NEW_CREDENTIALS_TEXT: `- ${this.$locale.baseText('nodeCredentials.createNew')} -`,
subscribedToCredentialType: '',
@@ -125,23 +133,23 @@ export default mixins(
useUsersStore,
useWorkflowsStore,
),
allCredentialsByType(): {[type: string]: ICredentialsResponse[]} {
allCredentialsByType(): { [type: string]: ICredentialsResponse[] } {
return this.credentialsStore.allCredentialsByType;
},
currentUser (): IUser {
return this.usersStore.currentUser || {} as IUser;
currentUser(): IUser {
return this.usersStore.currentUser || ({} as IUser);
},
credentialTypesNode (): string[] {
return this.credentialTypesNodeDescription
.map((credentialTypeDescription) => credentialTypeDescription.name);
credentialTypesNode(): string[] {
return this.credentialTypesNodeDescription.map(
(credentialTypeDescription) => credentialTypeDescription.name,
);
},
credentialTypesNodeDescriptionDisplayed (): INodeCredentialDescription[] {
return this.credentialTypesNodeDescription
.filter((credentialTypeDescription) => {
return this.displayCredentials(credentialTypeDescription);
});
credentialTypesNodeDescriptionDisplayed(): INodeCredentialDescription[] {
return this.credentialTypesNodeDescription.filter((credentialTypeDescription) => {
return this.displayCredentials(credentialTypeDescription);
});
},
credentialTypesNodeDescription (): INodeCredentialDescription[] {
credentialTypesNodeDescription(): INodeCredentialDescription[] {
const node = this.node as INodeUi;
const credType = this.credentialsStore.getCredentialTypeByName(this.overrideCredType);
@@ -155,29 +163,32 @@ export default mixins(
return [];
},
credentialTypeNames () {
credentialTypeNames() {
const returnData: {
[key: string]: string;
} = {};
let credentialType: ICredentialType | null;
for (const credentialTypeName of this.credentialTypesNode) {
credentialType = this.credentialsStore.getCredentialTypeByName(credentialTypeName);
returnData[credentialTypeName] = credentialType !== null ? credentialType.displayName : credentialTypeName;
returnData[credentialTypeName] =
credentialType !== null ? credentialType.displayName : credentialTypeName;
}
return returnData;
},
selected(): {[type: string]: INodeCredentialsDetails} {
selected(): { [type: string]: INodeCredentialsDetails } {
return this.node.credentials || {};
},
},
methods: {
getCredentialOptions(type: string): ICredentialsResponse[] {
return (this.allCredentialsByType as Record<string, ICredentialsResponse[]>)[type].filter((credential) => {
const permissions = getCredentialPermissions(this.currentUser, credential);
return (this.allCredentialsByType as Record<string, ICredentialsResponse[]>)[type].filter(
(credential) => {
const permissions = getCredentialPermissions(this.currentUser, credential);
return permissions.use;
});
return permissions.use;
},
);
},
getSelectedId(type: string) {
if (this.isCredentialExisting(type)) {
@@ -190,10 +201,12 @@ export default mixins(
},
getSelectPlaceholder(type: string, issues: string[]) {
return issues.length && this.getSelectedName(type)
? this.$locale.baseText('nodeCredentials.selectedCredentialUnavailable', { interpolate: { name: this.getSelectedName(type) } })
? this.$locale.baseText('nodeCredentials.selectedCredentialUnavailable', {
interpolate: { name: this.getSelectedName(type) },
})
: this.$locale.baseText('nodeCredentials.selectCredential');
},
credentialInputWrapperStyle (credentialType: string) {
credentialInputWrapperStyle(credentialType: string) {
let deductWidth = 0;
const styles = {
width: '100%',
@@ -224,12 +237,18 @@ export default mixins(
this.onCredentialSelected(credentialType, credentialsOfType[0].id);
} else {
// Else, check id currently selected cred has been updated
const newSelected = credentialsOfType.find(cred => cred.id === this.selected[credentialType].id);
const newSelected = credentialsOfType.find(
(cred) => cred.id === this.selected[credentialType].id,
);
// If it has changed, select it
if (newSelected && newSelected.name !== this.selected[credentialType].name) {
this.onCredentialSelected(credentialType, newSelected.id);
} else { // Else select the last cred with that type since selected has been deleted or a new one has been added
this.onCredentialSelected(credentialType, credentialsOfType[credentialsOfType.length - 1].id);
} else {
// Else select the last cred with that type since selected has been deleted or a new one has been added
this.onCredentialSelected(
credentialType,
credentialsOfType[credentialsOfType.length - 1].id,
);
}
}
}
@@ -256,35 +275,44 @@ export default mixins(
this.$emit('credentialSelected', updateInformation);
},
onCredentialSelected (credentialType: string, credentialId: string | null | undefined) {
onCredentialSelected(credentialType: string, credentialId: string | null | undefined) {
if (credentialId === this.NEW_CREDENTIALS_TEXT) {
// this.listenForNewCredentials(credentialType);
this.subscribedToCredentialType = credentialType;
}
if (!credentialId || credentialId === this.NEW_CREDENTIALS_TEXT) {
this.uiStore.openNewCredential(credentialType);
this.$telemetry.track('User opened Credential modal', { credential_type: credentialType, source: 'node', new_credential: true, workflow_id: this.workflowsStore.workflowId });
this.$telemetry.track('User opened Credential modal', {
credential_type: credentialType,
source: 'node',
new_credential: true,
workflow_id: this.workflowsStore.workflowId,
});
return;
}
this.$telemetry.track(
'User selected credential from node modal',
{
credential_type: credentialType,
node_type: this.node.type,
...(this.hasProxyAuth(this.node) ? { is_service_specific: true } : {}),
workflow_id: this.workflowsStore.workflowId,
credential_id: credentialId,
},
);
this.$telemetry.track('User selected credential from node modal', {
credential_type: credentialType,
node_type: this.node.type,
...(this.hasProxyAuth(this.node) ? { is_service_specific: true } : {}),
workflow_id: this.workflowsStore.workflowId,
credential_id: credentialId,
});
const selectedCredentials = this.credentialsStore.getCredentialById(credentialId);
const oldCredentials = this.node.credentials && this.node.credentials[credentialType] ? this.node.credentials[credentialType] : {};
const oldCredentials =
this.node.credentials && this.node.credentials[credentialType]
? this.node.credentials[credentialType]
: {};
const selected = { id: selectedCredentials.id, name: selectedCredentials.name };
// if credentials has been string or neither id matched nor name matched uniquely
if (oldCredentials.id === null || (oldCredentials.id && !this.credentialsStore.getCredentialByIdAndType(oldCredentials.id, credentialType))) {
if (
oldCredentials.id === null ||
(oldCredentials.id &&
!this.credentialsStore.getCredentialByIdAndType(oldCredentials.id, credentialType))
) {
// update all nodes in the workflow with the same old/invalid credentials
this.workflowsStore.replaceInvalidWorkflowCredentials({
credentials: selected,
@@ -294,15 +322,12 @@ export default mixins(
this.updateNodesCredentialsIssues();
this.$showMessage({
title: this.$locale.baseText('nodeCredentials.showMessage.title'),
message: this.$locale.baseText(
'nodeCredentials.showMessage.message',
{
interpolate: {
oldCredentialName: oldCredentials.name,
newCredentialName: selected.name,
},
message: this.$locale.baseText('nodeCredentials.showMessage.message', {
interpolate: {
oldCredentialName: oldCredentials.name,
newCredentialName: selected.name,
},
),
}),
type: 'success',
});
}
@@ -324,7 +349,7 @@ export default mixins(
this.$emit('credentialSelected', updateInformation);
},
displayCredentials (credentialTypeDescription: INodeCredentialDescription): boolean {
displayCredentials(credentialTypeDescription: INodeCredentialDescription): boolean {
if (credentialTypeDescription.displayOptions === undefined) {
// If it is not defined no need to do a proper check
return true;
@@ -332,7 +357,7 @@ export default mixins(
return this.displayParameter(this.node.parameters, credentialTypeDescription, '', this.node);
},
getIssues (credentialTypeName: string): string[] {
getIssues(credentialTypeName: string): string[] {
const node = this.node as INodeUi;
if (node.issues === undefined || node.issues.credentials === undefined) {
@@ -347,7 +372,11 @@ export default mixins(
},
isCredentialExisting(credentialType: string): boolean {
if (!this.node.credentials || !this.node.credentials[credentialType] || !this.node.credentials[credentialType].id) {
if (
!this.node.credentials ||
!this.node.credentials[credentialType] ||
!this.node.credentials[credentialType].id
) {
return false;
}
const { id } = this.node.credentials[credentialType];
@@ -360,7 +389,12 @@ export default mixins(
const { id } = this.node.credentials[credentialType];
this.uiStore.openExistingCredential(id);
this.$telemetry.track('User opened Credential modal', { credential_type: credentialType, source: 'node', new_credential: false, workflow_id: this.workflowsStore.workflowId });
this.$telemetry.track('User opened Credential modal', {
credential_type: credentialType,
source: 'node',
new_credential: false,
workflow_id: this.workflowsStore.workflowId,
});
this.subscribedToCredentialType = credentialType;
},
},