From 8e2191b6339e27777ab29f11459dcfaa4a0a4157 Mon Sep 17 00:00:00 2001
From: Elvina Valieva <tilitidam@gmail.com>
Date: Fri, 10 Dec 2021 18:53:31 +0100
Subject: [PATCH] :bug: Fix recommendation logic (#2543)

* fix: expect multiple answers for survey

* chore: refactor survey input methods

* fix error; fix tracking

Co-authored-by: Mutasem <mutdmour@gmail.com>
---
 packages/cli/src/Interfaces.ts                |  6 ++-
 packages/cli/src/InternalHooks.ts             |  2 +
 packages/editor-ui/src/Interface.ts           |  7 ++-
 .../src/components/PersonalizationModal.vue   | 46 ++++++++-----------
 packages/editor-ui/src/modules/helper.ts      | 32 ++++++++-----
 5 files changed, 51 insertions(+), 42 deletions(-)

diff --git a/packages/cli/src/Interfaces.ts b/packages/cli/src/Interfaces.ts
index 30cd03b8b0..8559dd4968 100644
--- a/packages/cli/src/Interfaces.ts
+++ b/packages/cli/src/Interfaces.ts
@@ -406,10 +406,12 @@ export interface IN8nUISettings {
 }
 
 export interface IPersonalizationSurveyAnswers {
-	companySize: string | null;
 	codingSkill: string | null;
-	workArea: string | null;
+	companyIndustry: string[];
+	companySize: string | null;
+	otherCompanyIndustry: string | null;
 	otherWorkArea: string | null;
+	workArea: string[] | string | null;
 }
 
 export interface IPersonalizationSurvey {
diff --git a/packages/cli/src/InternalHooks.ts b/packages/cli/src/InternalHooks.ts
index fc67a3634e..a2e1ae54d2 100644
--- a/packages/cli/src/InternalHooks.ts
+++ b/packages/cli/src/InternalHooks.ts
@@ -45,6 +45,8 @@ export class InternalHooksClass implements IInternalHooksClass {
 			coding_skill: answers.codingSkill,
 			work_area: answers.workArea,
 			other_work_area: answers.otherWorkArea,
+			company_industry: answers.companyIndustry,
+			other_company_industry: answers.otherCompanyIndustry,
 		});
 	}
 
