diff --git a/packages/frontend/editor-ui/src/components/AssignmentCollection/constants.ts b/packages/frontend/editor-ui/src/components/AssignmentCollection/constants.ts
index 8c18216151f..ba767232e4c 100644
--- a/packages/frontend/editor-ui/src/components/AssignmentCollection/constants.ts
+++ b/packages/frontend/editor-ui/src/components/AssignmentCollection/constants.ts
@@ -1,9 +1,10 @@
+import { DATA_TYPE_ICON_MAP } from '@/constants';
import { type IconName } from '@n8n/design-system/components/N8nIcon/icons';
export const ASSIGNMENT_TYPES: Array<{ type: string; icon: IconName }> = [
- { type: 'string', icon: 'case-upper' },
- { type: 'number', icon: 'hash' },
- { type: 'boolean', icon: 'square-check' },
- { type: 'array', icon: 'list' },
- { type: 'object', icon: 'box' },
+ { type: 'string', icon: DATA_TYPE_ICON_MAP.string },
+ { type: 'number', icon: DATA_TYPE_ICON_MAP.number },
+ { type: 'boolean', icon: DATA_TYPE_ICON_MAP.boolean },
+ { type: 'array', icon: DATA_TYPE_ICON_MAP.array },
+ { type: 'object', icon: DATA_TYPE_ICON_MAP.object },
];
diff --git a/packages/frontend/editor-ui/src/components/FilterConditions/constants.ts b/packages/frontend/editor-ui/src/components/FilterConditions/constants.ts
index c31ce37de8e..6f123c05565 100644
--- a/packages/frontend/editor-ui/src/components/FilterConditions/constants.ts
+++ b/packages/frontend/editor-ui/src/components/FilterConditions/constants.ts
@@ -1,6 +1,7 @@
/* eslint-disable @typescript-eslint/naming-convention */
import type { FilterConditionValue, FilterOptionsValue } from 'n8n-workflow';
import type { FilterOperator, FilterOperatorGroup } from './types';
+import { DATA_TYPE_ICON_MAP } from '@/constants';
export const DEFAULT_MAX_CONDITIONS = 10;
@@ -285,37 +286,37 @@ export const OPERATOR_GROUPS: FilterOperatorGroup[] = [
{
id: 'string',
name: 'type.string',
- icon: 'case-upper',
+ icon: DATA_TYPE_ICON_MAP.string,
children: OPERATORS.filter((operator) => operator.type === 'string'),
},
{
id: 'number',
name: 'type.number',
- icon: 'hash',
+ icon: DATA_TYPE_ICON_MAP.number,
children: OPERATORS.filter((operator) => operator.type === 'number'),
},
{
id: 'dateTime',
name: 'type.dateTime',
- icon: 'calendar',
+ icon: DATA_TYPE_ICON_MAP.date,
children: OPERATORS.filter((operator) => operator.type === 'dateTime'),
},
{
id: 'boolean',
name: 'type.boolean',
- icon: 'square-check',
+ icon: DATA_TYPE_ICON_MAP.boolean,
children: OPERATORS.filter((operator) => operator.type === 'boolean'),
},
{
id: 'array',
name: 'type.array',
- icon: 'list',
+ icon: DATA_TYPE_ICON_MAP.array,
children: OPERATORS.filter((operator) => operator.type === 'array'),
},
{
id: 'object',
name: 'type.object',
- icon: 'box',
+ icon: DATA_TYPE_ICON_MAP.object,
children: OPERATORS.filter((operator) => operator.type === 'object'),
},
];
diff --git a/packages/frontend/editor-ui/src/components/__snapshots__/VirtualSchema.test.ts.snap b/packages/frontend/editor-ui/src/components/__snapshots__/VirtualSchema.test.ts.snap
index d26b78f7420..aa5a6d84b87 100644
--- a/packages/frontend/editor-ui/src/components/__snapshots__/VirtualSchema.test.ts.snap
+++ b/packages/frontend/editor-ui/src/components/__snapshots__/VirtualSchema.test.ts.snap
@@ -217,7 +217,7 @@ exports[`VirtualSchema.vue > renders preview schema when enabled and available 1
@@ -973,7 +973,7 @@ exports[`VirtualSchema.vue > renders schema in output pane 1`] = `
@@ -1161,7 +1161,7 @@ exports[`VirtualSchema.vue > renders schema in output pane 1`] = `
@@ -1222,7 +1222,7 @@ exports[`VirtualSchema.vue > renders schema in output pane 1`] = `
@@ -1655,7 +1655,7 @@ exports[`VirtualSchema.vue > renders schema with spaces and dots 1`] = `
@@ -1957,7 +1957,7 @@ exports[`VirtualSchema.vue > renders variables and context section 1`] = `
@@ -2018,7 +2018,7 @@ exports[`VirtualSchema.vue > renders variables and context section 1`] = `
@@ -2211,7 +2211,7 @@ exports[`VirtualSchema.vue > renders variables and context section 1`] = `
@@ -2272,7 +2272,7 @@ exports[`VirtualSchema.vue > renders variables and context section 1`] = `
@@ -2333,7 +2333,7 @@ exports[`VirtualSchema.vue > renders variables and context section 1`] = `
@@ -2460,7 +2460,7 @@ exports[`VirtualSchema.vue > renders variables and context section 1`] = `
@@ -2521,7 +2521,7 @@ exports[`VirtualSchema.vue > renders variables and context section 1`] = `
@@ -2748,7 +2748,7 @@ exports[`VirtualSchema.vue > should expand all nodes when searching 1`] = `
@@ -2881,7 +2881,7 @@ exports[`VirtualSchema.vue > should expand all nodes when searching 1`] = `
diff --git a/packages/frontend/editor-ui/src/composables/__snapshots__/useDataSchema.test.ts.snap b/packages/frontend/editor-ui/src/composables/__snapshots__/useDataSchema.test.ts.snap
index 80f7ac6aef8..848eb0ac6cb 100644
--- a/packages/frontend/editor-ui/src/composables/__snapshots__/useDataSchema.test.ts.snap
+++ b/packages/frontend/editor-ui/src/composables/__snapshots__/useDataSchema.test.ts.snap
@@ -58,7 +58,7 @@ exports[`useFlattenSchema > flattenMultipleSchemas > should flatten node schemas
"collapsable": false,
"depth": [MockFunction spy],
"expression": "{{ $('Test Node').item.json.obj.foo.nested }}",
- "icon": "case-upper",
+ "icon": "type",
"id": "Test Node-{{ $('Test Node').item.json.obj.foo.nested }}",
"level": 3,
"nodeName": "Test Node",
@@ -125,7 +125,7 @@ exports[`useFlattenSchema > flattenMultipleSchemas > should flatten node schemas
"collapsable": false,
"depth": [MockFunction spy],
"expression": "{{ $('Test Node').item.json.obj.foo.nested }}",
- "icon": "case-upper",
+ "icon": "type",
"id": "Test Node-{{ $('Test Node').item.json.obj.foo.nested }}",
"level": 3,
"nodeName": "Test Node",
diff --git a/packages/frontend/editor-ui/src/composables/useDataSchema.ts b/packages/frontend/editor-ui/src/composables/useDataSchema.ts
index 077c6133ace..afa6e99b8a8 100644
--- a/packages/frontend/editor-ui/src/composables/useDataSchema.ts
+++ b/packages/frontend/editor-ui/src/composables/useDataSchema.ts
@@ -16,6 +16,7 @@ import {
} from 'n8n-workflow';
import { ref } from 'vue';
import { type IconName } from '@n8n/design-system/components/N8nIcon/icons';
+import { DATA_TYPE_ICON_MAP } from '@/constants';
export function useDataSchema() {
function getSchema(
@@ -293,18 +294,18 @@ export type RenderEmpty = {
export type Renders = RenderHeader | RenderItem | RenderIcon | RenderNotice | RenderEmpty;
-const icons: { [key: string]: IconName } = {
- object: 'box',
- array: 'list',
- ['string']: 'case-upper',
+const icons = {
+ object: DATA_TYPE_ICON_MAP.object,
+ array: DATA_TYPE_ICON_MAP.array,
+ ['string']: DATA_TYPE_ICON_MAP.string,
null: 'case-upper',
- ['number']: 'hash',
- ['boolean']: 'square-check',
+ ['number']: DATA_TYPE_ICON_MAP.number,
+ ['boolean']: DATA_TYPE_ICON_MAP.boolean,
function: 'code',
bigint: 'calculator',
symbol: 'sun',
['undefined']: 'ban',
-} as const;
+} satisfies Record;
const getIconBySchemaType = (type: Schema['type']): IconName => icons[type];
diff --git a/packages/frontend/editor-ui/src/constants.ts b/packages/frontend/editor-ui/src/constants.ts
index cf2b8a01ed7..f1f92e8e757 100644
--- a/packages/frontend/editor-ui/src/constants.ts
+++ b/packages/frontend/editor-ui/src/constants.ts
@@ -14,6 +14,7 @@ import type { ComputedRef, InjectionKey, Ref } from 'vue';
import type { ExpressionLocalResolveContext } from './types/expressions';
import { DATA_STORE_MODULE_NAME } from './features/dataStore/constants';
import type { TelemetryContext } from './types/telemetry';
+import type { IconName } from '@n8n/design-system/src/components/N8nIcon/icons';
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
@@ -345,6 +346,16 @@ export const NODE_CONNECTION_TYPE_ALLOW_MULTIPLE: NodeConnectionType[] = [
NodeConnectionTypes.Main,
];
+// Data Types
+export const DATA_TYPE_ICON_MAP = {
+ ['string']: 'type',
+ ['number']: 'hash',
+ ['boolean']: 'square-check',
+ date: 'calendar',
+ array: 'list',
+ object: 'box',
+} satisfies Record;
+
/** PERSONALIZATION SURVEY */
export const EMAIL_KEY = 'email';
export const WORK_AREA_KEY = 'workArea';
diff --git a/packages/frontend/editor-ui/src/features/dataStore/composables/useDataStoreTypes.ts b/packages/frontend/editor-ui/src/features/dataStore/composables/useDataStoreTypes.ts
index 2d12e04dc47..8566d69d2e8 100644
--- a/packages/frontend/editor-ui/src/features/dataStore/composables/useDataStoreTypes.ts
+++ b/packages/frontend/editor-ui/src/features/dataStore/composables/useDataStoreTypes.ts
@@ -1,4 +1,3 @@
-import type { IconName } from '@n8n/design-system/components/N8nIcon/icons';
import type {
AGGridCellType,
DataStoreColumnType,
@@ -7,18 +6,10 @@ import type {
import { isAGGridCellType } from '@/features/dataStore/typeGuards';
import { ResponseError } from '@n8n/rest-api-client';
import { useI18n } from '@n8n/i18n';
-
-/* eslint-disable id-denylist */
-const COLUMN_TYPE_ICONS: Record = {
- string: 'type',
- number: 'hash',
- boolean: 'toggle-right',
- date: 'calendar',
-} as const;
-/* eslint-enable id-denylist */
+import { DATA_TYPE_ICON_MAP } from '@/constants';
export const useDataStoreTypes = () => {
- const getIconForType = (type: DataStoreColumnType) => COLUMN_TYPE_ICONS[type];
+ const getIconForType = (type: DataStoreColumnType) => DATA_TYPE_ICON_MAP[type];
const i18n = useI18n();
/**