fix: fix slow loading times for nodeTypes, node creator vuex reference, and pushConnection in settings views (#4230)

packages/editor-ui/src/components/NodeCreator/NodeCreator.vue

@@ -41,14 +41,9 @@ export default Vue.extend({
 	props: [
 		'active',
 	],
-	data() {
-		return {
-			allLatestNodeTypes: [] as INodeTypeDescription[],
-		};
-	},
 	computed: {
 		...mapGetters('users', ['personalizedNodeTypes']),
-		nodeTypes(): INodeTypeDescription[] {
+		allLatestNodeTypes(): INodeTypeDescription[] {
 			return this.$store.getters['nodeTypes/allLatestNodeTypes'];
 		},
 		visibleNodeTypes(): INodeTypeDescription[] {
@@ -107,13 +102,6 @@ export default Vue.extend({
 			}
 		},
 	},
-	watch: {
-		nodeTypes(newList) {
-			if (newList.length !== this.allLatestNodeTypes.length) {
-				this.allLatestNodeTypes = newList;
-			}
-		},
-	},
 });
 </script>
 

packages/editor-ui/src/components/SettingsSidebar.vue

@@ -56,11 +56,13 @@ import mixins from 'vue-typed-mixins';
 import { mapGetters } from 'vuex';
 import { ABOUT_MODAL_KEY, VERSIONS_MODAL_KEY, VIEWS } from '@/constants';
 import { userHelpers } from './mixins/userHelpers';
+import { pushConnection } from "@/components/mixins/pushConnection";
 import { IFakeDoor } from '@/Interface';
 import GiftNotificationIcon from './GiftNotificationIcon.vue';
 
 export default mixins(
 	userHelpers,
+	pushConnection,
 ).extend({
 	name: 'SettingsSidebar',
 	components: {
@@ -95,6 +97,9 @@ export default mixins(
 			this.$store.dispatch('ui/openModal', VERSIONS_MODAL_KEY);
 		},
 	},
+	mounted() {
+		this.pushConnect();
+	},
 });
 </script>
 

packages/editor-ui/src/components/mixins/pushConnection.ts

@@ -362,6 +362,7 @@ export const pushConnection = mixins(
 
 					this.processWaitingPushMessages();
 				} else if (receivedData.type === 'reloadNodeType') {
+					this.$store.dispatch('nodeTypes/getNodeTypes');
 					this.$store.dispatch('nodeTypes/getFullNodesProperties', [receivedData.data]);
 				} else if (receivedData.type === 'removeNodeType') {
 					const pushData = receivedData.data;

packages/editor-ui/src/modules/nodeTypes.ts

@@ -57,7 +57,7 @@ const module: Module<INodeTypesState, IRootState> = {
 		},
 	},
 	mutations: {
-		setNodeTypes(state, newNodeTypes: INodeTypeDescription[]) {
+		setNodeTypes(state, newNodeTypes: INodeTypeDescription[] = []) {
 			const nodeTypes = newNodeTypes.reduce<Record<string, Record<string, INodeTypeDescription>>>((acc, newNodeType) => {
 				const newNodeVersions = getNodeVersions(newNodeType);
 

packages/editor-ui/src/views/CredentialsView.vue

@@ -393,11 +393,16 @@ export default mixins(
 			});
 		},
 		async initialize() {
-			await Promise.all([
+			const loadPromises = [
 				this.$store.dispatch('credentials/fetchAllCredentials'),
 				this.$store.dispatch('credentials/fetchCredentialTypes'),
-				this.$store.dispatch('nodeTypes/getNodeTypes'),
+			];
-			]);
+
+			if (this.$store.getters['nodeTypes/allNodeTypes'].length === 0) {
+				loadPromises.push(this.$store.dispatch('nodeTypes/getNodeTypes'));
+			}
+
+			await Promise.all(loadPromises);
 
 			this.loading = false;
 			this.$nextTick(this.focusSearchInput);

packages/editor-ui/src/views/NodeView.vue

@@ -3044,9 +3044,12 @@ export default mixins(
 				this.loadActiveWorkflows(),
 				this.loadCredentials(),
 				this.loadCredentialTypes(),
-				this.loadNodeTypes(),
 			];
 
+			if (this.$store.getters['nodeTypes/allNodeTypes'].length === 0) {
+				loadPromises.push(this.loadNodeTypes());
+			}
+
 			try {
 				await Promise.all(loadPromises);
 			} catch (error) {