From 0de04791775d529187366278d2c86b455661711e Mon Sep 17 00:00:00 2001 From: Vladyslav_Prykhodko Date: Thu, 9 Jan 2025 13:04:40 +0200 Subject: [PATCH 1/5] UI: Add lazy-load rulechain page components --- .../src/app/core/http/rule-chain.service.ts | 10 +++- .../rule-node/rule-node-config.module.ts | 26 +++++---- .../home/pages/edge/edge-routing.module.ts | 3 + .../rulechain/rule-node-config.component.ts | 10 +--- .../pages/rulechain/rulechain-page.module.ts | 57 +++++++++++++++++++ .../rulechain/rulechain-routing.module.ts | 2 + .../home/pages/rulechain/rulechain.module.ts | 25 +------- 7 files changed, 89 insertions(+), 44 deletions(-) create mode 100644 ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.module.ts diff --git a/ui-ngx/src/app/core/http/rule-chain.service.ts b/ui-ngx/src/app/core/http/rule-chain.service.ts index e3353989cc..37a9f8c1af 100644 --- a/ui-ngx/src/app/core/http/rule-chain.service.ts +++ b/ui-ngx/src/app/core/http/rule-chain.service.ts @@ -53,6 +53,7 @@ export class RuleChainService { private ruleNodeComponentsMap: Map> = new Map>(); private ruleNodeConfigComponents: {[directive: string]: Type} = {}; + private systemRuleNodeConfigComponents: {[directive: string]: Type} = {}; constructor( private http: HttpClient, @@ -128,7 +129,10 @@ export class RuleChainService { } } - public getRuleNodeConfigComponent(directive: string): Type { + public getRuleNodeConfigComponent(directive: string, isSystemComponent = false): Type { + if (isSystemComponent) { + return this.systemRuleNodeConfigComponents[directive]; + } return this.ruleNodeConfigComponents[directive]; } @@ -180,6 +184,10 @@ export class RuleChainService { return this.http.post(url, inputParams, defaultHttpOptionsFromConfig(config)); } + public registemSystemRuleNodeConfigComponent(componentMap: Record>) { + this.systemRuleNodeConfigComponents = componentMap; + } + private loadRuleNodeComponents(ruleChainType: RuleChainType, config?: RequestConfig): Observable> { return this.componentDescriptorService.getComponentDescriptorsByTypes(ruleNodeTypeComponentTypes, ruleChainType, config).pipe( map((components) => { diff --git a/ui-ngx/src/app/modules/home/components/rule-node/rule-node-config.module.ts b/ui-ngx/src/app/modules/home/components/rule-node/rule-node-config.module.ts index 58efd925db..f960777220 100644 --- a/ui-ngx/src/app/modules/home/components/rule-node/rule-node-config.module.ts +++ b/ui-ngx/src/app/modules/home/components/rule-node/rule-node-config.module.ts @@ -43,6 +43,7 @@ import { FlowRuleNodeConfigModule } from '@home/components/rule-node/flow/flow-rule-node-config.module'; import { IRuleNodeConfigurationComponent } from '@shared/models/rule-node.models'; +import { RuleChainService } from '@core/http/rule-chain.service'; @NgModule({ declarations: [ @@ -62,14 +63,17 @@ import { IRuleNodeConfigurationComponent } from '@shared/models/rule-node.models EmptyConfigComponent ] }) -export class RuleNodeConfigModule {} - -export const ruleNodeConfigComponentsMap: Record> = { - ...actionRuleNodeConfigComponentsMap, - ...enrichmentRuleNodeConfigComponentsMap, - ...externalRuleNodeConfigComponentsMap, - ...filterRuleNodeConfigComponentsMap, - ...flowRuleNodeConfigComponentsMap, - ...transformationRuleNodeConfigComponentsMap, - 'tbNodeEmptyConfig': EmptyConfigComponent -}; +export class RuleNodeConfigModule { + constructor(private ruleChainService: RuleChainService) { + const ruleNodeConfigComponentsMap: Record> = { + ...actionRuleNodeConfigComponentsMap, + ...enrichmentRuleNodeConfigComponentsMap, + ...externalRuleNodeConfigComponentsMap, + ...filterRuleNodeConfigComponentsMap, + ...flowRuleNodeConfigComponentsMap, + ...transformationRuleNodeConfigComponentsMap, + 'tbNodeEmptyConfig': EmptyConfigComponent + }; + this.ruleChainService.registemSystemRuleNodeConfigComponent(ruleNodeConfigComponentsMap); + } +} diff --git a/ui-ngx/src/app/modules/home/pages/edge/edge-routing.module.ts b/ui-ngx/src/app/modules/home/pages/edge/edge-routing.module.ts index 1302bfa140..bef4cd4a51 100644 --- a/ui-ngx/src/app/modules/home/pages/edge/edge-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/edge/edge-routing.module.ts @@ -291,6 +291,7 @@ const routes: Routes = [ import: false, ruleChainType: RuleChainType.EDGE }, + loadChildren: () => import('../rulechain/rulechain-page.module').then(m => m.RuleChainPageModule), resolve: { ruleChain: RuleChainResolver, ruleChainMetaData: RuleChainMetaDataResolver, @@ -336,6 +337,7 @@ const routes: Routes = [ import: false, ruleChainType: RuleChainType.EDGE }, + loadChildren: () => import('../rulechain/rulechain-page.module').then(m => m.RuleChainPageModule), resolve: { ruleChain: RuleChainResolver, ruleChainMetaData: RuleChainMetaDataResolver, @@ -358,6 +360,7 @@ const routes: Routes = [ import: true, ruleChainType: RuleChainType.EDGE }, + loadChildren: () => import('../rulechain/rulechain-page.module').then(m => m.RuleChainPageModule), resolve: { ruleNodeComponents: RuleNodeComponentsResolver, tooltipster: TooltipsterResolver diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-config.component.ts b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-config.component.ts index 029c4b5547..f6ed94991c 100644 --- a/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-config.component.ts +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-config.component.ts @@ -21,7 +21,7 @@ import { forwardRef, Input, OnDestroy, - Output, Type, + Output, ViewChild, ViewContainerRef } from '@angular/core'; @@ -43,7 +43,6 @@ import { coerceBooleanProperty } from '@angular/cdk/coercion'; import { JsonObjectEditComponent } from '@shared/components/json-object-edit.component'; import { deepClone } from '@core/utils'; import { RuleChainType } from '@shared/models/rule-chain.models'; -import { ruleNodeConfigComponentsMap } from '@home/components/rule-node/rule-node-config.module'; @Component({ selector: 'tb-rule-node-config', @@ -213,12 +212,7 @@ export class RuleNodeConfigComponent implements ControlValueAccessor, OnDestroy this.changeScriptSubscription = null; } this.definedConfigContainer.clear(); - let component: Type; - if (!this.nodeDefinition.uiResources?.length) { - component = ruleNodeConfigComponentsMap[this.nodeDefinition.configDirective]; - } else { - component = this.ruleChainService.getRuleNodeConfigComponent(this.nodeDefinition.configDirective); - } + const component = this.ruleChainService.getRuleNodeConfigComponent(this.nodeDefinition.configDirective, !this.nodeDefinition.uiResources?.length); this.definedConfigComponentRef = this.definedConfigContainer.createComponent(component); this.definedConfigComponent = this.definedConfigComponentRef.instance; this.definedConfigComponent.ruleNodeId = this.ruleNodeId; diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.module.ts b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.module.ts new file mode 100644 index 0000000000..5e2596939e --- /dev/null +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.module.ts @@ -0,0 +1,57 @@ +/// +/// Copyright © 2016-2024 The Thingsboard Authors +/// +/// Licensed under the Apache License, Version 2.0 (the "License"); +/// you may not use this file except in compliance with the License. +/// You may obtain a copy of the License at +/// +/// http://www.apache.org/licenses/LICENSE-2.0 +/// +/// Unless required by applicable law or agreed to in writing, software +/// distributed under the License is distributed on an "AS IS" BASIS, +/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +/// See the License for the specific language governing permissions and +/// limitations under the License. +/// + +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { SharedModule } from '@shared/shared.module'; +import { HomeComponentsModule } from '@home/components/home-components.module'; +import { DurationLeftPipe } from '@shared/pipe/duration-left.pipe'; +import { + EntityDebugSettingsButtonComponent +} from '@home/components/entity/debug/entity-debug-settings-button.component'; +import { RuleNodeConfigModule } from '@home/components/rule-node/rule-node-config.module'; +import { + AddRuleNodeDialogComponent, + AddRuleNodeLinkDialogComponent, + CreateNestedRuleChainDialogComponent, + RuleChainPageComponent +} from '@home/pages/rulechain/rulechain-page.component'; +import { RuleNodeDetailsComponent } from '@home/pages/rulechain/rule-node-details.component'; +import { RuleNodeConfigComponent } from '@home/pages/rulechain/rule-node-config.component'; +import { LinkLabelsComponent } from '@home/pages/rulechain/link-labels.component'; +import { RuleNodeLinkComponent } from '@home/pages/rulechain/rule-node-link.component'; + +@NgModule({ + declarations: [ + RuleChainPageComponent, + RuleNodeDetailsComponent, + LinkLabelsComponent, + RuleNodeLinkComponent, + RuleNodeConfigComponent, + AddRuleNodeLinkDialogComponent, + AddRuleNodeDialogComponent, + CreateNestedRuleChainDialogComponent + ], + imports: [ + CommonModule, + SharedModule, + DurationLeftPipe, + EntityDebugSettingsButtonComponent, + RuleNodeConfigModule, + HomeComponentsModule, + ] +}) +export class RuleChainPageModule {} diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-routing.module.ts b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-routing.module.ts index 0162e43655..cff4d2df4e 100644 --- a/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-routing.module.ts @@ -148,6 +148,7 @@ const routes: Routes = [ import: false, ruleChainType: RuleChainType.CORE }, + loadChildren: () => import('./rulechain-page.module').then(m => m.RuleChainPageModule), resolve: { ruleChain: RuleChainResolver, ruleChainMetaData: RuleChainMetaDataResolver, @@ -170,6 +171,7 @@ const routes: Routes = [ import: true, ruleChainType: RuleChainType.CORE }, + loadChildren: () => import('./rulechain-page.module').then(m => m.RuleChainPageModule), resolve: { ruleNodeComponents: RuleNodeComponentsResolver, tooltipster: TooltipsterResolver diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rulechain.module.ts b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain.module.ts index 00fa560382..be9478574d 100644 --- a/ui-ngx/src/app/modules/home/pages/rulechain/rulechain.module.ts +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain.module.ts @@ -21,34 +21,14 @@ import { RuleChainComponent } from '@modules/home/pages/rulechain/rulechain.comp import { RuleChainRoutingModule } from '@modules/home/pages/rulechain/rulechain-routing.module'; import { HomeComponentsModule } from '@modules/home/components/home-components.module'; import { RuleChainTabsComponent } from '@home/pages/rulechain/rulechain-tabs.component'; -import { - AddRuleNodeDialogComponent, - AddRuleNodeLinkDialogComponent, CreateNestedRuleChainDialogComponent, - RuleChainPageComponent -} from './rulechain-page.component'; import { RuleNodeComponent } from '@home/pages/rulechain/rulenode.component'; import { FC_NODE_COMPONENT_CONFIG } from 'ngx-flowchart'; -import { RuleNodeDetailsComponent } from './rule-node-details.component'; -import { RuleNodeLinkComponent } from './rule-node-link.component'; -import { LinkLabelsComponent } from '@home/pages/rulechain/link-labels.component'; -import { RuleNodeConfigComponent } from './rule-node-config.component'; -import { DurationLeftPipe } from '@shared/pipe/duration-left.pipe'; -import { EntityDebugSettingsButtonComponent } from '@home/components/entity/debug/entity-debug-settings-button.component'; -import { RuleNodeConfigModule } from '@home/components/rule-node/rule-node-config.module'; @NgModule({ declarations: [ RuleChainComponent, RuleChainTabsComponent, - RuleChainPageComponent, RuleNodeComponent, - RuleNodeDetailsComponent, - RuleNodeConfigComponent, - LinkLabelsComponent, - RuleNodeLinkComponent, - AddRuleNodeLinkDialogComponent, - AddRuleNodeDialogComponent, - CreateNestedRuleChainDialogComponent ], providers: [ { @@ -56,16 +36,13 @@ import { RuleNodeConfigModule } from '@home/components/rule-node/rule-node-confi useValue: { nodeComponentType: RuleNodeComponent } - } + }, ], imports: [ CommonModule, SharedModule, HomeComponentsModule, RuleChainRoutingModule, - DurationLeftPipe, - EntityDebugSettingsButtonComponent, - RuleNodeConfigModule, ] }) export class RuleChainModule { } From 4cc01d58c057fc36abcff7da9c52e1cd6a439b06 Mon Sep 17 00:00:00 2001 From: Vladyslav_Prykhodko Date: Tue, 14 Jan 2025 12:43:47 +0200 Subject: [PATCH 2/5] UI: Remove rule node config map; Add new function extractComponentsFromModule --- .../src/app/core/http/rule-chain.service.ts | 4 +- .../app/core/services/resources.service.ts | 38 +++++++++++++++++- .../action/action-rule-node-config.module.ts | 26 ------------ .../enrichment-rule-node-core.module.ts | 13 ------ .../external-rule-node-config.module.ts | 16 -------- .../filter/filter-rule-node-config.module.ts | 11 ----- .../flow/flow-rule-node-config.module.ts | 5 --- .../rule-node/rule-node-config.module.ts | 40 ++++--------------- .../transformation-rule-node-config.module.ts | 11 ----- 9 files changed, 45 insertions(+), 119 deletions(-) diff --git a/ui-ngx/src/app/core/http/rule-chain.service.ts b/ui-ngx/src/app/core/http/rule-chain.service.ts index 37a9f8c1af..88bc4286dc 100644 --- a/ui-ngx/src/app/core/http/rule-chain.service.ts +++ b/ui-ngx/src/app/core/http/rule-chain.service.ts @@ -184,8 +184,8 @@ export class RuleChainService { return this.http.post(url, inputParams, defaultHttpOptionsFromConfig(config)); } - public registemSystemRuleNodeConfigComponent(componentMap: Record>) { - this.systemRuleNodeConfigComponents = componentMap; + public registerSystemRuleNodeConfigModule(module: any) { + this.systemRuleNodeConfigComponents = this.resourcesService.extractComponentsFromModule(module, true); } private loadRuleNodeComponents(ruleChainType: RuleChainType, config?: RequestConfig): Observable> { diff --git a/ui-ngx/src/app/core/services/resources.service.ts b/ui-ngx/src/app/core/services/resources.service.ts index f5cba07a47..38bb343aae 100644 --- a/ui-ngx/src/app/core/services/resources.service.ts +++ b/ui-ngx/src/app/core/services/resources.service.ts @@ -31,7 +31,7 @@ import { forkJoin, from, Observable, ReplaySubject, throwError } from 'rxjs'; import { HttpClient } from '@angular/common/http'; import { IModulesMap } from '@modules/common/modules-map.models'; import { TbResourceId } from '@shared/models/id/tb-resource-id'; -import { isObject } from '@core/utils'; +import { camelCase, isObject } from '@core/utils'; import { AuthService } from '@core/auth/auth.service'; import { select, Store } from '@ngrx/store'; import { selectIsAuthenticated } from '@core/auth/auth.selectors'; @@ -51,6 +51,8 @@ export interface ModulesWithComponents { standaloneComponents: ɵComponentDef[]; } +export type ComponentsSelectorMap = Record>; + export const flatModulesWithComponents = (modulesWithComponentsList: ModulesWithComponents[]): ModulesWithComponents => { const modulesWithComponents: ModulesWithComponents = { modules: [], @@ -91,6 +93,17 @@ export const componentTypeBySelector = (modulesWithComponents: ModulesWithCompon const matchesSelector = (selectors: ɵCssSelectorList, selector: string) => selectors.some(s => s.some(s1 => typeof s1 === 'string' && s1 === selector)); +const extractSelectorFromComponent = (comp: ɵComponentDef): string => { + for (const selectors of comp.selectors) { + for (const selector of selectors) { + if (typeof selector === 'string') { + return selector; + } + } + } + return null; +} + @Injectable({ providedIn: 'root' }) @@ -252,6 +265,27 @@ export class ResourcesService { ); } + public extractComponentsFromModule(module: any, isCamelCaseSelector = false): ComponentsSelectorMap { + const modulesWithComponents = this.extractModulesWithComponents(module); + const componentMap = {}; + + const processComponents = (components: Array<ɵComponentDef>) => { + components.forEach(item => { + let selector = extractSelectorFromComponent(item); + if (isCamelCaseSelector) { + selector = camelCase(selector); + } + componentMap[selector] = item.type; + }); + }; + + processComponents(modulesWithComponents.standaloneComponents); + + modulesWithComponents.modules.forEach(module => { + processComponents(module.components); + }) + return componentMap; + } private extractModulesWithComponents(module: any, modulesWithComponents: ModulesWithComponents = { @@ -284,7 +318,7 @@ export class ResourcesService { modulesWithComponents.standaloneComponents.push(component); } } else { - this.extractModulesWithComponents(module, modulesWithComponents, visitedModules); + this.extractModulesWithComponents(element, modulesWithComponents, visitedModules); } } } else if (ɵNG_COMP_DEF in module) { diff --git a/ui-ngx/src/app/modules/home/components/rule-node/action/action-rule-node-config.module.ts b/ui-ngx/src/app/modules/home/components/rule-node/action/action-rule-node-config.module.ts index 3e78ee4c46..17307cb341 100644 --- a/ui-ngx/src/app/modules/home/components/rule-node/action/action-rule-node-config.module.ts +++ b/ui-ngx/src/app/modules/home/components/rule-node/action/action-rule-node-config.module.ts @@ -103,29 +103,3 @@ import { SendRestApiCallReplyConfigComponent } from './send-rest-api-call-reply- }) export class ActionRuleNodeConfigModule { } - -export const actionRuleNodeConfigComponentsMap: Record> = { - 'tbActionNodeAssignToCustomerConfig': AssignCustomerConfigComponent, - 'tbActionNodeAttributesConfig': AttributesConfigComponent, - 'tbActionNodeClearAlarmConfig': ClearAlarmConfigComponent, - 'tbActionNodeCreateAlarmConfig': CreateAlarmConfigComponent, - 'tbActionNodeCreateRelationConfig': CreateRelationConfigComponent, - 'tbActionNodeDeleteAttributesConfig': DeleteAttributesConfigComponent, - 'tbActionNodeDeleteRelationConfig': DeleteRelationConfigComponent, - 'tbActionNodeDeviceProfileConfig': DeviceProfileConfigComponent, - 'tbActionNodeDeviceStateConfig': DeviceStateConfigComponent, - 'tbActionNodeGeneratorConfig': GeneratorConfigComponent, - 'tbActionNodeGpsGeofencingConfig': GpsGeoActionConfigComponent, - 'tbActionNodeLogConfig': LogConfigComponent, - 'tbActionNodeMathFunctionConfig': MathFunctionConfigComponent, - 'tbActionNodeMsgCountConfig': MsgCountConfigComponent, - 'tbActionNodeMsgDelayConfig': MsgDelayConfigComponent, - 'tbActionNodePushToCloudConfig': PushToCloudConfigComponent, - 'tbActionNodePushToEdgeConfig': PushToEdgeConfigComponent, - 'tbActionNodeRpcReplyConfig': RpcReplyConfigComponent, - 'tbActionNodeRpcRequestConfig': RpcRequestConfigComponent, - 'tbActionNodeCustomTableConfig': SaveToCustomTableConfigComponent, - 'tbActionNodeSendRestApiCallReplyConfig': SendRestApiCallReplyConfigComponent, - 'tbActionNodeTimeseriesConfig': TimeseriesConfigComponent, - 'tbActionNodeUnAssignToCustomerConfig': UnassignCustomerConfigComponent -}; diff --git a/ui-ngx/src/app/modules/home/components/rule-node/enrichment/enrichment-rule-node-core.module.ts b/ui-ngx/src/app/modules/home/components/rule-node/enrichment/enrichment-rule-node-core.module.ts index 987389feb8..7d614ecd96 100644 --- a/ui-ngx/src/app/modules/home/components/rule-node/enrichment/enrichment-rule-node-core.module.ts +++ b/ui-ngx/src/app/modules/home/components/rule-node/enrichment/enrichment-rule-node-core.module.ts @@ -62,16 +62,3 @@ import { FetchDeviceCredentialsConfigComponent } from './fetch-device-credential }) export class EnrichmentRuleNodeCoreModule { } - -export const enrichmentRuleNodeConfigComponentsMap: Record> = { - 'tbEnrichmentNodeCalculateDeltaConfig': CalculateDeltaConfigComponent, - 'tbEnrichmentNodeCustomerAttributesConfig': CustomerAttributesConfigComponent, - 'tbEnrichmentNodeDeviceAttributesConfig': DeviceAttributesConfigComponent, - 'tbEnrichmentNodeEntityDetailsConfig': EntityDetailsConfigComponent, - 'tbEnrichmentNodeFetchDeviceCredentialsConfig': FetchDeviceCredentialsConfigComponent, - 'tbEnrichmentNodeGetTelemetryFromDatabase': GetTelemetryFromDatabaseConfigComponent, - 'tbEnrichmentNodeOriginatorAttributesConfig': OriginatorAttributesConfigComponent, - 'tbEnrichmentNodeOriginatorFieldsConfig': OriginatorFieldsConfigComponent, - 'tbEnrichmentNodeRelatedAttributesConfig': RelatedAttributesConfigComponent, - 'tbEnrichmentNodeTenantAttributesConfig': TenantAttributesConfigComponent -} diff --git a/ui-ngx/src/app/modules/home/components/rule-node/external/external-rule-node-config.module.ts b/ui-ngx/src/app/modules/home/components/rule-node/external/external-rule-node-config.module.ts index 38395b9dac..c3c8c2ca2c 100644 --- a/ui-ngx/src/app/modules/home/components/rule-node/external/external-rule-node-config.module.ts +++ b/ui-ngx/src/app/modules/home/components/rule-node/external/external-rule-node-config.module.ts @@ -73,19 +73,3 @@ import { LambdaConfigComponent } from './lambda-config.component'; }) export class ExternalRuleNodeConfigModule { } - -export const externalRuleNodeConfigComponentsMap: Record> = { - 'tbExternalNodeAzureIotHubConfig': AzureIotHubConfigComponent, - 'tbExternalNodeKafkaConfig': KafkaConfigComponent, - 'tbExternalNodeLambdaConfig': LambdaConfigComponent, - 'tbExternalNodeMqttConfig': MqttConfigComponent, - 'tbExternalNodeNotificationConfig': NotificationConfigComponent, - 'tbExternalNodePubSubConfig': PubSubConfigComponent, - 'tbExternalNodeRabbitMqConfig': RabbitMqConfigComponent, - 'tbExternalNodeRestApiCallConfig': RestApiCallConfigComponent, - 'tbExternalNodeSendEmailConfig': SendEmailConfigComponent, - 'tbExternalNodeSendSmsConfig': SendSmsConfigComponent, - 'tbExternalNodeSlackConfig': SlackConfigComponent, - 'tbExternalNodeSnsConfig': SnsConfigComponent, - 'tbExternalNodeSqsConfig': SqsConfigComponent -} diff --git a/ui-ngx/src/app/modules/home/components/rule-node/filter/filter-rule-node-config.module.ts b/ui-ngx/src/app/modules/home/components/rule-node/filter/filter-rule-node-config.module.ts index ca0aaffd71..bb3636811b 100644 --- a/ui-ngx/src/app/modules/home/components/rule-node/filter/filter-rule-node-config.module.ts +++ b/ui-ngx/src/app/modules/home/components/rule-node/filter/filter-rule-node-config.module.ts @@ -56,14 +56,3 @@ import { CommonRuleNodeConfigModule } from '../common/common-rule-node-config.mo }) export class FilterRuleNodeConfigModule { } - -export const filterRuleNodeConfigComponentsMap: Record> = { - 'tbFilterNodeCheckAlarmStatusConfig': CheckAlarmStatusComponent, - 'tbFilterNodeCheckMessageConfig': CheckMessageConfigComponent, - 'tbFilterNodeCheckRelationConfig': CheckRelationConfigComponent, - 'tbFilterNodeGpsGeofencingConfig': GpsGeoFilterConfigComponent, - 'tbFilterNodeMessageTypeConfig': MessageTypeConfigComponent, - 'tbFilterNodeOriginatorTypeConfig': OriginatorTypeConfigComponent, - 'tbFilterNodeScriptConfig': ScriptConfigComponent, - 'tbFilterNodeSwitchConfig': SwitchConfigComponent -} diff --git a/ui-ngx/src/app/modules/home/components/rule-node/flow/flow-rule-node-config.module.ts b/ui-ngx/src/app/modules/home/components/rule-node/flow/flow-rule-node-config.module.ts index 2ee36f71fc..8a703ca9d2 100644 --- a/ui-ngx/src/app/modules/home/components/rule-node/flow/flow-rule-node-config.module.ts +++ b/ui-ngx/src/app/modules/home/components/rule-node/flow/flow-rule-node-config.module.ts @@ -36,8 +36,3 @@ import { RuleChainOutputComponent } from './rule-chain-output.component'; }) export class FlowRuleNodeConfigModule { } - -export const flowRuleNodeConfigComponentsMap: Record> = { - 'tbFlowNodeRuleChainInputConfig': RuleChainInputComponent, - 'tbFlowNodeRuleChainOutputConfig': RuleChainOutputComponent -} diff --git a/ui-ngx/src/app/modules/home/components/rule-node/rule-node-config.module.ts b/ui-ngx/src/app/modules/home/components/rule-node/rule-node-config.module.ts index f960777220..86512eceea 100644 --- a/ui-ngx/src/app/modules/home/components/rule-node/rule-node-config.module.ts +++ b/ui-ngx/src/app/modules/home/components/rule-node/rule-node-config.module.ts @@ -14,35 +14,18 @@ /// limitations under the License. /// -import { NgModule, Type } from '@angular/core'; +import { NgModule } from '@angular/core'; import { EmptyConfigComponent } from './empty-config.component'; import { CommonModule } from '@angular/common'; import { SharedModule } from '@shared/shared.module'; +import { ActionRuleNodeConfigModule } from '@home/components/rule-node/action/action-rule-node-config.module'; +import { FilterRuleNodeConfigModule } from '@home/components/rule-node/filter/filter-rule-node-config.module'; +import { EnrichmentRuleNodeCoreModule } from '@home/components/rule-node/enrichment/enrichment-rule-node-core.module'; +import { ExternalRuleNodeConfigModule } from '@home/components/rule-node/external/external-rule-node-config.module'; import { - actionRuleNodeConfigComponentsMap, - ActionRuleNodeConfigModule -} from '@home/components/rule-node/action/action-rule-node-config.module'; -import { - filterRuleNodeConfigComponentsMap, - FilterRuleNodeConfigModule -} from '@home/components/rule-node/filter/filter-rule-node-config.module'; -import { - enrichmentRuleNodeConfigComponentsMap, - EnrichmentRuleNodeCoreModule -} from '@home/components/rule-node/enrichment/enrichment-rule-node-core.module'; -import { - externalRuleNodeConfigComponentsMap, - ExternalRuleNodeConfigModule -} from '@home/components/rule-node/external/external-rule-node-config.module'; -import { - transformationRuleNodeConfigComponentsMap, TransformationRuleNodeConfigModule } from '@home/components/rule-node/transformation/transformation-rule-node-config.module'; -import { - flowRuleNodeConfigComponentsMap, - FlowRuleNodeConfigModule -} from '@home/components/rule-node/flow/flow-rule-node-config.module'; -import { IRuleNodeConfigurationComponent } from '@shared/models/rule-node.models'; +import { FlowRuleNodeConfigModule } from '@home/components/rule-node/flow/flow-rule-node-config.module'; import { RuleChainService } from '@core/http/rule-chain.service'; @NgModule({ @@ -65,15 +48,6 @@ import { RuleChainService } from '@core/http/rule-chain.service'; }) export class RuleNodeConfigModule { constructor(private ruleChainService: RuleChainService) { - const ruleNodeConfigComponentsMap: Record> = { - ...actionRuleNodeConfigComponentsMap, - ...enrichmentRuleNodeConfigComponentsMap, - ...externalRuleNodeConfigComponentsMap, - ...filterRuleNodeConfigComponentsMap, - ...flowRuleNodeConfigComponentsMap, - ...transformationRuleNodeConfigComponentsMap, - 'tbNodeEmptyConfig': EmptyConfigComponent - }; - this.ruleChainService.registemSystemRuleNodeConfigComponent(ruleNodeConfigComponentsMap); + this.ruleChainService.registerSystemRuleNodeConfigModule(this.constructor); } } diff --git a/ui-ngx/src/app/modules/home/components/rule-node/transformation/transformation-rule-node-config.module.ts b/ui-ngx/src/app/modules/home/components/rule-node/transformation/transformation-rule-node-config.module.ts index a25495d7b4..76ba7934d6 100644 --- a/ui-ngx/src/app/modules/home/components/rule-node/transformation/transformation-rule-node-config.module.ts +++ b/ui-ngx/src/app/modules/home/components/rule-node/transformation/transformation-rule-node-config.module.ts @@ -57,14 +57,3 @@ import { ScriptConfigComponent } from '@home/components/rule-node/filter/script- }) export class TransformationRuleNodeConfigModule { } - -export const transformationRuleNodeConfigComponentsMap: Record> = { - 'tbTransformationNodeChangeOriginatorConfig': ChangeOriginatorConfigComponent, - 'tbTransformationNodeCopyKeysConfig': CopyKeysConfigComponent, - 'tbTransformationNodeDeduplicationConfig': DeduplicationConfigComponent, - 'tbTransformationNodeDeleteKeysConfig': DeleteKeysConfigComponent, - 'tbTransformationNodeJsonPathConfig': NodeJsonPathConfigComponent, - 'tbTransformationNodeRenameKeysConfig': RenameKeysConfigComponent, - 'tbTransformationNodeScriptConfig': ScriptConfigComponent, - 'tbTransformationNodeToEmailConfig': ToEmailConfigComponent -} From e4a216bb87a13edc3dd0eef997d30e4c91822487 Mon Sep 17 00:00:00 2001 From: Vladyslav_Prykhodko Date: Mon, 20 Jan 2025 11:25:59 +0200 Subject: [PATCH 3/5] UI: Add generic type to extractComponentsFromModule --- ui-ngx/src/app/core/http/rule-chain.service.ts | 2 +- ui-ngx/src/app/core/services/resources.service.ts | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/ui-ngx/src/app/core/http/rule-chain.service.ts b/ui-ngx/src/app/core/http/rule-chain.service.ts index 88bc4286dc..c7b7c04842 100644 --- a/ui-ngx/src/app/core/http/rule-chain.service.ts +++ b/ui-ngx/src/app/core/http/rule-chain.service.ts @@ -185,7 +185,7 @@ export class RuleChainService { } public registerSystemRuleNodeConfigModule(module: any) { - this.systemRuleNodeConfigComponents = this.resourcesService.extractComponentsFromModule(module, true); + this.systemRuleNodeConfigComponents = this.resourcesService.extractComponentsFromModule(module, true); } private loadRuleNodeComponents(ruleChainType: RuleChainType, config?: RequestConfig): Observable> { diff --git a/ui-ngx/src/app/core/services/resources.service.ts b/ui-ngx/src/app/core/services/resources.service.ts index 38bb343aae..dcc6c3f8d0 100644 --- a/ui-ngx/src/app/core/services/resources.service.ts +++ b/ui-ngx/src/app/core/services/resources.service.ts @@ -51,7 +51,7 @@ export interface ModulesWithComponents { standaloneComponents: ɵComponentDef[]; } -export type ComponentsSelectorMap = Record>; +export type ComponentsSelectorMap = Record>; export const flatModulesWithComponents = (modulesWithComponentsList: ModulesWithComponents[]): ModulesWithComponents => { const modulesWithComponents: ModulesWithComponents = { @@ -265,7 +265,7 @@ export class ResourcesService { ); } - public extractComponentsFromModule(module: any, isCamelCaseSelector = false): ComponentsSelectorMap { + public extractComponentsFromModule(module: any, isCamelCaseSelector = false): ComponentsSelectorMap { const modulesWithComponents = this.extractModulesWithComponents(module); const componentMap = {}; From 76b5719e745f4425bc0ed8bb67822ab77bb43093 Mon Sep 17 00:00:00 2001 From: Vladyslav_Prykhodko Date: Mon, 20 Jan 2025 12:28:23 +0200 Subject: [PATCH 4/5] UI: Remove systemRuleNodeConfigComponents register --- ui-ngx/src/app/core/http/rule-chain.service.ts | 10 +++------- .../home/pages/rulechain/rule-node-config.component.ts | 2 +- 2 files changed, 4 insertions(+), 8 deletions(-) diff --git a/ui-ngx/src/app/core/http/rule-chain.service.ts b/ui-ngx/src/app/core/http/rule-chain.service.ts index c7b7c04842..749fb39e72 100644 --- a/ui-ngx/src/app/core/http/rule-chain.service.ts +++ b/ui-ngx/src/app/core/http/rule-chain.service.ts @@ -53,7 +53,6 @@ export class RuleChainService { private ruleNodeComponentsMap: Map> = new Map>(); private ruleNodeConfigComponents: {[directive: string]: Type} = {}; - private systemRuleNodeConfigComponents: {[directive: string]: Type} = {}; constructor( private http: HttpClient, @@ -129,10 +128,7 @@ export class RuleChainService { } } - public getRuleNodeConfigComponent(directive: string, isSystemComponent = false): Type { - if (isSystemComponent) { - return this.systemRuleNodeConfigComponents[directive]; - } + public getRuleNodeConfigComponent(directive: string): Type { return this.ruleNodeConfigComponents[directive]; } @@ -185,7 +181,7 @@ export class RuleChainService { } public registerSystemRuleNodeConfigModule(module: any) { - this.systemRuleNodeConfigComponents = this.resourcesService.extractComponentsFromModule(module, true); + Object.assign(this.ruleNodeConfigComponents, this.resourcesService.extractComponentsFromModule(module, true)); } private loadRuleNodeComponents(ruleChainType: RuleChainType, config?: RequestConfig): Observable> { @@ -219,7 +215,7 @@ export class RuleChainService { Observable { const nodeDefinition = component.configurationDescriptor.nodeDefinition; const uiResources = nodeDefinition.uiResources; - if (uiResources && uiResources.length) { + if (!this.ruleNodeConfigComponents[nodeDefinition.configDirective] && uiResources && uiResources.length) { const commonResources = uiResources.filter((resource) => !resource.endsWith('.js')); const moduleResource = uiResources.find((resource) => resource.endsWith('.js')); const tasks: Observable[] = []; diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-config.component.ts b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-config.component.ts index f6ed94991c..0a5057342f 100644 --- a/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-config.component.ts +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-config.component.ts @@ -212,7 +212,7 @@ export class RuleNodeConfigComponent implements ControlValueAccessor, OnDestroy this.changeScriptSubscription = null; } this.definedConfigContainer.clear(); - const component = this.ruleChainService.getRuleNodeConfigComponent(this.nodeDefinition.configDirective, !this.nodeDefinition.uiResources?.length); + const component = this.ruleChainService.getRuleNodeConfigComponent(this.nodeDefinition.configDirective); this.definedConfigComponentRef = this.definedConfigContainer.createComponent(component); this.definedConfigComponent = this.definedConfigComponentRef.instance; this.definedConfigComponent.ruleNodeId = this.ruleNodeId; From c3270e31f817de1281ab1192940595fc81af5af8 Mon Sep 17 00:00:00 2001 From: Vladyslav_Prykhodko Date: Mon, 20 Jan 2025 12:34:31 +0200 Subject: [PATCH 5/5] UI: Add generic type to extractComponentsFromModule --- ui-ngx/src/app/core/services/resources.service.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/ui-ngx/src/app/core/services/resources.service.ts b/ui-ngx/src/app/core/services/resources.service.ts index dcc6c3f8d0..72cea30a1a 100644 --- a/ui-ngx/src/app/core/services/resources.service.ts +++ b/ui-ngx/src/app/core/services/resources.service.ts @@ -267,9 +267,9 @@ export class ResourcesService { public extractComponentsFromModule(module: any, isCamelCaseSelector = false): ComponentsSelectorMap { const modulesWithComponents = this.extractModulesWithComponents(module); - const componentMap = {}; + const componentMap: ComponentsSelectorMap = {}; - const processComponents = (components: Array<ɵComponentDef>) => { + const processComponents = (components: Array<ɵComponentDef>) => { components.forEach(item => { let selector = extractSelectorFromComponent(item); if (isCamelCaseSelector) {