dendi-wang/thingsboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI: Fixed debug settings panel; Improved model data entity debug settings

Browse Source
This commit is contained in:
Vladyslav_Prykhodko 2025-04-07 11:47:57 +03:00
parent 10cf607a95
commit 76ed955f42
11 changed files with 38 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
ui-ngx/src/app/core/auth/auth.models.ts
View File

@ -31,6 +31,7 @@ export interface SysParamsState {
maxDataPointsPerRollingArg: number;
maxArgumentsPerCF: number;
ruleChainDebugPerTenantLimitsConfiguration?: string;
calculatedFieldDebugPerTenantLimitsConfiguration?: string;
}
export interface SysParams extends SysParamsState {

14
ui-ngx/src/app/modules/home/components/calculated-fields/calculated-fields-table-config.ts
View File

@ -27,10 +27,9 @@ import { PageLink } from '@shared/models/page/page-link';
import { Observable, of } from 'rxjs';
import { PageData } from '@shared/models/page/page-data';
import { EntityId } from '@shared/models/id/entity-id';
import { MINUTE } from '@shared/models/time/time.models';
import { Store } from '@ngrx/store';
import { AppState } from '@core/core.state';
import { getCurrentAuthState, getCurrentAuthUser } from '@core/auth/auth.selectors';
import { getCurrentAuthUser } from '@core/auth/auth.selectors';
import { DestroyRef, Renderer2 } from '@angular/core';
import { EntityDebugSettings } from '@shared/models/entity.models';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
@ -47,7 +46,8 @@ import {
getCalculatedFieldArgumentsHighlights,
} from '@shared/models/calculated-field.models';
import {
CalculatedFieldDebugDialogComponent, CalculatedFieldDebugDialogData,
CalculatedFieldDebugDialogComponent,
CalculatedFieldDebugDialogData,
CalculatedFieldDialogComponent,
CalculatedFieldDialogData,
CalculatedFieldScriptTestDialogComponent,
@ -60,9 +60,6 @@ import { DatePipe } from '@angular/common';
export class CalculatedFieldsTableConfig extends EntityTableConfig<CalculatedField> {
readonly calculatedFieldsDebugPerTenantLimitsConfiguration =
getCurrentAuthState(this.store)['calculatedFieldsDebugPerTenantLimitsConfiguration'];
readonly maxDebugModeDuration = getCurrentAuthState(this.store).maxDebugModeDurationMinutes * MINUTE;
readonly tenantId = getCurrentAuthUser(this.store).tenantId;
additionalDebugActionConfig = {
title: this.translate.instant('calculated-fields.see-debug-events'),
@ -189,9 +186,7 @@ export class CalculatedFieldsTableConfig extends EntityTableConfig<CalculatedFie
this.entityDebugSettingsService.openDebugStrategyPanel({
debugSettings,
debugConfig: {
debugLimitsConfiguration: this.calculatedFieldsDebugPerTenantLimitsConfiguration,
maxDebugModeDuration: this.maxDebugModeDuration,
entityLabel: this.translate.instant('debug-settings.calculated-field'),
entityType: EntityType.CALCULATED_FIELD,
additionalActionConfig,
},
onSettingsAppliedFn: settings => this.onDebugConfigChanged(id.id, settings)
@ -215,7 +210,6 @@ export class CalculatedFieldsTableConfig extends EntityTableConfig<CalculatedFie
value,
buttonTitle,
entityId: this.entityId,
debugLimitsConfiguration: this.calculatedFieldsDebugPerTenantLimitsConfiguration,
tenantId: this.tenantId,
entityName: this.entityName,
additionalDebugActionConfig: this.additionalDebugActionConfig,

3
ui-ngx/src/app/modules/home/components/calculated-fields/components/dialog/calculated-field-dialog.component.html
View File

@ -49,8 +49,7 @@
<tb-entity-debug-settings-button
formControlName="debugSettings"
[class.mb-5]="fieldFormGroup.get('name').errors && fieldFormGroup.get('name').touched"
[entityLabel]="'debug-settings.calculated-field' | translate"
[debugLimitsConfiguration]="data.debugLimitsConfiguration"
[entityType]="EntityType.CALCULATED_FIELD"
[additionalActionConfig]="additionalDebugActionConfig"
/>
</div>

1
ui-ngx/src/app/modules/home/components/calculated-fields/components/dialog/calculated-field-dialog.component.ts
View File

@ -48,7 +48,6 @@ export interface CalculatedFieldDialogData {
value?: CalculatedField;
buttonTitle: string;
entityId: EntityId;
debugLimitsConfiguration: string;
tenantId: string;
entityName?: string;
additionalDebugActionConfig: AdditionalDebugActionConfig<(calculatedField: CalculatedField) => void>;

7
ui-ngx/src/app/modules/home/components/entity/debug/entity-debug-settings-button.component.ts
View File

@ -36,6 +36,7 @@ import { Store } from '@ngrx/store';
import { ControlValueAccessor, FormBuilder, NG_VALUE_ACCESSOR } from '@angular/forms';
import { EntityDebugSettingsService } from '@home/components/entity/debug/entity-debug-settings.service';
import { AdditionalDebugActionConfig } from '@home/components/entity/debug/entity-debug-settings.model';
import { EntityType } from '@shared/models/entity-type.models';
@Component({
selector: 'tb-entity-debug-settings-button',
@ -58,9 +59,8 @@ import { AdditionalDebugActionConfig } from '@home/components/entity/debug/entit
})
export class EntityDebugSettingsButtonComponent implements ControlValueAccessor {
@Input() debugLimitsConfiguration: string;
@Input() entityLabel: string;
@Input() additionalActionConfig: AdditionalDebugActionConfig;
@Input({required: true}) entityType: EntityType;
debugSettingsFormGroup = this.fb.group({
failuresEnabled: [false],
@ -123,8 +123,7 @@ export class EntityDebugSettingsButtonComponent implements ControlValueAccessor
debugSettings: this.debugSettingsFormGroup.value,
debugConfig: {
maxDebugModeDuration: this.maxDebugModeDuration,
debugLimitsConfiguration: this.debugLimitsConfiguration,
entityLabel: this.entityLabel,
entityType: this.entityType,
additionalActionConfig: this.additionalActionConfig,
},
onSettingsAppliedFn: settings => {

4
ui-ngx/src/app/modules/home/components/entity/debug/entity-debug-settings-panel.component.html
View File

@ -17,10 +17,10 @@
-->
<div class="flex w-96 flex-col gap-3 p-2">
<div class="tb-form-panel-title" translate>debug-settings.label</div>
@if (debugLimitsConfiguration) {
@if (maxMessagesCount) {
<div class="hint-container">
<div class="tb-form-hint tb-primary-fill tb-flex center">
{{ 'debug-settings.hint.main-limited' | translate: { entity: entityLabel ?? ('debug-settings.entity' | translate), msg: maxMessagesCount, time: (maxTimeFrameDuration | milliSecondsToTimeString: true : true) } }}
{{ 'debug-settings.hint.main-limited' | translate: { entity: (entityLabel | translate | lowercase), msg: maxMessagesCount, time: (maxTimeFrameDuration | milliSecondsToTimeString: true : true) } }}
</div>
</div>
}

25
ui-ngx/src/app/modules/home/components/entity/debug/entity-debug-settings-panel.component.ts
View File

@ -28,13 +28,15 @@ import { TbPopoverComponent } from '@shared/components/popover.component';
import { FormBuilder } from '@angular/forms';
import { CommonModule } from '@angular/common';
import { SharedModule } from '@shared/shared.module';
import { SECOND } from '@shared/models/time/time.models';
import { MINUTE, SECOND } from '@shared/models/time/time.models';
import { DurationLeftPipe } from '@shared/pipe/duration-left.pipe';
import { of, shareReplay, timer } from 'rxjs';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { EntityDebugSettings } from '@shared/models/entity.models';
import { distinctUntilChanged, map, startWith, switchMap, takeWhile } from 'rxjs/operators';
import { AdditionalDebugActionConfig } from '@home/components/entity/debug/entity-debug-settings.model';
import { EntityType, entityTypeTranslations } from '@shared/models/entity-type.models';
import { getCurrentAuthState } from '@core/auth/auth.selectors';
@Component({
selector: 'tb-entity-debug-settings-panel',
@ -51,10 +53,9 @@ export class EntityDebugSettingsPanelComponent extends PageComponent implements
@Input({ transform: booleanAttribute }) failuresEnabled = false;
@Input({ transform: booleanAttribute }) allEnabled = false;
@Input() entityLabel: string;
@Input() entityType: EntityType;
@Input() allEnabledUntil = 0;
@Input() maxDebugModeDuration: number;
@Input() debugLimitsConfiguration: string;
@Input() maxDebugModeDuration = getCurrentAuthState(this.store).maxDebugModeDurationMinutes * MINUTE;
@Input() additionalActionConfig: AdditionalDebugActionConfig;
onFailuresControl = this.fb.control(false);
@ -63,6 +64,7 @@ export class EntityDebugSettingsPanelComponent extends PageComponent implements
maxMessagesCount: string;
maxTimeFrameDuration: number;
initialAllEnabled: boolean;
entityLabel: string;
isDebugAllActive$ = this.debugAllControl.valueChanges.pipe(
startWith(this.debugAllControl.value),
@ -101,11 +103,13 @@ export class EntityDebugSettingsPanelComponent extends PageComponent implements
}
ngOnInit(): void {
this.maxMessagesCount = this.debugLimitsConfiguration?.split(':')[0];
this.maxTimeFrameDuration = parseInt(this.debugLimitsConfiguration?.split(':')[1]) * SECOND;
const debugLimitsConfiguration = this.getByEntityTypeDebugLimit(this.entityType);
this.maxMessagesCount = debugLimitsConfiguration?.split(':')[0];
this.maxTimeFrameDuration = parseInt(debugLimitsConfiguration?.split(':')[1]) * SECOND;
this.onFailuresControl.patchValue(this.failuresEnabled);
this.debugAllControl.patchValue(this.allEnabled);
this.initialAllEnabled = this.allEnabled || this.allEnabledUntil > new Date().getTime();
this.entityLabel = entityTypeTranslations.has(this.entityType) ? entityTypeTranslations.get(this.entityType).type : 'debug-settings.entity';
}
onCancel(): void {
@ -135,4 +139,13 @@ export class EntityDebugSettingsPanelComponent extends PageComponent implements
this.allEnabledUntil = 0;
this.cd.markForCheck();
}
private getByEntityTypeDebugLimit(entityType: EntityType): string {
switch (entityType) {
case EntityType.RULE_NODE:
return getCurrentAuthState(this.store).ruleChainDebugPerTenantLimitsConfiguration;
case EntityType.CALCULATED_FIELD:
return getCurrentAuthState(this.store).calculatedFieldDebugPerTenantLimitsConfiguration;
}
}
}

6
ui-ngx/src/app/modules/home/components/entity/debug/entity-debug-settings.model.ts
View File

@ -15,6 +15,7 @@
///
import { EntityDebugSettings } from '@shared/models/entity.models';
import { EntityType } from '@shared/models/entity-type.models';
export interface AdditionalDebugActionConfig<Action = (...args: unknown[]) => void> {
action: Action;
@ -24,10 +25,9 @@ export interface AdditionalDebugActionConfig<Action = (...args: unknown[]) => vo
export interface EntityDebugSettingPanelConfig {
debugSettings: EntityDebugSettings;
debugConfig: {
maxDebugModeDuration: number;
debugLimitsConfiguration: string;
entityLabel?: string;
maxDebugModeDuration?: number;
additionalActionConfig?: AdditionalDebugActionConfig;
entityType: EntityType;
}
onSettingsAppliedFn: (settings: EntityDebugSettings) => void;
}

5
ui-ngx/src/app/modules/home/pages/rulechain/rule-node-details.component.html
View File

@ -22,7 +22,7 @@
</button>
</div>
<form [formGroup]="ruleNodeFormGroup" class="mat-padding">
<section class="title-row flex align-center">
<section class="title-row align-center flex">
<mat-form-field class="mat-block flex-1">
<mat-label translate>rulenode.name</mat-label>
<input matInput formControlName="name" required>
@ -38,8 +38,7 @@
<tb-entity-debug-settings-button
class="mr-2"
formControlName="debugSettings"
[entityLabel]="'debug-settings.rule-node' | translate"
[debugLimitsConfiguration]="ruleChainDebugPerTenantLimitsConfiguration"
[entityType]="entityType.RULE_NODE"
/>
<button mat-stroked-button
class="tb-rounded-btn flex-1"

13
ui-ngx/src/app/modules/home/pages/rulechain/rule-node-details.component.ts
View File

@ -26,10 +26,8 @@ import {
ViewChild
} from '@angular/core';
import { PageComponent } from '@shared/components/page.component';
import { Store } from '@ngrx/store';
import { AppState } from '@core/core.state';
import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
import { FcRuleNode, RuleNodeType } from '@shared/models/rule-node.models';
import { FcRuleNode } from '@shared/models/rule-node.models';
import { EntityType } from '@shared/models/entity-type.models';
import { Subject } from 'rxjs';
import { RuleNodeConfigComponent } from './rule-node-config.component';
@ -39,7 +37,6 @@ import { ComponentClusteringMode } from '@shared/models/component-descriptor.mod
import { coerceBoolean } from '@shared/decorators/coercion';
import { ServiceType } from '@shared/models/queue.models';
import { takeUntil } from 'rxjs/operators';
import { getCurrentAuthState } from '@core/auth/auth.selectors';
@Component({
selector: 'tb-rule-node',
@ -73,21 +70,17 @@ export class RuleNodeDetailsComponent extends PageComponent implements OnInit, O
@Output()
changeScript = new EventEmitter<void>();
ruleNodeType = RuleNodeType;
entityType = EntityType;
serviceType = ServiceType.TB_RULE_ENGINE;
ruleNodeFormGroup: UntypedFormGroup;
readonly ruleChainDebugPerTenantLimitsConfiguration = getCurrentAuthState(this.store).ruleChainDebugPerTenantLimitsConfiguration;
private destroy$ = new Subject<void>();
constructor(protected store: Store<AppState>,
private fb: UntypedFormBuilder,
constructor(private fb: UntypedFormBuilder,
private router: Router) {
super(store);
super();
this.ruleNodeFormGroup = this.fb.group({});
}

2
ui-ngx/src/assets/locale/locale.constant-en_US.json
View File

@ -996,8 +996,6 @@
"all-messages": "All messages ({{time}})",
"failures": "Failures",
"entity": "entity",
"rule-node": "rule node",
"calculated-field": "calculated field",
"hint": {
"main-limited": "No more than {{msg}} {{entity}} debug messages per {{time}} will be recorded.",
"on-failure": "Log error messages only.",