feat(editor): Add Beta tag to Data Tables (no-changelog) (#19458)

packages/frontend/@n8n/design-system/src/components/N8nTabs/Tabs.vue

@@ -4,6 +4,7 @@ import { RouterLink } from 'vue-router';
 
 import type { TabOptions } from '../../types';
 import N8nIcon from '../N8nIcon';
+import Tag from '../N8nTag/Tag.vue';
 import N8nTooltip from '../N8nTooltip';
 
 interface TabsProps {
@@ -123,6 +124,7 @@ const scrollRight = () => scroll(50);
 					>
 						<N8nIcon v-if="option.icon" :icon="option.icon" size="medium" />
 						<span v-if="option.label">{{ option.label }}</span>
+						<Tag v-if="option.tag" :text="option.tag" :clickable="false" />
 					</RouterLink>
 					<div
 						v-else
@@ -151,6 +153,7 @@ const scrollRight = () => scroll(50);
 							:class="$style.icon"
 							size="small"
 						/>
+						<Tag v-if="option.tag" :text="option.tag" :clickable="false" />
 					</div>
 				</N8nTooltip>
 			</div>

packages/frontend/@n8n/design-system/src/types/tabs.ts

@@ -13,4 +13,5 @@ export interface TabOptions<Value extends string | number> {
 	align?: 'left' | 'right';
 	to?: RouteLocationRaw;
 	notification?: boolean;
+	tag?: string;
 }

packages/frontend/@n8n/i18n/src/locales/en.json

@@ -68,6 +68,7 @@
 	"generic.clickToCopy": "Click to copy",
 	"generic.copiedToClipboard": "Copied to clipboard",
 	"generic.beta": "beta",
+	"generic.betaProper": "beta",
 	"generic.yes": "Yes",
 	"generic.no": "No",
 	"generic.rating": "Rating",
@@ -1401,6 +1402,7 @@
 	"nodeCreator.nodeItem.triggerIconTitle": "Trigger Node",
 	"nodeCreator.nodeItem.aiIconTitle": "LangChain AI Node",
 	"nodeCreator.nodeItem.deprecated": "Deprecated",
+	"nodeCreator.nodeItem.beta": "Beta",
 	"nodeCreator.preBuiltAgents.title": "Pre-built agents",
 	"nodeCreator.preBuiltAgents.description": "Get started faster with ready to go agents",
 	"nodeCredentials.createNew": "Create new credential",

packages/frontend/editor-ui/src/components/Node/NodeCreator/ItemTypes/NodeItem.vue

@@ -131,6 +131,9 @@ const tag = computed(() => {
 	if (description.value.toLowerCase().includes('deprecated')) {
 		return { text: i18n.baseText('nodeCreator.nodeItem.deprecated'), type: 'info' };
 	}
+	if (props.nodeType.name.includes('dataTable')) {
+		return { text: i18n.baseText('nodeCreator.nodeItem.beta'), type: 'info' };
+	}
 	return undefined;
 });
 

packages/frontend/editor-ui/src/features/dataStore/module.descriptor.ts

@@ -70,6 +70,7 @@ export const DataStoreModule: FrontendModuleDescription = {
 			{
 				label: i18n.baseText('dataStore.dataStores'),
 				value: DATA_STORE_VIEW,
+				tag: i18n.baseText('generic.betaProper'),
 				to: {
 					name: DATA_STORE_VIEW,
 				},
@@ -79,6 +80,7 @@ export const DataStoreModule: FrontendModuleDescription = {
 			{
 				label: i18n.baseText('dataStore.dataStores'),
 				value: PROJECT_DATA_STORES,
+				tag: i18n.baseText('generic.betaProper'),
 				dynamicRoute: {
 					name: PROJECT_DATA_STORES,
 					includeProjectId: true,