feat(editor): Add mechanism for showing hidden nodes if required modules are enabled (#18585)

packages/frontend/editor-ui/src/constants.ts

@@ -12,6 +12,7 @@ import type {
 } from '@/types';
 import type { ComputedRef, InjectionKey, Ref } from 'vue';
 import type { ExpressionLocalResolveContext } from './types/expressions';
+import { DATA_STORE_MODULE_NAME } from './features/dataStore/constants';
 
 export const MAX_WORKFLOW_SIZE = 1024 * 1024 * 16; // Workflow size limit in bytes
 export const MAX_EXPECTED_REQUEST_SIZE = 2048; // Expected maximum workflow request metadata (i.e. headers) size in bytes
@@ -223,6 +224,7 @@ export const SLACK_TRIGGER_NODE_TYPE = 'n8n-nodes-base.slackTrigger';
 export const TELEGRAM_TRIGGER_NODE_TYPE = 'n8n-nodes-base.telegramTrigger';
 export const FACEBOOK_LEAD_ADS_TRIGGER_NODE_TYPE = 'n8n-nodes-base.facebookLeadAdsTrigger';
 export const RESPOND_TO_WEBHOOK_NODE_TYPE = 'n8n-nodes-base.respondToWebhook';
+export const DATA_STORE_NODE_TYPE = 'n8n-nodes-base.dataStore';
 
 export const CREDENTIAL_ONLY_NODE_PREFIX = 'n8n-creds-base';
 export const CREDENTIAL_ONLY_HTTP_NODE_VERSION = 4.1;
@@ -251,6 +253,10 @@ export const NODES_USING_CODE_NODE_EDITOR = [
 	AI_TRANSFORM_NODE_TYPE,
 ];
 
+export const MODULE_ENABLED_NODES = [
+	{ nodeType: DATA_STORE_NODE_TYPE, module: DATA_STORE_MODULE_NAME },
+];
+
 export const NODE_POSITION_CONFLICT_ALLOWLIST = [STICKY_NODE_TYPE];
 
 export const PIN_DATA_NODE_TYPES_DENYLIST = [SPLIT_IN_BATCHES_NODE_TYPE, STICKY_NODE_TYPE];

packages/frontend/editor-ui/src/features/dataStore/constants.ts

@@ -23,3 +23,5 @@ export const COLUMN_NAME_REGEX = /^[a-zA-Z0-9][a-zA-Z0-9-]*$/;
 export const NO_TABLE_YET_MESSAGE = 'SQLITE_ERROR: no such table:';
 
 export const MIN_LOADING_TIME = 500; // ms
+
+export const DATA_STORE_MODULE_NAME = 'data-store';

packages/frontend/editor-ui/src/stores/nodeTypes.store.ts

@@ -6,7 +6,11 @@ import type {
 	ResourceMapperFieldsRequestDto,
 } from '@n8n/api-types';
 import * as nodeTypesApi from '@n8n/rest-api-client/api/nodeTypes';
-import { HTTP_REQUEST_NODE_TYPE, CREDENTIAL_ONLY_HTTP_NODE_VERSION } from '@/constants';
+import {
+	HTTP_REQUEST_NODE_TYPE,
+	CREDENTIAL_ONLY_HTTP_NODE_VERSION,
+	MODULE_ENABLED_NODES,
+} from '@/constants';
 import { STORES } from '@n8n/stores';
 import type { NodeTypesByTypeNameAndVersion } from '@/Interface';
 import { addHeaders, addNodeTranslation } from '@n8n/i18n';
@@ -85,6 +89,24 @@ export const useNodeTypesStore = defineStore(STORES.NODE_TYPES, () => {
 			.filter(Boolean);
 	});
 
+	// Nodes defined with `hidden: true` that are still shown if their modules are enabled
+	const moduleEnabledNodeTypes = computed<INodeTypeDescription[]>(() => {
+		return MODULE_ENABLED_NODES.flatMap((node) => {
+			const nodeVersions = nodeTypes.value[node.nodeType] ?? {};
+			const versionNumbers = Object.keys(nodeVersions).map(Number);
+			const latest = nodeVersions[Math.max(...versionNumbers)];
+
+			if (latest?.hidden && settingsStore.isModuleActive(node.module)) {
+				return {
+					...latest,
+					hidden: undefined,
+				};
+			}
+
+			return [];
+		});
+	});
+
 	const getNodeType = computed(() => {
 		return (nodeTypeName: string, version?: number): INodeTypeDescription | null => {
 			if (utils.isCredentialOnlyNodeType(nodeTypeName)) {
@@ -169,6 +191,7 @@ export const useNodeTypesStore = defineStore(STORES.NODE_TYPES, () => {
 	const visibleNodeTypes = computed(() => {
 		return allLatestNodeTypes.value
 			.concat(officialCommunityNodeTypes.value)
+			.concat(moduleEnabledNodeTypes.value)
 			.filter((nodeType) => !nodeType.hidden);
 	});