refactor(editor): restrict mapping discoverability tooltip showing only on string input (#4496)
* refactor(editor): restrict mapping discoverability tooltip showing only on string input * refactor(editor): renaming computed prop because not only string inputs can be mapped, but we want to show tooltips only on string inputs * fix(editor): removing unused prop from ParameterInputWrapper.vue * fix(editor): reorganizing and updating props in ParameterInputFull.vue * fix(editor): proper typings for node related translations * fix(editor): fix typings for input localisation functions * fix(editor): simplifying localisation functions * Revert "fix(editor): simplifying localisation functions" This reverts commit 3d93ccf0cf4f62b07c49871825f4a518766ca470. * fix(editor): move nullish coalescing into called function
This commit is contained in:
Csaba Tuncsik
GitHub
@@ -1,8 +1,7 @@
|
||||
import _Vue from "vue";
|
||||
import Vue from 'vue';
|
||||
import axios from 'axios';
|
||||
import VueI18n from 'vue-i18n';
|
||||
import { Store } from "vuex";
|
||||
import Vue from 'vue';
|
||||
import { INodeTranslationHeaders, IRootState } from '@/Interface';
|
||||
import {
|
||||
deriveMiddleKey,
|
||||
@@ -15,14 +14,14 @@ import {
|
||||
} from 'n8n-design-system';
|
||||
|
||||
import englishBaseText from './locales/en.json';
|
||||
import { INodeProperties } from "n8n-workflow";
|
||||
import {INodeProperties, INodePropertyCollection, INodePropertyOptions} from "n8n-workflow";
|
||||
|
||||
Vue.use(VueI18n);
|
||||
locale.use('en');
|
||||
|
||||
export let i18n: I18nClass;
|
||||
|
||||
export function I18nPlugin(vue: typeof _Vue, store: Store<IRootState>): void {
|
||||
export function I18nPlugin(vue: typeof Vue, store: Store<IRootState>): void {
|
||||
i18n = new I18nClass(store);
|
||||
|
||||
Object.defineProperty(vue, '$locale', {
|
||||
@@ -79,9 +78,9 @@ export class I18nClass {
|
||||
* Render a string of dynamic text, i.e. a string with a constructed path to the localized value.
|
||||
*/
|
||||
private dynamicRender(
|
||||
{ key, fallback }: { key: string; fallback: string; },
|
||||
{ key, fallback }: { key: string; fallback?: string; },
|
||||
) {
|
||||
return this.i18n.te(key) ? this.i18n.t(key).toString() : fallback;
|
||||
return this.i18n.te(key) ? this.i18n.t(key).toString() : fallback ?? '';
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -106,7 +105,7 @@ export class I18nClass {
|
||||
* Display name for a top-level param.
|
||||
*/
|
||||
inputLabelDisplayName(
|
||||
{ name: parameterName, displayName }: { name: string; displayName: string; },
|
||||
{ name: parameterName, displayName }: INodeProperties,
|
||||
) {
|
||||
if (['clientId', 'clientSecret'].includes(parameterName)) {
|
||||
return context.dynamicRender({
|
||||
@@ -125,11 +124,11 @@ export class I18nClass {
|
||||
* Hint for a top-level param.
|
||||
*/
|
||||
hint(
|
||||
{ name: parameterName, hint }: { name: string; hint?: string; },
|
||||
{ name: parameterName, hint }: INodeProperties,
|
||||
) {
|
||||
return context.dynamicRender({
|
||||
key: `${credentialPrefix}.${parameterName}.hint`,
|
||||
fallback: hint || '',
|
||||
fallback: hint,
|
||||
});
|
||||
},
|
||||
|
||||
@@ -137,7 +136,7 @@ export class I18nClass {
|
||||
* Description (tooltip text) for an input label param.
|
||||
*/
|
||||
inputLabelDescription(
|
||||
{ name: parameterName, description }: { name: string; description: string; },
|
||||
{ name: parameterName, description }: INodeProperties,
|
||||
) {
|
||||
return context.dynamicRender({
|
||||
key: `${credentialPrefix}.${parameterName}.description`,
|
||||
@@ -149,8 +148,8 @@ export class I18nClass {
|
||||
* Display name for an option inside an `options` or `multiOptions` param.
|
||||
*/
|
||||
optionsOptionDisplayName(
|
||||
{ name: parameterName }: { name: string; },
|
||||
{ value: optionName, name: displayName }: { value: string; name: string; },
|
||||
{ name: parameterName }: INodeProperties,
|
||||
{ value: optionName, name: displayName }: INodePropertyOptions,
|
||||
) {
|
||||
return context.dynamicRender({
|
||||
key: `${credentialPrefix}.${parameterName}.options.${optionName}.displayName`,
|
||||
@@ -162,8 +161,8 @@ export class I18nClass {
|
||||
* Description for an option inside an `options` or `multiOptions` param.
|
||||
*/
|
||||
optionsOptionDescription(
|
||||
{ name: parameterName }: { name: string; },
|
||||
{ value: optionName, description }: { value: string; description: string; },
|
||||
{ name: parameterName }: INodeProperties,
|
||||
{ value: optionName, description }: INodePropertyOptions,
|
||||
) {
|
||||
return context.dynamicRender({
|
||||
key: `${credentialPrefix}.${parameterName}.options.${optionName}.description`,
|
||||
@@ -175,11 +174,11 @@ export class I18nClass {
|
||||
* Placeholder for a `string` param.
|
||||
*/
|
||||
placeholder(
|
||||
{ name: parameterName, placeholder }: { name: string; placeholder?: string; },
|
||||
{ name: parameterName, placeholder }: INodeProperties,
|
||||
) {
|
||||
return context.dynamicRender({
|
||||
key: `${credentialPrefix}.${parameterName}.placeholder`,
|
||||
fallback: placeholder || '',
|
||||
fallback: placeholder,
|
||||
});
|
||||
},
|
||||
};
|
||||
@@ -200,7 +199,7 @@ export class I18nClass {
|
||||
* Display name for an input label, whether top-level or nested.
|
||||
*/
|
||||
inputLabelDisplayName(
|
||||
parameter: { name: string; displayName: string; type: string },
|
||||
parameter: INodeProperties,
|
||||
path: string,
|
||||
) {
|
||||
const middleKey = deriveMiddleKey(path, parameter);
|
||||
@@ -215,7 +214,7 @@ export class I18nClass {
|
||||
* Description (tooltip text) for an input label, whether top-level or nested.
|
||||
*/
|
||||
inputLabelDescription(
|
||||
parameter: { name: string; description: string; type: string },
|
||||
parameter: INodeProperties,
|
||||
path: string,
|
||||
) {
|
||||
const middleKey = deriveMiddleKey(path, parameter);
|
||||
@@ -230,7 +229,7 @@ export class I18nClass {
|
||||
* Hint for an input, whether top-level or nested.
|
||||
*/
|
||||
hint(
|
||||
parameter: { name: string; hint: string; type: string },
|
||||
parameter: INodeProperties,
|
||||
path: string,
|
||||
) {
|
||||
const middleKey = deriveMiddleKey(path, parameter);
|
||||
@@ -248,7 +247,7 @@ export class I18nClass {
|
||||
* - For a `collection` or `fixedCollection`, the placeholder is the button text.
|
||||
*/
|
||||
placeholder(
|
||||
parameter: { name: string; placeholder?: string; type: string },
|
||||
parameter: INodeProperties,
|
||||
path: string,
|
||||
) {
|
||||
let middleKey = parameter.name;
|
||||
@@ -260,7 +259,7 @@ export class I18nClass {
|
||||
|
||||
return context.dynamicRender({
|
||||
key: `${initialKey}.${middleKey}.placeholder`,
|
||||
fallback: parameter.placeholder || '',
|
||||
fallback: parameter.placeholder,
|
||||
});
|
||||
},
|
||||
|
||||
@@ -269,8 +268,8 @@ export class I18nClass {
|
||||
* whether top-level or nested.
|
||||
*/
|
||||
optionsOptionDisplayName(
|
||||
parameter: { name: string; },
|
||||
{ value: optionName, name: displayName }: { value: string; name: string; },
|
||||
parameter: INodeProperties,
|
||||
{ value: optionName, name: displayName }: INodePropertyOptions,
|
||||
path: string,
|
||||
) {
|
||||
let middleKey = parameter.name;
|
||||
@@ -291,8 +290,8 @@ export class I18nClass {
|
||||
* whether top-level or nested.
|
||||
*/
|
||||
optionsOptionDescription(
|
||||
parameter: { name: string; },
|
||||
{ value: optionName, description }: { value: string; description: string; },
|
||||
parameter: INodeProperties,
|
||||
{ value: optionName, description }: INodePropertyOptions,
|
||||
path: string,
|
||||
) {
|
||||
let middleKey = parameter.name;
|
||||
@@ -314,8 +313,8 @@ export class I18nClass {
|
||||
* be nested in a `collection` or in a `fixedCollection`.
|
||||
*/
|
||||
collectionOptionDisplayName(
|
||||
parameter: { name: string; },
|
||||
{ name: optionName, displayName }: { name: string; displayName: string; },
|
||||
parameter: INodeProperties,
|
||||
{ name: optionName, displayName }: INodePropertyCollection,
|
||||
path: string,
|
||||
) {
|
||||
let middleKey = parameter.name;
|
||||
@@ -340,7 +339,7 @@ export class I18nClass {
|
||||
) {
|
||||
return context.dynamicRender({
|
||||
key: `${initialKey}.${parameterName}.multipleValueButtonText`,
|
||||
fallback: typeOptions!.multipleValueButtonText!,
|
||||
fallback: typeOptions?.multipleValueButtonText,
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
Reference in New Issue
Block a user