mirror of
https://github.com/n8n-io/n8n.git
synced 2024-12-24 04:04:06 -08:00
🐛 Fix rendering for node titles
This commit is contained in:
parent
c478276f35
commit
393723af39
|
@ -50,13 +50,9 @@
|
|||
<div :class="{'disabled-linethrough': true, success: workflowDataItems > 0}" v-if="showDisabledLinethrough"></div>
|
||||
</div>
|
||||
<div class="node-description">
|
||||
<div class="node-name" :title="data.name">
|
||||
<div class="node-name" :title="nodeTitle">
|
||||
<p>
|
||||
{{ this.$headerText({
|
||||
key: `headers.${shortNodeType}.displayName`,
|
||||
fallback: data.name,
|
||||
})
|
||||
}}
|
||||
{{ nodeTitle }}
|
||||
</p>
|
||||
<p v-if="data.disabled">({{ $baseText('node.disabled') }}}</p>
|
||||
</div>
|
||||
|
@ -164,6 +160,23 @@ export default mixins(externalHooks, nodeBase, nodeHelpers, renderText, workflow
|
|||
shortNodeType (): string {
|
||||
return this.$shortNodeType(this.data.type);
|
||||
},
|
||||
nodeTitle (): string {
|
||||
const node = this.data;
|
||||
|
||||
const nodeName = this.$headerText({
|
||||
key: `headers.${this.$shortNodeType(node.type)}.displayName`,
|
||||
fallback: node.name,
|
||||
});
|
||||
|
||||
if (!/\d$/.test(node.name)) return nodeName;
|
||||
|
||||
const nativeDuplicateSuffix = this.getDuplicateSuffix(node, { fromNative: true });
|
||||
|
||||
if (nativeDuplicateSuffix) return nodeName + nativeDuplicateSuffix;
|
||||
|
||||
return nodeName + this.getDuplicateSuffix(node, { fromStandard: true });
|
||||
|
||||
},
|
||||
waiting (): string | undefined {
|
||||
const workflowExecution = this.$store.getters.getWorkflowExecution;
|
||||
|
||||
|
@ -272,6 +285,35 @@ export default mixins(externalHooks, nodeBase, nodeHelpers, renderText, workflow
|
|||
this.$emit('duplicateNode', this.data.name);
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* Extract the duplicate number suffix from a node name:
|
||||
* - from a node name natively ending in a number, e.g. `'S31'` → `'1'`
|
||||
* - from a standard node name, e.g. `'GitHub1'` → `'1'`
|
||||
*/
|
||||
getDuplicateSuffix(
|
||||
node: INodeUi,
|
||||
{ fromNative, fromStandard }: { fromNative?: true; fromStandard?: true; },
|
||||
) {
|
||||
if (fromNative) {
|
||||
const { nativelyNumberSuffixedNodeNames: natives } = this.$store.getters;
|
||||
const found = natives.find((native: string) => node.name.includes(native));
|
||||
|
||||
if (!found) return null;
|
||||
|
||||
return node.name.split(found).pop()!;
|
||||
}
|
||||
|
||||
if (fromStandard) {
|
||||
const match = node.name.match(/(.*)(?<duplicateSuffix>\d)$/);
|
||||
if (!match || !match.groups || !match.groups.duplicateSuffix) return null;
|
||||
|
||||
return match.groups.duplicateSuffix;
|
||||
}
|
||||
|
||||
throw new Error('Either "fromNative" or "fromStandard" must be specified');
|
||||
},
|
||||
|
||||
setNodeActive () {
|
||||
this.$store.commit('setActiveNode', this.data.name);
|
||||
},
|
||||
|
|
|
@ -818,6 +818,19 @@ export const store = new Vuex.Store({
|
|||
allNodeTypes: (state): INodeTypeDescription[] => {
|
||||
return state.nodeTypes;
|
||||
},
|
||||
|
||||
/**
|
||||
* Getter for node display names ending with a number: `'S3'`, `'MSG91'`, etc.
|
||||
*/
|
||||
nativelyNumberSuffixedNodeNames: (_, getters): string[] => {
|
||||
const allNodeTypes: INodeTypeDescription[] = getters.allNodeTypes;
|
||||
|
||||
return allNodeTypes.reduce<string[]>((acc, cur) => {
|
||||
if (/\d$/.test(cur.displayName)) acc.push(cur.displayName);
|
||||
return acc;
|
||||
}, []);
|
||||
},
|
||||
|
||||
nodeType: (state, getters) => (nodeType: string, typeVersion?: number): INodeTypeDescription | null => {
|
||||
const foundType = state.nodeTypes.find(typeData => {
|
||||
return typeData.name === nodeType && typeData.version === (typeVersion || typeData.defaultVersion || DEFAULT_NODETYPE_VERSION);
|
||||
|
|
Loading…
Reference in a new issue