diff --git a/packages/editor-ui/src/Interface.ts b/packages/editor-ui/src/Interface.ts
index 5248c17bd9..a625f6c75b 100644
--- a/packages/editor-ui/src/Interface.ts
+++ b/packages/editor-ui/src/Interface.ts
@@ -473,7 +473,12 @@ export interface IVersionNotificationSettings {
 export type IPersonalizationSurveyKeys = 'codingSkill' | 'companyIndustry' | 'companySize' | 'otherCompanyIndustry' | 'otherWorkArea' | 'workArea';
 
 export type IPersonalizationSurveyAnswers = {
-	[key in IPersonalizationSurveyKeys]: string | null
+	codingSkill: string | null;
+	companyIndustry: string[];
+	companySize: string | null;
+	otherCompanyIndustry: string | null;
+	otherWorkArea: string | null;
+	workArea: string[] | string | null;
 };
 
 export interface IPersonalizationSurvey {
diff --git a/packages/editor-ui/src/components/PersonalizationModal.vue b/packages/editor-ui/src/components/PersonalizationModal.vue
index 37727a4ccc..124e7ea04c 100644
--- a/packages/editor-ui/src/components/PersonalizationModal.vue
+++ b/packages/editor-ui/src/components/PersonalizationModal.vue
@@ -10,7 +10,6 @@
 		:closeOnPressEscape="false"
 		width="460px"
 		@enter="save"
-		@input="onInput"
 	>
 		<template v-slot:content>
 			<div v-if="submitted" :class="$style.submittedContainer">
@@ -19,7 +18,7 @@
 			</div>
 			<div :class="$style.container" v-else>
 				<n8n-input-label label="How are your coding skills?">
-					<n8n-select :value="values[CODING_SKILL_KEY]" placeholder="Select..." @change="(value) => onInput(CODING_SKILL_KEY, value)">
+					<n8n-select :value="values[CODING_SKILL_KEY]" placeholder="Select..." @change="(value) => values[CODING_SKILL_KEY] = value">
 						<n8n-option
 							label="0. Never coded"
 							value="0"
@@ -48,7 +47,7 @@
 				</n8n-input-label>
 
 				<n8n-input-label label="Which areas do you mainly work in?">
-					<n8n-select :value="values[WORK_AREA_KEY]" multiple placeholder="Select..." @change="(value) => onInput(WORK_AREA_KEY, value)">
+					<n8n-select :value="values[WORK_AREA_KEY]" multiple placeholder="Select..." @change="(value) => onMultiInput(WORK_AREA_KEY, value)">
 						<n8n-option :value="FINANCE_WORK_AREA" label="Finance" />
 						<n8n-option :value="HR_WORK_AREA" label="HR" />
 						<n8n-option :value="IT_ENGINEERING_WORK_AREA" label="IT / Engineering" />
@@ -68,12 +67,12 @@
 					v-if="otherWorkAreaFieldVisible"
 					:value="values[OTHER_WORK_AREA_KEY]"
 					placeholder="Specify your work area"
-					@input="(value) => onInput(OTHER_WORK_AREA_KEY, value)"
+					@input="(value) => values[OTHER_WORK_AREA_KEY] = value"
 				/>
 
 				<section v-if="showAllIndustryQuestions">
 					<n8n-input-label label="Which industries is your company in?">
-					<n8n-select :value="values[COMPANY_INDUSTRY_KEY]" multiple placeholder="Select..." @change="(value) => onInput(COMPANY_INDUSTRY_KEY, value)">
+					<n8n-select :value="values[COMPANY_INDUSTRY_KEY]" multiple placeholder="Select..." @change="(value) => onMultiInput(COMPANY_INDUSTRY_KEY, value)">
 						<n8n-option :value="E_COMMERCE_INDUSTRY" label="eCommerce" />
 						<n8n-option :value="AUTOMATION_CONSULTING_INDUSTRY" label="Automation consulting" />
 						<n8n-option :value="SYSTEM_INTEGRATION_INDUSTRY" label="Systems integration" />
@@ -90,12 +89,12 @@
 					v-if="otherCompanyIndustryFieldVisible"
 					:value="values[OTHER_COMPANY_INDUSTRY_KEY]"
 					placeholder="Specify your company's industry"
-					@input="(value) => onInput(OTHER_COMPANY_INDUSTRY_KEY, value)"
+					@input="(value) => values[OTHER_COMPANY_INDUSTRY_KEY] = value"
 				/>
 
 
 				<n8n-input-label label="How big is your company?">
-					<n8n-select :value="values[COMPANY_SIZE_KEY]" placeholder="Select..." @change="(value) => onInput(COMPANY_SIZE_KEY, value)">
+					<n8n-select :value="values[COMPANY_SIZE_KEY]" placeholder="Select..." @change="(value) => values[COMPANY_SIZE_KEY] = value">
 						<n8n-option
 							label="Less than 20 people"
 							:value="COMPANY_SIZE_20_OR_LESS"
@@ -196,11 +195,11 @@ export default mixins(showMessage, workflowHelpers).extend({
 			showAllIndustryQuestions: true,
 			modalBus: new Vue(),
 			values: {
-				[WORK_AREA_KEY]: null,
+				[WORK_AREA_KEY]: [],
 				[COMPANY_SIZE_KEY]: null,
 				[CODING_SKILL_KEY]: null,
 				[OTHER_WORK_AREA_KEY]: null,
-				[COMPANY_INDUSTRY_KEY]: null,
+				[COMPANY_INDUSTRY_KEY]: [],
 				[OTHER_COMPANY_INDUSTRY_KEY]: null,
 			} as IPersonalizationSurveyAnswers,
 			FINANCE_WORK_AREA,
@@ -249,28 +248,19 @@ export default mixins(showMessage, workflowHelpers).extend({
 		closeDialog() {
 			this.modalBus.$emit('close');
 		},
-		onInput(name: IPersonalizationSurveyKeys, value: string) {
-			if (name === WORK_AREA_KEY && value.includes(OTHER_WORK_AREA_OPTION)) {
-				this.otherWorkAreaFieldVisible = true;
+		onMultiInput(name: IPersonalizationSurveyKeys, value: string[]) {
+			if (name === WORK_AREA_KEY) {
+				this.otherWorkAreaFieldVisible = value.includes(OTHER_WORK_AREA_OPTION);
+				this.showAllIndustryQuestions = !value.includes(NOT_APPLICABLE_WORK_AREA);
+				this.values[OTHER_WORK_AREA_KEY] = value.includes(OTHER_WORK_AREA_OPTION) ? this.values[OTHER_WORK_AREA_KEY] : null;
+				this.values[WORK_AREA_KEY] = value;
 			}
-			else if (name === WORK_AREA_KEY && value.includes(NOT_APPLICABLE_WORK_AREA)) {
-				this.showAllIndustryQuestions = false;
-			}
-			else if (name === WORK_AREA_KEY) {
-				this.otherWorkAreaFieldVisible = false;
-				this.showAllIndustryQuestions = true;
-				this.values[OTHER_WORK_AREA_KEY] = null;
+			if (name === COMPANY_INDUSTRY_KEY) {
+				this.otherCompanyIndustryFieldVisible = value.includes(OTHER_INDUSTRY_OPTION);
+				this.values[OTHER_COMPANY_INDUSTRY_KEY] = value.includes(OTHER_INDUSTRY_OPTION) ? this.values[OTHER_COMPANY_INDUSTRY_KEY] : null;
+				this.values[COMPANY_INDUSTRY_KEY] = value;
 			}
 
-			if (name === COMPANY_INDUSTRY_KEY && value.includes(OTHER_INDUSTRY_OPTION)) {
-				this.otherCompanyIndustryFieldVisible = true;
-			}
-			else if (name === COMPANY_INDUSTRY_KEY) {
-				this.otherCompanyIndustryFieldVisible = false;
-				this.values[OTHER_COMPANY_INDUSTRY_KEY] = null;
-			}
-
-			this.values[name] = value;
 		},
 		async save(): Promise<void> {
 			this.$data.isSaving = true;
diff --git a/packages/editor-ui/src/modules/helper.ts b/packages/editor-ui/src/modules/helper.ts
index 5e92bf0976..46f81e4bfd 100644
--- a/packages/editor-ui/src/modules/helper.ts
+++ b/packages/editor-ui/src/modules/helper.ts
@@ -6,7 +6,17 @@ export function getPersonalizedNodeTypes(answers: IPersonalizationSurveyAnswers)
 	const companySize = answers[COMPANY_SIZE_KEY];
 	const workArea = answers[WORK_AREA_KEY];
 
-	if (companySize === null && workArea === null && answers[CODING_SKILL_KEY] === null) {
+	function isWorkAreaAnswer(name: string) {
+		if (Array.isArray(workArea)) {
+			return workArea.includes(name);
+		} else {
+			return workArea === name;
+		}
+	}
+
+	const workAreaIsEmpty = workArea === null || workArea.length === 0;
+
+	if (companySize === null && workAreaIsEmpty && answers[CODING_SKILL_KEY] === null) {
 		return [];
 	}
 
@@ -17,7 +27,7 @@ export function getPersonalizedNodeTypes(answers: IPersonalizationSurveyAnswers)
 	}
 
 	let nodeTypes = [] as string[];
-	if (workArea === IT_ENGINEERING_WORK_AREA) {
+	if (isWorkAreaAnswer(IT_ENGINEERING_WORK_AREA)) {
 		nodeTypes = nodeTypes.concat(WEBHOOK_NODE_TYPE);
 	}
 	else {
@@ -39,16 +49,16 @@ export function getPersonalizedNodeTypes(answers: IPersonalizationSurveyAnswers)
 	}
 
 	if (companySize === COMPANY_SIZE_500_999 || companySize === COMPANY_SIZE_1000_OR_MORE) {
-		if (workArea === SALES_BUSINESSDEV_WORK_AREA) {
+		if (isWorkAreaAnswer(SALES_BUSINESSDEV_WORK_AREA)) {
 			nodeTypes = nodeTypes.concat(SALESFORCE_NODE_TYPE);
 		}
-		else if (workArea === SECURITY_WORK_AREA) {
+		else if (isWorkAreaAnswer(SECURITY_WORK_AREA)) {
 			nodeTypes = nodeTypes.concat([ELASTIC_SECURITY_NODE_TYPE, HTTP_REQUEST_NODE_TYPE]);
 		}
-		else if (workArea === PRODUCT_WORK_AREA) {
+		else if (isWorkAreaAnswer(PRODUCT_WORK_AREA)) {
 			nodeTypes = nodeTypes.concat([JIRA_TRIGGER_NODE_TYPE, SEGMENT_NODE_TYPE]);
 		}
-		else if (workArea === IT_ENGINEERING_WORK_AREA) {
+		else if (isWorkAreaAnswer(IT_ENGINEERING_WORK_AREA)) {
 			nodeTypes = nodeTypes.concat([GITHUB_TRIGGER_NODE_TYPE, HTTP_REQUEST_NODE_TYPE]);
 		}
 		else {
@@ -56,19 +66,19 @@ export function getPersonalizedNodeTypes(answers: IPersonalizationSurveyAnswers)
 		}
 	}
 	else {
-		if (workArea === SALES_BUSINESSDEV_WORK_AREA) {
+		if (isWorkAreaAnswer(SALES_BUSINESSDEV_WORK_AREA)) {
 			nodeTypes = nodeTypes.concat(CLEARBIT_NODE_TYPE);
 		}
-		else if (workArea === SECURITY_WORK_AREA) {
+		else if (isWorkAreaAnswer(SECURITY_WORK_AREA)) {
 			nodeTypes = nodeTypes.concat([PAGERDUTY_NODE_TYPE, HTTP_REQUEST_NODE_TYPE]);
 		}
-		else if (workArea === PRODUCT_WORK_AREA) {
+		else if (isWorkAreaAnswer(PRODUCT_WORK_AREA)) {
 			nodeTypes = nodeTypes.concat([JIRA_TRIGGER_NODE_TYPE, CALENDLY_TRIGGER_NODE_TYPE]);
 		}
-		else if (workArea === IT_ENGINEERING_WORK_AREA) {
+		else if (isWorkAreaAnswer(IT_ENGINEERING_WORK_AREA)) {
 			nodeTypes = nodeTypes.concat([EXECUTE_COMMAND_NODE_TYPE, HTTP_REQUEST_NODE_TYPE]);
 		}
-		else if (workArea === FINANCE_WORK_AREA) {
+		else if (isWorkAreaAnswer(FINANCE_WORK_AREA)) {
 			nodeTypes = nodeTypes.concat([XERO_NODE_TYPE, QUICKBOOKS_NODE_TYPE, SPREADSHEET_FILE_NODE_TYPE]);
 		}
 		else {