From 8b82d724f5f25b930ea7f61ba4cdaf0886280489 Mon Sep 17 00:00:00 2001
From: Csaba Tuncsik <csaba@n8n.io>
Date: Tue, 1 Nov 2022 16:31:21 +0100
Subject: [PATCH] refactor(editor): restrict mapping discoverability tooltip
 showing only on string input

---
 .../src/components/ParameterInputFull.vue     | 52 +++++++++++++------
 packages/editor-ui/src/plugins/i18n/index.ts  |  9 ++--
 2 files changed, 40 insertions(+), 21 deletions(-)

diff --git a/packages/editor-ui/src/components/ParameterInputFull.vue b/packages/editor-ui/src/components/ParameterInputFull.vue
index 733b438940..84d8214962 100644
--- a/packages/editor-ui/src/components/ParameterInputFull.vue
+++ b/packages/editor-ui/src/components/ParameterInputFull.vue
@@ -59,7 +59,7 @@
 </template>
 
 <script lang="ts">
-import Vue from 'vue';
+import Vue, { PropType } from 'vue';
 
 import {
 	IN8nButton,
@@ -68,15 +68,15 @@ import {
 	IUpdateInformation,
 } from '@/Interface';
 
-import ParameterOptions from './ParameterOptions.vue';
+import ParameterOptions from '@/components/ParameterOptions.vue';
 import DraggableTarget from '@/components/DraggableTarget.vue';
 import mixins from 'vue-typed-mixins';
-import { showMessage } from './mixins/showMessage';
+import { showMessage } from '@/components/mixins/showMessage';
 import { LOCAL_STORAGE_MAPPING_FLAG } from '@/constants';
-import { hasExpressionMapping } from './helpers';
-import ParameterInputWrapper from './ParameterInputWrapper.vue';
-import { hasOnlyListMode } from './ResourceLocator/helpers';
-import { INodePropertyMode } from 'n8n-workflow';
+import { hasExpressionMapping } from '@/components/helpers';
+import ParameterInputWrapper from '@/components/ParameterInputWrapper.vue';
+import { hasOnlyListMode } from '@/components/ResourceLocator/helpers';
+import { INodeParameters, INodeProperties, INodePropertyMode } from 'n8n-workflow';
 import { isResourceLocatorValue } from '@/typeGuards';
 import { BaseTextKey } from "@/plugins/i18n";
 
@@ -98,14 +98,31 @@ export default mixins(
 				dataMappingTooltipButtons: [] as IN8nButton[],
 			};
 		},
-		props: [
-			'displayOptions',
-			'isReadOnly',
-			'parameter',
-			'path',
-			'value',
-			'hideLabel',
-		],
+		props: {
+			displayOptions: {
+				type: Boolean,
+				default: false,
+			},
+			isReadOnly: {
+				type: Boolean,
+				default: false,
+			},
+			parameter: {
+				type: Object as PropType<INodeProperties>,
+				required: true,
+			},
+			path: {
+				type: String,
+				required: true,
+			},
+			value: {
+				type: [Number, String, Boolean, Array, Object] as PropType<INodeParameters>,
+			},
+			hideLabel: {
+				type: Boolean,
+				default: false,
+			},
+		},
 		created() {
 			const mappingTooltipDismissHandler = this.onMappingTooltipDismissed.bind(this);
 			this.dataMappingTooltipButtons = [
@@ -126,6 +143,9 @@ export default mixins(
 			hint (): string | null {
 				return this.$locale.nodeText().hint(this.parameter, this.path);
 			},
+			isInputTypeMappable (): boolean {
+				return this.parameter.type === 'string';
+			},
 			isResourceLocator (): boolean {
 				return  this.parameter.type === 'resourceLocator';
 			},
@@ -142,7 +162,7 @@ export default mixins(
 				return this.$store.getters['ndv/inputPanelDisplayMode'];
 			},
 			showMappingTooltip (): boolean {
-				return this.focused && !this.isInputDataEmpty && window.localStorage.getItem(LOCAL_STORAGE_MAPPING_FLAG) !== 'true';
+				return this.focused && this.isInputTypeMappable && !this.isInputDataEmpty && window.localStorage.getItem(LOCAL_STORAGE_MAPPING_FLAG) !== 'true';
 			},
 		},
 		methods: {
diff --git a/packages/editor-ui/src/plugins/i18n/index.ts b/packages/editor-ui/src/plugins/i18n/index.ts
index 82bfa2b7d2..64c9438387 100644
--- a/packages/editor-ui/src/plugins/i18n/index.ts
+++ b/packages/editor-ui/src/plugins/i18n/index.ts
@@ -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,
@@ -22,7 +21,7 @@ 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', {
@@ -230,14 +229,14 @@ 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);
 
 				return context.dynamicRender({
 					key: `${initialKey}.${middleKey}.hint`,
-					fallback: parameter.hint,
+					fallback: parameter.hint || '',
 				});
 			},