From a17228f1c58518084091179e5f6b2543f57b1294 Mon Sep 17 00:00:00 2001 From: "Ricardo M." Date: Fri, 26 Jul 2024 13:03:30 -0400 Subject: [PATCH] chore(Canvas): Use `enum` for NodeLabel setting relates: https://issues.redhat.com/browse/KTO-441 follow up: https://github.com/KaotoIO/kaoto/pull/1221 --- .../localstorage-settings-adapter.test.ts | 6 ++--- .../ui/src/models/settings/settings.model.ts | 9 ++++++-- .../visualization/base-visual-entity.ts | 5 +++-- .../flows/abstract-camel-visual-entity.ts | 3 ++- .../flows/camel-route-visual-entity.test.ts | 5 +++-- .../camel-component-schema.service.test.ts | 21 ++++++++++++++++++ .../support/camel-component-schema.service.ts | 22 ++++++++++++++----- .../visualization/visualization-node.test.ts | 5 +++-- .../visualization/visualization-node.ts | 3 ++- 9 files changed, 60 insertions(+), 19 deletions(-) diff --git a/packages/ui/src/models/settings/localstorage-settings-adapter.test.ts b/packages/ui/src/models/settings/localstorage-settings-adapter.test.ts index 7a040644a..9eea85f50 100644 --- a/packages/ui/src/models/settings/localstorage-settings-adapter.test.ts +++ b/packages/ui/src/models/settings/localstorage-settings-adapter.test.ts @@ -1,6 +1,6 @@ import { LocalStorageKeys } from '../local-storage-keys'; import { LocalStorageSettingsAdapter } from './localstorage-settings-adapter'; -import { SettingsModel } from './settings.model'; +import { NodeLabelType, SettingsModel } from './settings.model'; describe('LocalStorageSettingsAdapter', () => { it('should create an instance with the default settings', () => { @@ -11,7 +11,7 @@ describe('LocalStorageSettingsAdapter', () => { it('should save and retrieve settings', () => { const adapter = new LocalStorageSettingsAdapter(); - const newSettings: SettingsModel = { catalogUrl: 'http://example.com', nodeLabel: 'description' }; + const newSettings: SettingsModel = { catalogUrl: 'http://example.com', nodeLabel: NodeLabelType.Description }; adapter.saveSettings(newSettings); @@ -30,7 +30,7 @@ describe('LocalStorageSettingsAdapter', () => { const localStorageSetItemSpy = jest.spyOn(Storage.prototype, 'setItem'); const adapter = new LocalStorageSettingsAdapter(); - const newSettings: SettingsModel = { catalogUrl: 'http://example.com', nodeLabel: 'description' }; + const newSettings: SettingsModel = { catalogUrl: 'http://example.com', nodeLabel: NodeLabelType.Description }; adapter.saveSettings(newSettings); diff --git a/packages/ui/src/models/settings/settings.model.ts b/packages/ui/src/models/settings/settings.model.ts index 0db345357..43f97e031 100644 --- a/packages/ui/src/models/settings/settings.model.ts +++ b/packages/ui/src/models/settings/settings.model.ts @@ -1,6 +1,11 @@ +export const enum NodeLabelType { + Id = 'id', + Description = 'description', +} + export interface ISettingsModel { catalogUrl: string; - nodeLabel: string; + nodeLabel: NodeLabelType; } export interface AbstractSettingsAdapter { @@ -10,7 +15,7 @@ export interface AbstractSettingsAdapter { export class SettingsModel implements ISettingsModel { catalogUrl: string = ''; - nodeLabel: string = 'description'; + nodeLabel: NodeLabelType = NodeLabelType.Description; constructor(options: Partial = {}) { Object.assign(this, options); diff --git a/packages/ui/src/models/visualization/base-visual-entity.ts b/packages/ui/src/models/visualization/base-visual-entity.ts index b9a52ef0a..003d61a35 100644 --- a/packages/ui/src/models/visualization/base-visual-entity.ts +++ b/packages/ui/src/models/visualization/base-visual-entity.ts @@ -1,6 +1,7 @@ import { DefinedComponent } from '../camel-catalog-index'; import { BaseCamelEntity, EntityType } from '../camel/entities'; import { KaotoSchemaDefinition } from '../kaoto-schema'; +import { NodeLabelType } from '../settings/settings.model'; /** * BaseVisualCamelEntity @@ -18,7 +19,7 @@ export interface BaseVisualCamelEntity extends BaseCamelEntity { setId: (id: string) => void; /** Given a path, get the component label */ - getNodeLabel: (path?: string, labelType?: string) => string; + getNodeLabel: (path?: string, labelType?: NodeLabelType) => string; /** Given a path, get the component tooltip content */ getTooltipContent: (path?: string) => string; @@ -75,7 +76,7 @@ export interface IVisualizationNode implements Bas return this.id; } - getNodeLabel(path?: string, labelType?: string): string { + getNodeLabel(path?: string, labelType?: NodeLabelType): string { if (!path) return ''; const componentModel = getValue(this.route, path); diff --git a/packages/ui/src/models/visualization/flows/camel-route-visual-entity.test.ts b/packages/ui/src/models/visualization/flows/camel-route-visual-entity.test.ts index 5605cddae..28dd2a403 100644 --- a/packages/ui/src/models/visualization/flows/camel-route-visual-entity.test.ts +++ b/packages/ui/src/models/visualization/flows/camel-route-visual-entity.test.ts @@ -5,6 +5,7 @@ import { camelRouteJson } from '../../../stubs/camel-route'; import { ROOT_PATH } from '../../../utils'; import { EntityType } from '../../camel/entities/base-entity'; import { KaotoSchemaDefinition } from '../../kaoto-schema'; +import { NodeLabelType } from '../../settings/settings.model'; import { IVisualizationNode } from '../base-visual-entity'; import { CamelRouteVisualEntity, isCamelFrom, isCamelRoute } from './camel-route-visual-entity'; import { CamelComponentSchemaService } from './support/camel-component-schema.service'; @@ -89,9 +90,9 @@ describe('Camel Route', () => { const getNodeLabelSpy = jest.spyOn(CamelComponentSchemaService, 'getNodeLabel'); jest.spyOn(CamelComponentSchemaService, 'getCamelComponentLookup').mockReturnValueOnce(lookupValue); - const label = camelEntity.getNodeLabel('from', 'id'); + const label = camelEntity.getNodeLabel('from', NodeLabelType.Id); - expect(getNodeLabelSpy).toHaveBeenCalledWith(lookupValue, camelRouteJson.route.from, 'id'); + expect(getNodeLabelSpy).toHaveBeenCalledWith(lookupValue, camelRouteJson.route.from, NodeLabelType.Id); expect(label).toEqual('timer'); }); }); diff --git a/packages/ui/src/models/visualization/flows/support/camel-component-schema.service.test.ts b/packages/ui/src/models/visualization/flows/support/camel-component-schema.service.test.ts index 930aeda84..d1a1e2988 100644 --- a/packages/ui/src/models/visualization/flows/support/camel-component-schema.service.test.ts +++ b/packages/ui/src/models/visualization/flows/support/camel-component-schema.service.test.ts @@ -4,6 +4,7 @@ import { getFirstCatalogMap } from '../../../../stubs/test-load-catalog'; import { CamelUriHelper, ROOT_PATH } from '../../../../utils'; import { ICamelProcessorDefinition } from '../../../camel-processors-catalog'; import { CatalogKind } from '../../../catalog-kind'; +import { NodeLabelType } from '../../../settings/settings.model'; import { CamelCatalogService } from '../camel-catalog.service'; import { CamelComponentSchemaService } from './camel-component-schema.service'; @@ -340,6 +341,26 @@ describe('CamelComponentSchemaService', () => { expect(label).toEqual(result); }, ); + + it('should favor `id` when asked for the label', () => { + const label = CamelComponentSchemaService.getNodeLabel( + { processorName: 'to', componentName: 'log' }, + { id: 'to-1234', description: 'My Logger', uri: 'log' }, + NodeLabelType.Id, + ); + + expect(label).toEqual('to-1234'); + }); + + it('should favor `description` when asked for the label', () => { + const label = CamelComponentSchemaService.getNodeLabel( + { processorName: 'to', componentName: 'log' }, + { id: 'to-1234', description: 'My Logger', uri: 'log' }, + NodeLabelType.Description, + ); + + expect(label).toEqual('My Logger'); + }); }); describe('getTooltipContent', () => { diff --git a/packages/ui/src/models/visualization/flows/support/camel-component-schema.service.ts b/packages/ui/src/models/visualization/flows/support/camel-component-schema.service.ts index 04bedc20e..59dd24605 100644 --- a/packages/ui/src/models/visualization/flows/support/camel-component-schema.service.ts +++ b/packages/ui/src/models/visualization/flows/support/camel-component-schema.service.ts @@ -1,10 +1,11 @@ import { ProcessorDefinition } from '@kaoto/camel-catalog/types'; import cloneDeep from 'lodash/cloneDeep'; -import { CamelUriHelper, ParsedParameters, ROOT_PATH, isDefined } from '../../../../utils'; +import { CamelUriHelper, ParsedParameters, ROOT_PATH, getValue, isDefined } from '../../../../utils'; import { ICamelComponentDefinition } from '../../../camel-components-catalog'; import { CatalogKind } from '../../../catalog-kind'; import { IKameletDefinition } from '../../../kamelets-catalog'; import { KaotoSchemaDefinition } from '../../../kaoto-schema'; +import { NodeLabelType } from '../../../settings/settings.model'; import { VisualComponentSchema } from '../../base-visual-entity'; import { CamelCatalogService } from '../camel-catalog.service'; import { CamelProcessorStepsProperties, ICamelElementLookupResult } from './camel-component-types'; @@ -65,10 +66,20 @@ export class CamelComponentSchemaService { return this.getCamelElement(previousPathSegment as keyof ProcessorDefinition, definition); } - // eslint-disable-next-line @typescript-eslint/no-explicit-any - static getNodeLabel(camelElementLookup: ICamelElementLookupResult, definition?: any, labelType?: string): string { - if (typeof definition?.description === 'string' && labelType !== 'id' && definition.description !== '') { - return definition.description; + static getNodeLabel( + camelElementLookup: ICamelElementLookupResult, + // eslint-disable-next-line @typescript-eslint/no-explicit-any + definition?: any, + labelType?: NodeLabelType, + ): string { + const id: string | undefined = getValue(definition, 'id'); + if (labelType === NodeLabelType.Id && id) { + return id; + } + + const description: string | undefined = getValue(definition, 'description'); + if (description) { + return description; } if (camelElementLookup.componentName !== undefined) { @@ -76,7 +87,6 @@ export class CamelComponentSchemaService { } const uriString = CamelUriHelper.getUriString(definition); - const id = definition?.id; switch (camelElementLookup.processorName) { case 'route' as keyof ProcessorDefinition: case 'errorHandler' as keyof ProcessorDefinition: diff --git a/packages/ui/src/models/visualization/visualization-node.test.ts b/packages/ui/src/models/visualization/visualization-node.test.ts index 1aa74e5c6..12bdad6d0 100644 --- a/packages/ui/src/models/visualization/visualization-node.test.ts +++ b/packages/ui/src/models/visualization/visualization-node.test.ts @@ -1,4 +1,5 @@ import { camelRouteJson } from '../../stubs/camel-route'; +import { NodeLabelType } from '../settings'; import { BaseVisualCamelEntity, IVisualizationNode } from './base-visual-entity'; import { CamelRouteVisualEntity } from './flows'; import { createVisualizationNode } from './visualization-node'; @@ -41,9 +42,9 @@ describe('VisualizationNode', () => { } as unknown as BaseVisualCamelEntity; node = createVisualizationNode('test', { path: 'test-path', entity: visualEntity }); - const label = node.getNodeLabel('id'); + const label = node.getNodeLabel(NodeLabelType.Id); - expect(getNodeLabelSpy).toHaveBeenCalledWith(node.data.path, 'id'); + expect(getNodeLabelSpy).toHaveBeenCalledWith(node.data.path, NodeLabelType.Id); expect(label).toEqual('test-label'); }); diff --git a/packages/ui/src/models/visualization/visualization-node.ts b/packages/ui/src/models/visualization/visualization-node.ts index 5249da5ef..e7ad546fd 100644 --- a/packages/ui/src/models/visualization/visualization-node.ts +++ b/packages/ui/src/models/visualization/visualization-node.ts @@ -1,5 +1,6 @@ import { getCamelRandomId } from '../../camel-utils/camel-random-id'; import { DefinedComponent } from '../camel-catalog-index'; +import { NodeLabelType } from '../settings/settings.model'; import { AddStepMode, BaseVisualCamelEntity, @@ -44,7 +45,7 @@ class VisualizationNode