From 618b1aba3046d9aff68aa7cffdfb79afa0487143 Mon Sep 17 00:00:00 2001
From: Alex Grozav <alex@grozav.com>
Date: Thu, 15 Jun 2023 18:27:35 +0300
Subject: [PATCH] feat: Replace Vue.delete with native alternative
 (no-changelog) (#6444)

* feat: replace Vue.delete with native alternative (no-changelog)

* fix: fix linting issues
---
 .../src/components/ExecutionsList.vue         |  6 ++-
 .../editor-ui/src/components/NodeSettings.vue | 15 ++++---
 .../src/stores/communityNodes.store.ts        |  3 +-
 .../editor-ui/src/stores/credentials.store.ts |  3 +-
 packages/editor-ui/src/stores/tags.store.ts   |  3 +-
 .../editor-ui/src/stores/workflows.store.ts   | 40 ++++++++++++++-----
 6 files changed, 48 insertions(+), 22 deletions(-)

diff --git a/packages/editor-ui/src/components/ExecutionsList.vue b/packages/editor-ui/src/components/ExecutionsList.vue
index 974da420ba..e9c8e99292 100644
--- a/packages/editor-ui/src/components/ExecutionsList.vue
+++ b/packages/editor-ui/src/components/ExecutionsList.vue
@@ -282,7 +282,7 @@
 </template>
 
 <script lang="ts">
-import Vue, { defineComponent } from 'vue';
+import { defineComponent } from 'vue';
 import { mapStores } from 'pinia';
 import ExecutionTime from '@/components/ExecutionTime.vue';
 import ExecutionFilter from '@/components/ExecutionFilter.vue';
@@ -439,7 +439,9 @@ export default defineComponent({
 		},
 		handleCheckboxChanged(executionId: string) {
 			if (this.selectedItems[executionId]) {
-				Vue.delete(this.selectedItems, executionId);
+				const { [executionId]: removedSelectedItem, ...remainingSelectedItems } =
+					this.selectedItems;
+				this.selectedItems = remainingSelectedItems;
 			} else {
 				this.selectedItems = {
 					...this.selectedItems,
diff --git a/packages/editor-ui/src/components/NodeSettings.vue b/packages/editor-ui/src/components/NodeSettings.vue
index 482f39b08a..db444dcbe6 100644
--- a/packages/editor-ui/src/components/NodeSettings.vue
+++ b/packages/editor-ui/src/components/NodeSettings.vue
@@ -158,7 +158,7 @@
 
 <script lang="ts">
 import type { PropType } from 'vue';
-import Vue, { defineComponent } from 'vue';
+import { defineComponent } from 'vue';
 import { mapStores } from 'pinia';
 import type {
 	INodeTypeDescription,
@@ -529,8 +529,8 @@ export default defineComponent({
 				// Data is on top level
 				if (value === null) {
 					// Property should be deleted
-					// @ts-ignore
-					Vue.delete(this.nodeValues, lastNamePart);
+					const { [lastNamePart]: removedNodeValue, ...remainingNodeValues } = this.nodeValues;
+					this.nodeValues = remainingNodeValues;
 				} else {
 					// Value should be set
 					this.nodeValues = {
@@ -542,18 +542,21 @@ export default defineComponent({
 				// Data is on lower level
 				if (value === null) {
 					// Property should be deleted
-					// @ts-ignore
 					let tempValue = get(this.nodeValues, nameParts.join('.')) as
 						| INodeParameters
 						| INodeParameters[];
-					Vue.delete(tempValue as object, lastNamePart as string);
+
+					const { [lastNamePart]: removedNodeValue, ...remainingNodeValues } = tempValue;
+					tempValue = remainingNodeValues;
 
 					if (isArray === true && (tempValue as INodeParameters[]).length === 0) {
 						// If a value from an array got delete and no values are left
 						// delete also the parent
 						lastNamePart = nameParts.pop();
 						tempValue = get(this.nodeValues, nameParts.join('.')) as INodeParameters;
-						Vue.delete(tempValue as object, lastNamePart as string);
+						const { [lastNamePart]: removedArrayNodeValue, ...remainingArrayNodeValues } =
+							tempValue;
+						tempValue = remainingArrayNodeValues;
 					}
 				} else {
 					// Value should be set
diff --git a/packages/editor-ui/src/stores/communityNodes.store.ts b/packages/editor-ui/src/stores/communityNodes.store.ts
index 2650b40a74..d32d7b647a 100644
--- a/packages/editor-ui/src/stores/communityNodes.store.ts
+++ b/packages/editor-ui/src/stores/communityNodes.store.ts
@@ -86,7 +86,8 @@ export const useCommunityNodesStore = defineStore(STORES.COMMUNITY_NODES, {
 			);
 		},
 		removePackageByName(name: string): void {
-			Vue.delete(this.installedPackages, name);
+			const { [name]: removedPackage, ...remainingPackages } = this.installedPackages;
+			this.installedPackages = remainingPackages;
 		},
 		updatePackageObject(newPackage: PublicInstalledPackage) {
 			this.installedPackages[newPackage.packageName] = newPackage;
diff --git a/packages/editor-ui/src/stores/credentials.store.ts b/packages/editor-ui/src/stores/credentials.store.ts
index 52baa47b92..4d7d0e75b1 100644
--- a/packages/editor-ui/src/stores/credentials.store.ts
+++ b/packages/editor-ui/src/stores/credentials.store.ts
@@ -317,7 +317,8 @@ export const useCredentialsStore = defineStore(STORES.CREDENTIALS, {
 			const rootStore = useRootStore();
 			const deleted = await deleteCredential(rootStore.getRestApiContext, id);
 			if (deleted) {
-				Vue.delete(this.credentials, id);
+				const { [id]: deletedCredential, ...rest } = this.credentials;
+				this.credentials = rest;
 			}
 		},
 		async oAuth2Authorize(data: ICredentialsResponse): Promise<string> {
diff --git a/packages/editor-ui/src/stores/tags.store.ts b/packages/editor-ui/src/stores/tags.store.ts
index e3599c1ee4..46fa880aa7 100644
--- a/packages/editor-ui/src/stores/tags.store.ts
+++ b/packages/editor-ui/src/stores/tags.store.ts
@@ -58,7 +58,8 @@ export const useTagsStore = defineStore(STORES.TAGS, {
 			});
 		},
 		deleteTag(id: string): void {
-			Vue.delete(this.tags, id);
+			const { [id]: deleted, ...rest } = this.tags;
+			this.tags = rest;
 		},
 
 		async fetchAll(params?: { force?: boolean; withUsageCount?: boolean }): Promise<ITag[]> {
diff --git a/packages/editor-ui/src/stores/workflows.store.ts b/packages/editor-ui/src/stores/workflows.store.ts
index 61037d660d..54099d14ba 100644
--- a/packages/editor-ui/src/stores/workflows.store.ts
+++ b/packages/editor-ui/src/stores/workflows.store.ts
@@ -854,19 +854,18 @@ export const useWorkflowsStore = defineStore(STORES.WORKFLOWS, {
 				uiStore.lastSelectedNode = nameData.new;
 			}
 
-			this.nodeMetadata = { ...this.nodeMetadata, [nameData.new]: this.nodeMetadata[nameData.old] };
-			Vue.delete(this.nodeMetadata, nameData.old);
+			const { [nameData.old]: removed, ...rest } = this.nodeMetadata;
+			this.nodeMetadata = { ...rest, [nameData.new]: this.nodeMetadata[nameData.old] };
 
 			if (this.workflow.pinData && this.workflow.pinData.hasOwnProperty(nameData.old)) {
+				const { [nameData.old]: renamed, ...restPinData } = this.workflow.pinData;
 				this.workflow = {
 					...this.workflow,
 					pinData: {
-						...this.workflow.pinData,
-						[nameData.new]: this.workflow.pinData[nameData.old],
+						...restPinData,
+						[nameData.new]: renamed,
 					},
 				};
-
-				Vue.delete(this.workflow.pinData!, nameData.old);
 			}
 
 			this.workflowExecutionPairedItemMappings = getPairedItemsMapping(this.workflowExecutionData);
@@ -911,8 +910,10 @@ export const useWorkflowsStore = defineStore(STORES.WORKFLOWS, {
 					return true;
 				}
 
-				// @ts-ignore
-				Vue.delete(node.issues, nodeIssueData.type);
+				const { [nodeIssueData.type]: removedNodeIssue, ...remainingNodeIssues } = node.issues;
+				this.updateNodeAtIndex(nodeIndex, {
+					issues: remainingNodeIssues,
+				});
 			} else {
 				if (node.issues === undefined) {
 					this.updateNodeAtIndex(nodeIndex, {
@@ -945,10 +946,15 @@ export const useWorkflowsStore = defineStore(STORES.WORKFLOWS, {
 		},
 
 		removeNode(node: INodeUi): void {
-			Vue.delete(this.nodeMetadata, node.name);
+			const { [node.name]: removedNodeMetadata, ...remainingNodeMetadata } = this.nodeMetadata;
+			this.nodeMetadata = remainingNodeMetadata;
 
 			if (this.workflow.pinData && this.workflow.pinData.hasOwnProperty(node.name)) {
-				Vue.delete(this.workflow.pinData, node.name);
+				const { [node.name]: removedPinData, ...remainingPinData } = this.workflow.pinData;
+				this.workflow = {
+					...this.workflow,
+					pinData: remainingPinData,
+				};
 			}
 
 			for (let i = 0; i < this.workflow.nodes.length; i++) {
@@ -1094,7 +1100,19 @@ export const useWorkflowsStore = defineStore(STORES.WORKFLOWS, {
 			if (this.workflowExecutionData === null || !this.workflowExecutionData.data) {
 				return;
 			}
-			Vue.delete(this.workflowExecutionData.data.resultData.runData, nodeName);
+
+			const { [nodeName]: removedRunData, ...remainingRunData } =
+				this.workflowExecutionData.data.resultData.runData;
+			this.workflowExecutionData = {
+				...this.workflowExecutionData,
+				data: {
+					...this.workflowExecutionData.data,
+					resultData: {
+						...this.workflowExecutionData.data.resultData,
+						runData: remainingRunData,
+					},
+				},
+			};
 		},
 
 		pinDataByNodeName(nodeName: string): INodeExecutionData[] | undefined {