fix: rename deprecated lifecycle methods

2025-03-05 20:50:17 -08:00 · 2023-06-22 17:37:17 +03:00 · 2023-06-22 17:37:17 +03:00 · 0f05cd6c17
parent 7da9a083c1
commit 0f05cd6c17
41 changed files with 134 additions and 124 deletions
--- a/packages/editor-ui/src/components/BreakpointsObserver.vue
+++ b/packages/editor-ui/src/components/BreakpointsObserver.vue
@ -32,7 +32,7 @@ export default defineComponent({
 	created() {
 		window.addEventListener('resize', this.onResize);
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		window.removeEventListener('resize', this.onResize);
 	},
 	methods: {
--- a/packages/editor-ui/src/components/CodeNodeEditor/CodeNodeEditor.vue
+++ b/packages/editor-ui/src/components/CodeNodeEditor/CodeNodeEditor.vue
@ -202,7 +202,7 @@ export default defineComponent({
 			} catch {}
 		},
 	},
-	destroyed() {
+	beforeUnmount() {
 		if (!this.isReadOnly) codeNodeEditorEventBus.off('error-line-number', this.highlightLine);
 	},
 	mounted() {
--- a/packages/editor-ui/src/components/CollectionParameter.vue
+++ b/packages/editor-ui/src/components/CollectionParameter.vue
@ -5,15 +5,17 @@
 				<n8n-text size="small">{{ $locale.baseText('collectionParameter.noProperties') }}</n8n-text>
 			</div>

-			<parameter-input-list
-				:parameters="getProperties"
-				:nodeValues="nodeValues"
-				:path="path"
-				:hideDelete="hideDelete"
-				:indent="true"
-				:isReadOnly="isReadOnly"
-				@valueChanged="valueChanged"
-			/>
+			<Suspense>
+				<parameter-input-list
+					:parameters="getProperties"
+					:nodeValues="nodeValues"
+					:path="path"
+					:hideDelete="hideDelete"
+					:indent="true"
+					:isReadOnly="isReadOnly"
+					@valueChanged="valueChanged"
+				/>
+			</Suspense>

 			<div v-if="parameterOptions.length > 0 && !isReadOnly" class="param-options">
 				<n8n-button
--- a/packages/editor-ui/src/components/CollectionsCarousel.vue
+++ b/packages/editor-ui/src/components/CollectionsCarousel.vue
@ -111,7 +111,7 @@ export default defineComponent({
 			}
 		});
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		const sliderRef = this.$refs.slider as SliderRef | undefined;
 		if (sliderRef) {
 			sliderRef.destroy();
--- a/packages/editor-ui/src/components/DraggableTarget.vue
+++ b/packages/editor-ui/src/components/DraggableTarget.vue
@ -35,7 +35,7 @@ export default defineComponent({
 		window.addEventListener('mousemove', this.onMouseMove);
 		window.addEventListener('mouseup', this.onMouseUp);
 	},
-	destroyed() {
+	beforeUnmount() {
 		window.removeEventListener('mousemove', this.onMouseMove);
 		window.removeEventListener('mouseup', this.onMouseUp);
 	},
--- a/packages/editor-ui/src/components/ExecutionTime.vue
+++ b/packages/editor-ui/src/components/ExecutionTime.vue
@ -33,7 +33,7 @@ export default defineComponent({
 			this.setNow();
 		}, 1000);
 	},
-	destroyed() {
+	beforeUnmount() {
 		// Make sure that the timer gets destroyed once no longer needed
 		if (this.intervalTimer !== null) {
 			clearInterval(this.intervalTimer);
--- a/packages/editor-ui/src/components/ExecutionsList.vue
+++ b/packages/editor-ui/src/components/ExecutionsList.vue
@ -363,7 +363,7 @@ export default defineComponent({
 			workflow_id: this.workflowsStore.workflowId,
 		});
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		this.stopAutoRefreshInterval();
 		document.removeEventListener('visibilitychange', this.onDocumentVisibilityChange);
 	},
--- a/packages/editor-ui/src/components/ExecutionsView/ExecutionsList.vue
+++ b/packages/editor-ui/src/components/ExecutionsView/ExecutionsList.vue
@ -197,7 +197,7 @@ export default defineComponent({

 		this.loading = false;
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		this.stopAutoRefreshInterval();
 		document.removeEventListener('visibilitychange', this.onDocumentVisibilityChange);
 	},
--- a/packages/editor-ui/src/components/ExpandableInput/ExpandableInputEdit.vue
+++ b/packages/editor-ui/src/components/ExpandableInput/ExpandableInputEdit.vue
@ -40,7 +40,7 @@ export default defineComponent({
 		}
 		this.eventBus?.on('focus', this.focus);
 	},
-	destroyed() {
+	beforeUnmount() {
 		this.eventBus?.off('focus', this.focus);
 	},
 	methods: {
--- a/packages/editor-ui/src/components/ExpressionEditorModal/ExpressionEditorModalInput.vue
+++ b/packages/editor-ui/src/components/ExpressionEditorModal/ExpressionEditorModalInput.vue
@ -107,7 +107,7 @@ export default defineComponent({
 			segments: this.displayableSegments,
 		});
 	},
-	destroyed() {
+	beforeUnmount() {
 		this.editor?.destroy();
 	},
 	methods: {
--- a/packages/editor-ui/src/components/ExpressionEditorModal/ExpressionEditorModalOutput.vue
+++ b/packages/editor-ui/src/components/ExpressionEditorModal/ExpressionEditorModalOutput.vue
@ -54,7 +54,7 @@ export default defineComponent({
 			}),
 		});
 	},
-	destroyed() {
+	beforeUnmount() {
 		this.editor?.destroy();
 	},
 	computed: {
--- a/packages/editor-ui/src/components/ExpressionParameterInput.vue
+++ b/packages/editor-ui/src/components/ExpressionParameterInput.vue
@ -18,7 +18,7 @@
 				:path="path"
 				@focus="onFocus"
 				@blur="onBlur"
-				@change="onChange"
+				@update="onChange"
 				ref="inlineInput"
 			/>
 			<n8n-icon
--- a/packages/editor-ui/src/components/FixedCollectionParameter.vue
+++ b/packages/editor-ui/src/components/FixedCollectionParameter.vue
@ -49,14 +49,16 @@
 								/>
 							</div>
 						</div>
-						<parameter-input-list
-							:parameters="property.values"
-							:nodeValues="nodeValues"
-							:path="getPropertyPath(property.name, index)"
-							:hideDelete="true"
-							:isReadOnly="isReadOnly"
-							@valueChanged="valueChanged"
-						/>
+						<Suspense>
+							<parameter-input-list
+								:parameters="property.values"
+								:nodeValues="nodeValues"
+								:path="getPropertyPath(property.name, index)"
+								:hideDelete="true"
+								:isReadOnly="isReadOnly"
+								@valueChanged="valueChanged"
+							/>
+						</Suspense>
 					</div>
 				</div>
 			</div>
--- a/packages/editor-ui/src/components/HtmlEditor/HtmlEditor.vue
+++ b/packages/editor-ui/src/components/HtmlEditor/HtmlEditor.vue
@ -274,7 +274,7 @@ export default defineComponent({
 		this.getHighlighter()?.addColor(this.editor, this.resolvableSegments);
 	},

-	destroyed() {
+	beforeUnmount() {
 		htmlEditorEventBus.off('format-html', this.format);
 	},
 });
--- a/packages/editor-ui/src/components/InlineExpressionEditor/InlineExpressionEditorInput.vue
+++ b/packages/editor-ui/src/components/InlineExpressionEditor/InlineExpressionEditorInput.vue
@ -140,12 +140,12 @@ export default defineComponent({

 		highlighter.addColor(this.editor, this.resolvableSegments);

-		this.$emit('change', {
+		this.$emit('update', {
 			value: this.unresolvedExpression,
 			segments: this.displayableSegments,
 		});
 	},
-	destroyed() {
+	beforeUnmount() {
 		this.editor?.destroy();
 	},
 	methods: {
--- a/packages/editor-ui/src/components/InlineExpressionEditor/InlineExpressionEditorOutput.vue
+++ b/packages/editor-ui/src/components/InlineExpressionEditor/InlineExpressionEditorOutput.vue
@ -47,7 +47,7 @@ export default defineComponent({
 			}),
 		});
 	},
-	destroyed() {
+	beforeUnmount() {
 		this.editor?.destroy();
 	},
 	computed: {
--- a/packages/editor-ui/src/components/IntersectionObserved.vue
+++ b/packages/editor-ui/src/components/IntersectionObserved.vue
@ -31,7 +31,7 @@ export default defineComponent({
 			this.eventBus.emit('observe', this.$refs.observed);
 		});
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		if (this.enabled) {
 			this.eventBus.emit('unobserve', this.$refs.observed);
 		}
--- a/packages/editor-ui/src/components/IntersectionObserver.vue
+++ b/packages/editor-ui/src/components/IntersectionObserver.vue
@ -61,7 +61,7 @@ export default defineComponent({
 			observer.unobserve(observed);
 		});
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		if (this.enabled) {
 			this.$data.observer.disconnect();
 		}
--- a/packages/editor-ui/src/components/MainHeader/MainHeader.vue
+++ b/packages/editor-ui/src/components/MainHeader/MainHeader.vue
@ -91,7 +91,7 @@ export default defineComponent({
 		// Initialize the push connection
 		this.pushConnect();
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		this.pushDisconnect();
 	},
 	watch: {
--- a/packages/editor-ui/src/components/MainSidebar.vue
+++ b/packages/editor-ui/src/components/MainSidebar.vue
@ -347,7 +347,7 @@ export default defineComponent({
 	created() {
 		window.addEventListener('resize', this.onResize);
 	},
-	destroyed() {
+	beforeUnmount() {
 		window.removeEventListener('resize', this.onResize);
 	},
 	methods: {
--- a/packages/editor-ui/src/components/Modal.vue
+++ b/packages/editor-ui/src/components/Modal.vue
@ -133,7 +133,7 @@ export default defineComponent({
 			activeElement.blur();
 		}
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		this.eventBus?.off('close', this.closeDialog);
 		this.eventBus?.off('closeAll', this.uiStore.closeAllModals);
 		window.removeEventListener('keydown', this.onWindowKeydown);
--- a/packages/editor-ui/src/components/ModalDrawer.vue
+++ b/packages/editor-ui/src/components/ModalDrawer.vue
@ -59,7 +59,7 @@ export default defineComponent({
 			activeElement.blur();
 		}
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		this.eventBus?.off('close', this.close);
 		window.removeEventListener('keydown', this.onWindowKeydown);
 	},
--- a/packages/editor-ui/src/components/NDVDraggablePanels.vue
+++ b/packages/editor-ui/src/components/NDVDraggablePanels.vue
@ -119,7 +119,7 @@ export default defineComponent({
 			this.initialized = true;
 		}, 0);
 	},
-	destroyed() {
+	beforeUnmount() {
 		window.removeEventListener('resize', this.setTotalWidth);
 	},
 	computed: {
--- a/packages/editor-ui/src/components/NodeDetailsView.vue
+++ b/packages/editor-ui/src/components/NodeDetailsView.vue
@ -213,7 +213,7 @@ export default defineComponent({
 	mounted() {
 		dataPinningEventBus.on('data-pinning-discovery', this.setIsTooltipVisible);
 	},
-	destroyed() {
+	beforeUnmount() {
 		dataPinningEventBus.off('data-pinning-discovery', this.setIsTooltipVisible);
 	},
 	computed: {
--- a/packages/editor-ui/src/components/NodeSettings.vue
+++ b/packages/editor-ui/src/components/NodeSettings.vue
@ -952,7 +952,7 @@ export default defineComponent({

 		this.updateNodeParameterIssues(this.node as INodeUi, this.nodeType);
 	},
-	destroyed() {
+	beforeUnmount() {
 		this.eventBus?.off('openSettings', this.openSettings);
 	},
 });
--- a/packages/editor-ui/src/components/PageAlert.vue
+++ b/packages/editor-ui/src/components/PageAlert.vue
@ -40,7 +40,7 @@ export default defineComponent({
 			customClass: this.popupClass || '',
 		});
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		if (this.alert) {
 			this.alert.close();
 		}
--- a/packages/editor-ui/src/components/ParameterInput.vue
+++ b/packages/editor-ui/src/components/ParameterInput.vue
@ -1193,7 +1193,7 @@ export default defineComponent({
 			inputFieldRef: this.$refs['inputField'],
 		});
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		this.eventBus.off('optionSelected', this.optionSelected);
 	},
 });
--- a/packages/editor-ui/src/components/ParameterInputList.vue
+++ b/packages/editor-ui/src/components/ParameterInputList.vue
@ -62,24 +62,26 @@
 					:underline="true"
 					color="text-dark"
 				/>
-				<collection-parameter
-					v-if="parameter.type === 'collection'"
-					:parameter="parameter"
-					:values="getParameterValue(nodeValues, parameter.name, path)"
-					:nodeValues="nodeValues"
-					:path="getPath(parameter.name)"
-					:isReadOnly="isReadOnly"
-					@valueChanged="valueChanged"
-				/>
-				<fixed-collection-parameter
-					v-else-if="parameter.type === 'fixedCollection'"
-					:parameter="parameter"
-					:values="getParameterValue(nodeValues, parameter.name, path)"
-					:nodeValues="nodeValues"
-					:path="getPath(parameter.name)"
-					:isReadOnly="isReadOnly"
-					@valueChanged="valueChanged"
-				/>
+				<Suspense>
+					<collection-parameter
+						v-if="parameter.type === 'collection'"
+						:parameter="parameter"
+						:values="getParameterValue(nodeValues, parameter.name, path)"
+						:nodeValues="nodeValues"
+						:path="getPath(parameter.name)"
+						:isReadOnly="isReadOnly"
+						@valueChanged="valueChanged"
+					/>
+					<fixed-collection-parameter
+						v-else-if="parameter.type === 'fixedCollection'"
+						:parameter="parameter"
+						:values="getParameterValue(nodeValues, parameter.name, path)"
+						:nodeValues="nodeValues"
+						:path="getPath(parameter.name)"
+						:isReadOnly="isReadOnly"
+						@valueChanged="valueChanged"
+					/>
+				</Suspense>
 			</div>
 			<resource-mapper
 				v-else-if="parameter.type === 'resourceMapper'"
--- a/packages/editor-ui/src/components/ParameterInputWrapper.vue
+++ b/packages/editor-ui/src/components/ParameterInputWrapper.vue
@ -80,7 +80,7 @@ export default defineComponent({
 	mounted() {
 		this.eventBus.on('optionSelected', this.optionSelected);
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		this.eventBus.off('optionSelected', this.optionSelected);
 	},
 	props: {
--- a/packages/editor-ui/src/components/ResourceLocator/ResourceLocator.vue
+++ b/packages/editor-ui/src/components/ResourceLocator/ResourceLocator.vue
@ -491,7 +491,7 @@ export default defineComponent({
 			this.setWidth();
 		}, 0);
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		this.eventBus.off('refreshList', this.refreshList);
 		window.removeEventListener('resize', this.setWidth);
 	},
--- a/packages/editor-ui/src/components/ResourceLocator/ResourceLocatorDropdown.vue
+++ b/packages/editor-ui/src/components/ResourceLocator/ResourceLocatorDropdown.vue
@ -135,7 +135,7 @@ export default defineComponent({
 	mounted() {
 		this.eventBus.on('keyDown', this.onKeyDown);
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		this.eventBus.off('keyDown', this.onKeyDown);
 	},
 	computed: {
--- a/packages/editor-ui/src/components/RunData.vue
+++ b/packages/editor-ui/src/components/RunData.vue
@ -302,49 +302,51 @@
 				</n8n-text>
 			</div>

-			<run-data-table
-				v-else-if="hasNodeRun && displayMode === 'table'"
-				:node="node"
-				:inputData="inputData"
-				:mappingEnabled="mappingEnabled"
-				:distanceFromActive="distanceFromActive"
-				:runIndex="runIndex"
-				:pageOffset="currentPageOffset"
-				:totalRuns="maxRunIndex"
-				:hasDefaultHoverState="paneType === 'input'"
-				@mounted="$emit('tableMounted', $event)"
-				@activeRowChanged="onItemHover"
-				@displayModeChange="onDisplayModeChange"
-			/>
+			<Suspense v-else-if="hasNodeRun && displayMode === 'table'">
+				<run-data-table
+					:node="node"
+					:inputData="inputData"
+					:mappingEnabled="mappingEnabled"
+					:distanceFromActive="distanceFromActive"
+					:runIndex="runIndex"
+					:pageOffset="currentPageOffset"
+					:totalRuns="maxRunIndex"
+					:hasDefaultHoverState="paneType === 'input'"
+					@mounted="$emit('tableMounted', $event)"
+					@activeRowChanged="onItemHover"
+					@displayModeChange="onDisplayModeChange"
+				/>
+			</Suspense>

-			<run-data-json
-				v-else-if="hasNodeRun && displayMode === 'json'"
-				:paneType="paneType"
-				:editMode="editMode"
-				:sessioId="sessionId"
-				:node="node"
-				:inputData="inputData"
-				:mappingEnabled="mappingEnabled"
-				:distanceFromActive="distanceFromActive"
-				:runIndex="runIndex"
-				:totalRuns="maxRunIndex"
-			/>
+			<Suspense v-else-if="hasNodeRun && displayMode === 'json'">
+				<run-data-json
+					:paneType="paneType"
+					:editMode="editMode"
+					:sessioId="sessionId"
+					:node="node"
+					:inputData="inputData"
+					:mappingEnabled="mappingEnabled"
+					:distanceFromActive="distanceFromActive"
+					:runIndex="runIndex"
+					:totalRuns="maxRunIndex"
+				/>
+			</Suspense>

-			<run-data-html
-				v-else-if="hasNodeRun && isPaneTypeOutput && displayMode === 'html'"
-				:inputData="inputData"
-			/>
+			<Suspense v-else-if="hasNodeRun && isPaneTypeOutput && displayMode === 'html'">
+				<run-data-html :inputData="inputData" />
+			</Suspense>

-			<run-data-schema
-				v-else-if="hasNodeRun && isSchemaView"
-				:data="jsonData"
-				:mappingEnabled="mappingEnabled"
-				:distanceFromActive="distanceFromActive"
-				:node="node"
-				:paneType="paneType"
-				:runIndex="runIndex"
-				:totalRuns="maxRunIndex"
-			/>
+			<Suspense v-else-if="hasNodeRun && isSchemaView">
+				<run-data-schema
+					:data="jsonData"
+					:mappingEnabled="mappingEnabled"
+					:distanceFromActive="distanceFromActive"
+					:node="node"
+					:paneType="paneType"
+					:runIndex="runIndex"
+					:totalRuns="maxRunIndex"
+				/>
+			</Suspense>

 			<div v-else-if="displayMode === 'binary' && binaryData.length === 0" :class="$style.center">
 				<n8n-text align="center" tag="div">{{
@ -636,7 +638,7 @@ export default defineComponent({

 		if (this.paneType === 'output') this.setDisplayMode();
 	},
-	destroyed() {
+	beforeUnmount() {
 		this.hidePinDataDiscoveryTooltip();
 		dataPinningEventBus.off('data-pinning-error', this.onDataPinningError);
 		dataPinningEventBus.off('data-unpinning', this.onDataUnpinning);
--- a/packages/editor-ui/src/components/RunDataJson.vue
+++ b/packages/editor-ui/src/components/RunDataJson.vue
@ -1,15 +1,17 @@
 <template>
 	<div :class="$style.jsonDisplay">
-		<run-data-json-actions
-			v-if="!editMode.enabled"
-			:node="node"
-			:sessioId="sessionId"
-			:displayMode="displayMode"
-			:distanceFromActive="distanceFromActive"
-			:selectedJsonPath="selectedJsonPath"
-			:jsonData="jsonData"
-			:paneType="paneType"
-		/>
+		<Suspense>
+			<run-data-json-actions
+				v-if="!editMode.enabled"
+				:node="node"
+				:sessioId="sessionId"
+				:displayMode="displayMode"
+				:distanceFromActive="distanceFromActive"
+				:selectedJsonPath="selectedJsonPath"
+				:jsonData="jsonData"
+				:paneType="paneType"
+			/>
+		</Suspense>
 		<draggable
 			type="mapping"
 			targetDataKey="mappable"
--- a/packages/editor-ui/src/components/SettingsLogStreaming/EventDestinationCard.ee.vue
+++ b/packages/editor-ui/src/components/SettingsLogStreaming/EventDestinationCard.ee.vue
@ -96,7 +96,7 @@ export default defineComponent({
 		);
 		this.eventBus?.on('destinationWasSaved', this.onDestinationWasSaved);
 	},
-	destroyed() {
+	beforeUnmount() {
 		this.eventBus?.off('destinationWasSaved', this.onDestinationWasSaved);
 	},
 	computed: {
--- a/packages/editor-ui/src/components/TagsDropdown.vue
+++ b/packages/editor-ui/src/components/TagsDropdown.vue
@ -133,7 +133,7 @@ export default defineComponent({

 		void this.tagsStore.fetchAll();
 	},
-	destroyed() {
+	beforeUnmount() {
 		this.eventBus?.off('focus', this.onBusFocus);
 	},
 	computed: {
--- a/packages/editor-ui/src/components/TemplateList.vue
+++ b/packages/editor-ui/src/components/TemplateList.vue
@ -66,7 +66,7 @@ export default defineComponent({
 			}
 		}
 	},
-	destroyed() {
+	beforeUnmount() {
 		const content = document.getElementById('content');
 		if (content) {
 			content.removeEventListener('scroll', this.onScroll);
--- a/packages/editor-ui/src/components/WorkflowPreview.vue
+++ b/packages/editor-ui/src/components/WorkflowPreview.vue
@ -194,7 +194,7 @@ export default defineComponent({
 		window.addEventListener('message', this.receiveMessage);
 		document.addEventListener('scroll', this.onDocumentScroll);
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		window.removeEventListener('message', this.receiveMessage);
 		document.removeEventListener('scroll', this.onDocumentScroll);
 	},
--- a/packages/editor-ui/src/mixins/copyPaste.ts
+++ b/packages/editor-ui/src/mixins/copyPaste.ts
@ -226,7 +226,7 @@ export const copyPaste = defineComponent({
 			}
 		},
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		if (this.hiddenInput) {
 			this.hiddenInput.remove();
 		}
--- a/packages/editor-ui/src/views/NodeView.vue
+++ b/packages/editor-ui/src/views/NodeView.vue
@ -630,7 +630,7 @@ export default defineComponent({
 			NODE_CREATOR_OPEN_SOURCES,
 		};
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		this.resetWorkspace();
 		// Make sure the event listeners get removed again else we
 		// could add up with them registered multiple times
@ -3960,7 +3960,7 @@ export default defineComponent({
 		dataPinningEventBus.off('unpin-data', this.removePinDataConnections);
 		nodeViewEventBus.off('saveWorkflow', this.saveCurrentWorkflowExternal);
 	},
-	destroyed() {
+	beforeUnmount() {
 		this.resetWorkspace();
 		this.instance.unbind();
 		this.instance.destroy();
--- a/packages/editor-ui/src/views/SettingsCommunityNodesView.vue
+++ b/packages/editor-ui/src/views/SettingsCommunityNodesView.vue
@ -134,7 +134,7 @@ export default defineComponent({
 			this.$data.loading = false;
 		}
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		this.pushDisconnect();
 	},
 	computed: {
--- a/packages/editor-ui/src/views/SettingsLogStreamingView.vue
+++ b/packages/editor-ui/src/views/SettingsLogStreamingView.vue
@ -132,7 +132,7 @@ export default defineComponent({
 		// listen to modal closing and remove nodes from store
 		this.eventBus.on('closing', this.onBusClosing);
 	},
-	destroyed() {
+	beforeUnmount() {
 		this.eventBus.off('destinationWasSaved', this.onDestinationWasSaved);
 		this.eventBus.off('remove', this.onRemove);
 		this.eventBus.off('closing', this.onBusClosing);