Browse Source

Merge pull request #12147 from maxunbearable/feature/rule-node-debug-ui

Debug settings changed approach to object (ControlValueAccessor) and refactoring
pull/12138/head
Andrew Shvayka 2 years ago
committed by GitHub
parent
commit
c957761f3c
No known key found for this signature in database GPG Key ID: B5690EEEBB952194
  1. 46
      ui-ngx/src/app/modules/home/components/debug-config/debug-config-button.component.html
  2. 20
      ui-ngx/src/app/modules/home/components/debug-config/debug-config-button.component.scss
  3. 102
      ui-ngx/src/app/modules/home/components/debug-config/debug-config-button.component.ts
  4. 112
      ui-ngx/src/app/modules/home/components/debug-config/debug-config-panel.component.ts
  5. 32
      ui-ngx/src/app/modules/home/components/debug-settings/debug-settings-button.component.html
  6. 155
      ui-ngx/src/app/modules/home/components/debug-settings/debug-settings-button.component.ts
  7. 15
      ui-ngx/src/app/modules/home/components/debug-settings/debug-settings-panel.component.html
  8. 133
      ui-ngx/src/app/modules/home/components/debug-settings/debug-settings-panel.component.ts
  9. 3
      ui-ngx/src/app/modules/home/components/event/event-table-config.ts
  10. 35
      ui-ngx/src/app/modules/home/components/profile/tenant/default-tenant-profile-configuration.component.html
  11. 2
      ui-ngx/src/app/modules/home/components/profile/tenant/default-tenant-profile-configuration.component.ts
  12. 9
      ui-ngx/src/app/modules/home/pages/rulechain/rule-node-details.component.html
  13. 12
      ui-ngx/src/app/modules/home/pages/rulechain/rule-node-details.component.ts
  14. 18
      ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.component.ts
  15. 4
      ui-ngx/src/app/modules/home/pages/rulechain/rulechain.module.ts
  16. 20
      ui-ngx/src/app/shared/import-export/import-export.service.ts
  17. 14
      ui-ngx/src/app/shared/models/entity.models.ts
  18. 6
      ui-ngx/src/app/shared/models/rule-node.models.ts
  19. 2
      ui-ngx/src/assets/locale/locale.constant-en_US.json

46
ui-ngx/src/app/modules/home/components/debug-config/debug-config-button.component.html

@ -1,46 +0,0 @@
<!--
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.
-->
<button mat-stroked-button
*ngIf="!minifyMode else minifiedButton"
class="tb-rounded-btn flex-1 w-36"
color="primary"
#matButton
[class.active]="((isDebugAllActive$ | async) || debugFailures) && !disabled"
[disabled]="disabled"
(click)="openDebugStrategyPanel($event, matButton)">
<mat-icon [color]="disabled ? 'inherit' : 'primary'">bug_report</mat-icon>
<span *ngIf="!debugFailures && !(isDebugAllActive$ | async)" translate>common.disabled</span>
<span *ngIf="(isDebugAllActive$ | async) && debugFailures" translate>debug-config.all</span>
<span *ngIf="(isDebugAllActive$ | async) && !debugFailures">
{{ !debugAll ? (debugAllUntil | durationLeft) : ('debug-config.min' | translate: { number: maxDebugModeDurationMinutes }) }}
</span>
<span *ngIf="!(isDebugAllActive$ | async) && debugFailures" translate>debug-config.failures</span>
</button>
<ng-template #minifiedButton>
<button mat-icon-button
class="mini-debug-btn"
[disabled]="disabled"
#matButton
[matTooltip]="(isDebugAllActive$ | async) ? (debugAllUntil | durationLeft) : null"
matTooltipPosition="above"
(click)="openDebugStrategyPanel($event, matButton)">
<mat-icon class="material-icons" [color]="((isDebugAllActive$ | async) || debugFailures) && !disabled ? 'primary' : 'inherit'">
bug_report
</mat-icon>
</button>
</ng-template>

20
ui-ngx/src/app/modules/home/components/debug-config/debug-config-button.component.scss

@ -1,20 +0,0 @@
/**
* 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.
*/
:host {
.mini-debug-btn {
color: rgba(0, 0, 0, 0.6);
}
}

102
ui-ngx/src/app/modules/home/components/debug-config/debug-config-button.component.ts

@ -1,102 +0,0 @@
///
/// 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 {
Component,
Input,
Renderer2,
ViewContainerRef,
DestroyRef,
ChangeDetectionStrategy,
EventEmitter,
Output
} from '@angular/core';
import { CommonModule } from '@angular/common';
import { SharedModule } from '@shared/shared.module';
import { DurationLeftPipe } from '@shared/pipe/duration-left.pipe';
import { TbPopoverService } from '@shared/components/popover.service';
import { MatButton } from '@angular/material/button';
import { DebugConfigPanelComponent } from './debug-config-panel.component';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { shareReplay, timer } from 'rxjs';
import { SECOND } from '@shared/models/time/time.models';
import { HasDebugConfig } from '@shared/models/entity.models';
import { map } from 'rxjs/operators';
import { getCurrentAuthState } from '@core/auth/auth.selectors';
import { AppState } from '@core/core.state';
import { Store } from '@ngrx/store';
@Component({
selector: 'tb-debug-config-button',
templateUrl: './debug-config-button.component.html',
styleUrls: ['./debug-config-button.component.scss'],
standalone: true,
imports: [
CommonModule,
SharedModule,
DurationLeftPipe,
],
changeDetection: ChangeDetectionStrategy.OnPush
})
export class DebugConfigButtonComponent {
@Input() debugFailures = false;
@Input() debugAll = false;
@Input() debugAllUntil = 0;
@Input() disabled = false;
@Input() minifyMode = false;
@Input() debugLimitsConfiguration: string;
@Output() onDebugConfigChanged = new EventEmitter<HasDebugConfig>();
isDebugAllActive$ = timer(0, SECOND).pipe(map(() => this.debugAllUntil > new Date().getTime() || this.debugAll), shareReplay(1));
readonly maxDebugModeDurationMinutes = getCurrentAuthState(this.store).maxDebugModeDurationMinutes;
constructor(private popoverService: TbPopoverService,
private renderer: Renderer2,
private store: Store<AppState>,
private viewContainerRef: ViewContainerRef,
private destroyRef: DestroyRef,
) {}
openDebugStrategyPanel($event: Event, matButton: MatButton): void {
if ($event) {
$event.stopPropagation();
}
const trigger = matButton._elementRef.nativeElement;
if (this.popoverService.hasPopover(trigger)) {
this.popoverService.hidePopover(trigger);
} else {
const debugStrategyPopover = this.popoverService.displayPopover(trigger, this.renderer,
this.viewContainerRef, DebugConfigPanelComponent, 'bottom', true, null,
{
debugFailures: this.debugFailures,
debugAll: this.debugAll,
debugAllUntil: this.debugAllUntil,
maxDebugModeDurationMinutes: this.maxDebugModeDurationMinutes,
debugLimitsConfiguration: this.debugLimitsConfiguration
},
{},
{}, {}, true);
debugStrategyPopover.tbComponentRef.instance.popover = debugStrategyPopover;
debugStrategyPopover.tbComponentRef.instance.onConfigApplied.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((config: HasDebugConfig) => {
this.onDebugConfigChanged.emit(config);
debugStrategyPopover.hide();
});
}
}
}

112
ui-ngx/src/app/modules/home/components/debug-config/debug-config-panel.component.ts

@ -1,112 +0,0 @@
///
/// 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 {
ChangeDetectionStrategy,
ChangeDetectorRef,
Component,
EventEmitter,
Input,
OnInit
} from '@angular/core';
import { PageComponent } from '@shared/components/page.component';
import { TbPopoverComponent } from '@shared/components/popover.component';
import { UntypedFormBuilder } from '@angular/forms';
import { CommonModule } from '@angular/common';
import { SharedModule } from '@shared/shared.module';
import { MINUTE, SECOND } from '@shared/models/time/time.models';
import { DurationLeftPipe } from '@shared/pipe/duration-left.pipe';
import { shareReplay, timer } from 'rxjs';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { HasDebugConfig } from '@shared/models/entity.models';
import { distinctUntilChanged, map, tap } from 'rxjs/operators';
@Component({
selector: 'tb-debug-config-panel',
templateUrl: './debug-config-panel.component.html',
standalone: true,
imports: [
SharedModule,
CommonModule,
DurationLeftPipe
],
changeDetection: ChangeDetectionStrategy.OnPush
})
export class DebugConfigPanelComponent extends PageComponent implements OnInit {
@Input() popover: TbPopoverComponent<DebugConfigPanelComponent>;
@Input() debugFailures = false;
@Input() debugAll = false;
@Input() debugAllUntil = 0;
@Input() maxDebugModeDurationMinutes: number;
@Input() debugLimitsConfiguration: string;
onFailuresControl = this.fb.control(false);
debugAllControl = this.fb.control(false);
maxMessagesCount: string;
maxTimeFrameSec: string;
isDebugAllActive$ = timer(0, SECOND).pipe(
map(() => {
this.cd.markForCheck();
return this.debugAllUntil > new Date().getTime() || this.debugAll;
}),
distinctUntilChanged(),
tap(isDebugOn => this.debugAllControl.patchValue(isDebugOn, { emitEvent: false })),
shareReplay(1),
);
onConfigApplied = new EventEmitter<HasDebugConfig>();
constructor(private fb: UntypedFormBuilder, private cd: ChangeDetectorRef) {
super();
this.observeDebugAllChange();
}
ngOnInit(): void {
this.maxMessagesCount = this.debugLimitsConfiguration?.split(':')[0];
this.maxTimeFrameSec = this.debugLimitsConfiguration?.split(':')[1];
this.onFailuresControl.patchValue(this.debugFailures);
}
onCancel(): void {
this.popover?.hide();
}
onApply(): void {
this.onConfigApplied.emit({
debugAll: this.debugAll,
debugFailures: this.onFailuresControl.value,
debugAllUntil: this.debugAllUntil
});
}
onReset(): void {
this.debugAll = true;
this.debugAllUntil = new Date().getTime() + this.maxDebugModeDurationMinutes * MINUTE;
this.cd.markForCheck();
}
private observeDebugAllChange(): void {
this.debugAllControl.valueChanges.pipe(takeUntilDestroyed()).subscribe(value => {
this.debugAllUntil = value? new Date().getTime() + this.maxDebugModeDurationMinutes * MINUTE : 0;
this.debugAll = value;
this.cd.markForCheck();
});
}
}

32
ui-ngx/src/app/modules/home/components/debug-settings/debug-settings-button.component.html

@ -0,0 +1,32 @@
<!--
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.
-->
<button mat-stroked-button
class="tb-rounded-btn w-36 flex-1"
color="primary"
#matButton
[class.active]="((isDebugAllActive$ | async) || failuresEnabled) && !disabled"
[disabled]="disabled"
(click)="openDebugStrategyPanel($event, matButton)">
<mat-icon [color]="debugSettingsFormGroup.disabled ? 'inherit' : 'primary'">bug_report</mat-icon>
<span *ngIf="!failuresEnabled && !(isDebugAllActive$ | async)" translate>common.disabled</span>
<span *ngIf="(isDebugAllActive$ | async) && failuresEnabled" translate>debug-config.all</span>
<span *ngIf="(isDebugAllActive$ | async) && !failuresEnabled">
{{ !allEnabled ? (allEnabledUntil | durationLeft) : ('debug-config.min' | translate: { number: maxDebugModeDurationMinutes }) }}
</span>
<span *ngIf="!(isDebugAllActive$ | async) && failuresEnabled" translate>debug-config.failures</span>
</button>

155
ui-ngx/src/app/modules/home/components/debug-settings/debug-settings-button.component.ts

@ -0,0 +1,155 @@
///
/// 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 { ChangeDetectionStrategy, Component, forwardRef, Input, Renderer2, ViewContainerRef } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SharedModule } from '@shared/shared.module';
import { DurationLeftPipe } from '@shared/pipe/duration-left.pipe';
import { TbPopoverService } from '@shared/components/popover.service';
import { MatButton } from '@angular/material/button';
import { DebugSettingsPanelComponent } from './debug-settings-panel.component';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { of, shareReplay, timer } from 'rxjs';
import { SECOND } from '@shared/models/time/time.models';
import { DebugSettings } from '@shared/models/entity.models';
import { map, startWith, switchMap, takeWhile } from 'rxjs/operators';
import { getCurrentAuthState } from '@core/auth/auth.selectors';
import { AppState } from '@core/core.state';
import { Store } from '@ngrx/store';
import { ControlValueAccessor, FormBuilder, NG_VALUE_ACCESSOR } from '@angular/forms';
@Component({
selector: 'tb-debug-settings-button',
templateUrl: './debug-settings-button.component.html',
standalone: true,
imports: [
CommonModule,
SharedModule,
DurationLeftPipe,
],
providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => DebugSettingsButtonComponent),
multi: true
},
],
changeDetection: ChangeDetectionStrategy.OnPush
})
export class DebugSettingsButtonComponent implements ControlValueAccessor {
@Input() debugLimitsConfiguration: string;
debugSettingsFormGroup = this.fb.group({
failuresEnabled: [false],
allEnabled: [false],
allEnabledUntil: []
});
disabled = false;
isDebugAllActive$ = this.debugSettingsFormGroup.get('allEnabled').valueChanges.pipe(
startWith(this.debugSettingsFormGroup.get('allEnabled').value),
switchMap(value => {
if (value) {
return of(true);
} else {
return timer(0, SECOND).pipe(
map(() => this.allEnabledUntil > new Date().getTime()),
takeWhile(value => value, true)
);
}
}),
takeUntilDestroyed(),
shareReplay(1)
);
readonly maxDebugModeDurationMinutes = getCurrentAuthState(this.store).maxDebugModeDurationMinutes;
private propagateChange: (settings: DebugSettings) => void;
constructor(private popoverService: TbPopoverService,
private renderer: Renderer2,
private store: Store<AppState>,
private viewContainerRef: ViewContainerRef,
private fb: FormBuilder,
) {
this.debugSettingsFormGroup.valueChanges.pipe(
takeUntilDestroyed()
).subscribe(value => {
this.propagateChange(value);
})
}
get failuresEnabled(): boolean {
return this.debugSettingsFormGroup.get('failuresEnabled').value;
}
get allEnabled(): boolean {
return this.debugSettingsFormGroup.get('allEnabled').value;
}
get allEnabledUntil(): number {
return this.debugSettingsFormGroup.get('allEnabledUntil').value;
}
openDebugStrategyPanel($event: Event, matButton: MatButton): void {
if ($event) {
$event.stopPropagation();
}
const trigger = matButton._elementRef.nativeElement;
const debugSettings = this.debugSettingsFormGroup.value;
if (this.popoverService.hasPopover(trigger)) {
this.popoverService.hidePopover(trigger);
} else {
const debugStrategyPopover = this.popoverService.displayPopover(trigger, this.renderer,
this.viewContainerRef, DebugSettingsPanelComponent, 'bottom', true, null,
{
...debugSettings,
maxDebugModeDurationMinutes: this.maxDebugModeDurationMinutes,
debugLimitsConfiguration: this.debugLimitsConfiguration
},
{},
{}, {}, true);
debugStrategyPopover.tbComponentRef.instance.popover = debugStrategyPopover;
debugStrategyPopover.tbComponentRef.instance.onSettingsApplied.subscribe((settings: DebugSettings) => {
this.debugSettingsFormGroup.patchValue(settings);
debugStrategyPopover.hide();
});
}
}
registerOnChange(fn: (settings: DebugSettings) => void): void {
this.propagateChange = fn;
}
registerOnTouched(_: () => void): void {}
writeValue(settings: DebugSettings): void {
this.debugSettingsFormGroup.patchValue(settings, {emitEvent: false});
this.debugSettingsFormGroup.get('allEnabled').updateValueAndValidity({onlySelf: true});
}
setDisabledState(isDisabled: boolean): void {
this.disabled = isDisabled;
if (isDisabled) {
this.debugSettingsFormGroup.disable({emitEvent: false});
} else {
this.debugSettingsFormGroup.enable({emitEvent: false});
}
}
}

15
ui-ngx/src/app/modules/home/components/debug-config/debug-config-panel.component.html → ui-ngx/src/app/modules/home/components/debug-settings/debug-settings-panel.component.html

@ -15,14 +15,15 @@
limitations under the License. limitations under the License.
--> -->
<div class="flex flex-col gap-3 p-2 max-w-sm"> <div class="flex max-w-sm flex-col gap-3 p-2">
<div class="tb-form-panel-title" translate>debug-config.label</div> <div class="tb-form-panel-title" translate>debug-config.label</div>
<div class="hint-container"> <div class="hint-container">
<div class="tb-form-hint tb-primary-fill tb-flex center"> <div class="tb-form-hint tb-primary-fill tb-flex center">
<span *ngIf="debugLimitsConfiguration else noLimitHint"> @if (debugLimitsConfiguration) {
{{ 'debug-config.hint.main-limited' | translate: { msg: maxMessagesCount, sec: maxTimeFrameSec } }} {{ 'debug-config.hint.main-limited' | translate: { msg: maxMessagesCount, sec: maxTimeFrameSec } }}
</span> } @else {
<ng-template #noLimitHint>{{ 'debug-config.hint.main' | translate }}</ng-template> {{ 'debug-config.hint.main' | translate }}
}
</div> </div>
</div> </div>
<div class="flex flex-col gap-3"> <div class="flex flex-col gap-3">
@ -31,13 +32,13 @@
{{ 'debug-config.on-failure' | translate }} {{ 'debug-config.on-failure' | translate }}
</div> </div>
</mat-slide-toggle> </mat-slide-toggle>
<div class="flex justify-between align-center"> <div class="align-center flex justify-between">
<mat-slide-toggle class="mat-slide" [formControl]="debugAllControl"> <mat-slide-toggle class="mat-slide" [formControl]="debugAllControl">
<div tb-hint-tooltip-icon="{{ 'debug-config.hint.all-messages' | translate }}"> <div tb-hint-tooltip-icon="{{ 'debug-config.hint.all-messages' | translate }}">
{{ 'debug-config.all-messages' | translate: { time: (isDebugAllActive$ | async) && !debugAll ? (debugAllUntil | durationLeft) : ('debug-config.min' | translate: { number: maxDebugModeDurationMinutes }) } }} {{ 'debug-config.all-messages' | translate: { time: (isDebugAllActive$ | async) && !allEnabled ? (allEnabledUntil | durationLeft) : ('debug-config.min' | translate: { number: maxDebugModeDurationMinutes }) } }}
</div> </div>
</mat-slide-toggle> </mat-slide-toggle>
<button mat-icon-button *ngIf="(isDebugAllActive$ | async) && !debugAll" <button mat-icon-button *ngIf="(isDebugAllActive$ | async) && !allEnabled"
class="tb-mat-20" class="tb-mat-20"
matTooltip="{{ 'action.reset' | translate }}" matTooltip="{{ 'action.reset' | translate }}"
matTooltipPosition="above" matTooltipPosition="above"

133
ui-ngx/src/app/modules/home/components/debug-settings/debug-settings-panel.component.ts

@ -0,0 +1,133 @@
///
/// 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 {
booleanAttribute,
ChangeDetectionStrategy,
ChangeDetectorRef,
Component,
EventEmitter,
Input,
OnInit
} from '@angular/core';
import { PageComponent } from '@shared/components/page.component';
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 { DurationLeftPipe } from '@shared/pipe/duration-left.pipe';
import { of, shareReplay, timer } from 'rxjs';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { DebugSettings } from '@shared/models/entity.models';
import { distinctUntilChanged, map, startWith, switchMap, takeWhile } from 'rxjs/operators';
@Component({
selector: 'tb-debug-settings-panel',
templateUrl: './debug-settings-panel.component.html',
standalone: true,
imports: [
SharedModule,
CommonModule,
DurationLeftPipe
],
changeDetection: ChangeDetectionStrategy.OnPush
})
export class DebugSettingsPanelComponent extends PageComponent implements OnInit {
@Input() popover: TbPopoverComponent<DebugSettingsPanelComponent>;
@Input({ transform: booleanAttribute }) failuresEnabled = false;
@Input({ transform: booleanAttribute }) allEnabled = false;
@Input() allEnabledUntil = 0;
@Input() maxDebugModeDurationMinutes: number;
@Input() debugLimitsConfiguration: string;
onFailuresControl = this.fb.control(false);
debugAllControl = this.fb.control(false);
maxMessagesCount: string;
maxTimeFrameSec: string;
initialAllEnabled: boolean;
isDebugAllActive$ = this.debugAllControl.valueChanges.pipe(
startWith(this.debugAllControl.value),
switchMap(value => {
if (value) {
return of(true);
} else {
return timer(0, SECOND).pipe(
map(() => this.allEnabledUntil > new Date().getTime()),
takeWhile(value => value, true)
);
}
}),
takeUntilDestroyed(),
shareReplay(1),
);
onSettingsApplied = new EventEmitter<DebugSettings>();
constructor(private fb: FormBuilder,
private cd: ChangeDetectorRef) {
super();
this.debugAllControl.valueChanges.pipe(
takeUntilDestroyed()
).subscribe(value => {
this.allEnabled = value;
this.cd.markForCheck();
});
this.isDebugAllActive$.pipe(
distinctUntilChanged(),
takeUntilDestroyed()
).subscribe(isDebugOn => this.debugAllControl.patchValue(isDebugOn, {emitEvent: false}))
}
ngOnInit(): void {
this.maxMessagesCount = this.debugLimitsConfiguration?.split(':')[0];
this.maxTimeFrameSec = this.debugLimitsConfiguration?.split(':')[1];
this.onFailuresControl.patchValue(this.failuresEnabled);
this.debugAllControl.patchValue(this.allEnabled);
this.initialAllEnabled = this.allEnabled || this.allEnabledUntil > new Date().getTime();
}
onCancel(): void {
this.popover?.hide();
}
onApply(): void {
const isDebugAllChanged = this.initialAllEnabled !== this.debugAllControl.value || this.initialAllEnabled !== this.allEnabledUntil > new Date().getTime();
if (isDebugAllChanged) {
this.onSettingsApplied.emit({
allEnabled: this.allEnabled,
failuresEnabled: this.onFailuresControl.value,
allEnabledUntil: 0,
});
} else {
this.onSettingsApplied.emit({
allEnabled: false,
failuresEnabled: this.onFailuresControl.value,
});
}
}
onReset(): void {
this.debugAllControl.patchValue(true);
this.allEnabledUntil = 0;
this.cd.markForCheck();
}
}

3
ui-ngx/src/app/modules/home/components/event/event-table-config.ts

@ -99,7 +99,8 @@ export class EventTableConfig extends EntityTableConfig<Event, TimePageLink> {
this.loadDataOnInit = false; this.loadDataOnInit = false;
this.tableTitle = ''; this.tableTitle = '';
this.useTimePageLink = true; this.useTimePageLink = true;
this.defaultTimewindowInterval = this.maxDebugModeDurationMinutes ? historyInterval(this.maxDebugModeDurationMinutes * MINUTE) : historyInterval(DAY); const defaultInterval = this.maxDebugModeDurationMinutes ? Math.min(this.maxDebugModeDurationMinutes * MINUTE, DAY) : DAY;
this.defaultTimewindowInterval = historyInterval(defaultInterval);
this.detailsPanelEnabled = false; this.detailsPanelEnabled = false;
this.selectionEnabled = false; this.selectionEnabled = false;
this.searchEnabled = false; this.searchEnabled = false;

35
ui-ngx/src/app/modules/home/components/profile/tenant/default-tenant-profile-configuration.component.html

@ -76,22 +76,6 @@
<mat-hint></mat-hint> <mat-hint></mat-hint>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="fields-element flex flex-1 flex-row xs:flex-col gt-xs:gap-4">
<mat-form-field class="mat-block flex-1" appearance="fill" subscriptSizing="dynamic">
<mat-label translate>tenant-profile.maximum-debug-duration-min</mat-label>
<input matInput required min="0" step="1"
formControlName="maxDebugModeDurationMinutes"
type="number">
<mat-error *ngIf="defaultTenantProfileConfigurationFormGroup.get('maxDebugModeDurationMinutes').hasError('required')">
{{ 'tenant-profile.maximum-debug-duration-min-range' | translate }}
</mat-error>
<mat-error *ngIf="defaultTenantProfileConfigurationFormGroup.get('maxDebugModeDurationMinutes').hasError('min')">
{{ 'tenant-profile.maximum-debug-duration-min-required' | translate }}
</mat-error>
<mat-hint></mat-hint>
</mat-form-field>
<div class="flex-1"></div>
</div>
<mat-expansion-panel class="configuration-panel"> <mat-expansion-panel class="configuration-panel">
<mat-expansion-panel-header> <mat-expansion-panel-header>
<mat-panel-description class="flex items-stretch justify-end" translate> <mat-panel-description class="flex items-stretch justify-end" translate>
@ -370,6 +354,25 @@
</div> </div>
</fieldset> </fieldset>
<fieldset class="fields-group">
<legend class="group-title">
{{ 'tenant-profile.debug' | translate }}
</legend>
<div class="fields-element flex flex-1 flex-row xs:flex-col gt-xs:gap-4">
<mat-form-field class="mat-block flex-1" appearance="fill" subscriptSizing="dynamic">
<mat-label translate>tenant-profile.maximum-debug-duration-min</mat-label>
<input matInput min="0" step="1"
formControlName="maxDebugModeDurationMinutes"
type="number">
<mat-error *ngIf="defaultTenantProfileConfigurationFormGroup.get('maxDebugModeDurationMinutes').hasError('min')">
{{ 'tenant-profile.maximum-debug-duration-min-range' | translate }}
</mat-error>
<mat-hint></mat-hint>
</mat-form-field>
<div class="flex-1"></div>
</div>
</fieldset>
<fieldset class="fields-group"> <fieldset class="fields-group">
<legend class="group-title"> <legend class="group-title">
{{ 'tenant-profile.ota-files-in-bytes' | translate }} <span translate>tenant-profile.unlimited</span> {{ 'tenant-profile.ota-files-in-bytes' | translate }} <span translate>tenant-profile.unlimited</span>

2
ui-ngx/src/app/modules/home/components/profile/tenant/default-tenant-profile-configuration.component.ts

@ -85,7 +85,7 @@ export class DefaultTenantProfileConfigurationComponent implements ControlValueA
tenantNotificationRequestsRateLimit: [null, []], tenantNotificationRequestsRateLimit: [null, []],
tenantNotificationRequestsPerRuleRateLimit: [null, []], tenantNotificationRequestsPerRuleRateLimit: [null, []],
maxTransportMessages: [null, [Validators.required, Validators.min(0)]], maxTransportMessages: [null, [Validators.required, Validators.min(0)]],
maxDebugModeDurationMinutes: [null, [Validators.required, Validators.min(0)]], maxDebugModeDurationMinutes: [null, [Validators.min(0)]],
maxTransportDataPoints: [null, [Validators.required, Validators.min(0)]], maxTransportDataPoints: [null, [Validators.required, Validators.min(0)]],
maxREExecutions: [null, [Validators.required, Validators.min(0)]], maxREExecutions: [null, [Validators.required, Validators.min(0)]],
maxJSExecutions: [null, [Validators.required, Validators.min(0)]], maxJSExecutions: [null, [Validators.required, Validators.min(0)]],

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

@ -34,14 +34,11 @@
{{ 'rulenode.name-max-length' | translate }} {{ 'rulenode.name-max-length' | translate }}
</mat-error> </mat-error>
</mat-form-field> </mat-form-field>
<section class="flex flex-row max-w-xs mb-5"> <section class="mb-5 flex max-w-xs flex-row">
<tb-debug-config-button <tb-debug-settings-button
class="mr-2" class="mr-2"
[debugAll]="ruleNode.debugAll" formControlName="debugSettings"
[debugFailures]="ruleNode.debugFailures"
[debugAllUntil]="ruleNode.debugAllUntil"
[debugLimitsConfiguration]="ruleChainDebugPerTenantLimitsConfiguration" [debugLimitsConfiguration]="ruleChainDebugPerTenantLimitsConfiguration"
(onDebugConfigChanged)="onDebugConfigChanged($event)"
/> />
<button mat-stroked-button <button mat-stroked-button
class="tb-rounded-btn flex-1" class="tb-rounded-btn flex-1"

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

@ -40,7 +40,6 @@ import { coerceBoolean } from '@shared/decorators/coercion';
import { ServiceType } from '@shared/models/queue.models'; import { ServiceType } from '@shared/models/queue.models';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { getCurrentAuthState } from '@core/auth/auth.selectors'; import { getCurrentAuthState } from '@core/auth/auth.selectors';
import { HasDebugConfig } from '@shared/models/entity.models';
@Component({ @Component({
selector: 'tb-rule-node', selector: 'tb-rule-node',
@ -96,9 +95,7 @@ export class RuleNodeDetailsComponent extends PageComponent implements OnInit, O
if (this.ruleNode) { if (this.ruleNode) {
this.ruleNodeFormGroup = this.fb.group({ this.ruleNodeFormGroup = this.fb.group({
name: [this.ruleNode.name, [Validators.required, Validators.pattern('(.|\\s)*\\S(.|\\s)*'), Validators.maxLength(255)]], name: [this.ruleNode.name, [Validators.required, Validators.pattern('(.|\\s)*\\S(.|\\s)*'), Validators.maxLength(255)]],
debugAll: [this.ruleNode.debugAll], debugSettings: [this.ruleNode.debugSettings],
debugFailures: [this.ruleNode.debugFailures],
debugAllUntil: [this.ruleNode.debugAllUntil],
singletonMode: [this.ruleNode.singletonMode, []], singletonMode: [this.ruleNode.singletonMode, []],
configuration: [this.ruleNode.configuration, [Validators.required]], configuration: [this.ruleNode.configuration, [Validators.required]],
additionalInfo: this.fb.group( additionalInfo: this.fb.group(
@ -208,11 +205,4 @@ export class RuleNodeDetailsComponent extends PageComponent implements OnInit, O
isSingletonEditAllowed() { isSingletonEditAllowed() {
return this.ruleNode.component.clusteringMode === ComponentClusteringMode.USER_PREFERENCE; return this.ruleNode.component.clusteringMode === ComponentClusteringMode.USER_PREFERENCE;
} }
onDebugConfigChanged(config: HasDebugConfig): void {
this.ruleNodeFormGroup.get('debugAllUntil').setValue(config.debugAllUntil);
this.ruleNodeFormGroup.get('debugAll').setValue(config.debugAll);
this.ruleNodeFormGroup.get('debugFailures').setValue(config.debugFailures);
this.ruleNodeFormGroup.markAsDirty();
}
} }

18
ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.component.ts

@ -575,9 +575,7 @@ export class RuleChainPageComponent extends PageComponent
additionalInfo: ruleNode.additionalInfo, additionalInfo: ruleNode.additionalInfo,
configuration: ruleNode.configuration, configuration: ruleNode.configuration,
configurationVersion: isDefinedAndNotNull(ruleNode.configurationVersion) ? ruleNode.configurationVersion : 0, configurationVersion: isDefinedAndNotNull(ruleNode.configurationVersion) ? ruleNode.configurationVersion : 0,
debugAll: ruleNode.debugAll, debugSettings: ruleNode.debugSettings,
debugFailures: ruleNode.debugFailures,
debugAllUntil: ruleNode.debugAllUntil,
singletonMode: ruleNode.singletonMode, singletonMode: ruleNode.singletonMode,
queueName: ruleNode.queueName, queueName: ruleNode.queueName,
x: Math.round(ruleNode.additionalInfo.layoutX), x: Math.round(ruleNode.additionalInfo.layoutX),
@ -938,9 +936,7 @@ export class RuleChainPageComponent extends PageComponent
name: node.name, name: node.name,
configuration: deepClone(node.configuration), configuration: deepClone(node.configuration),
additionalInfo: node.additionalInfo ? deepClone(node.additionalInfo) : {}, additionalInfo: node.additionalInfo ? deepClone(node.additionalInfo) : {},
debugFailures: node.debugFailures, debugSettings: node.debugSettings,
debugAllUntil: node.debugAllUntil,
debugAll: node.debugAll,
singletonMode: node.singletonMode, singletonMode: node.singletonMode,
queueName: node.queueName queueName: node.queueName
}; };
@ -1013,9 +1009,6 @@ export class RuleChainPageComponent extends PageComponent
name: outputEdge.label, name: outputEdge.label,
configuration: {}, configuration: {},
additionalInfo: {}, additionalInfo: {},
debugFailures: false,
debugAllUntil: 0,
debugAll: false,
singletonMode: false singletonMode: false
}; };
outputNode.additionalInfo.layoutX = Math.round(destNode.x); outputNode.additionalInfo.layoutX = Math.round(destNode.x);
@ -1061,9 +1054,6 @@ export class RuleChainPageComponent extends PageComponent
configuration: { configuration: {
ruleChainId: ruleChain.id.id ruleChainId: ruleChain.id.id
}, },
debugFailures: false,
debugAllUntil: 0,
debugAll: false,
singletonMode: false, singletonMode: false,
x: Math.round(ruleChainNodeX), x: Math.round(ruleChainNodeX),
y: Math.round(ruleChainNodeY), y: Math.round(ruleChainNodeY),
@ -1483,9 +1473,7 @@ export class RuleChainPageComponent extends PageComponent
: node.component.configurationVersion, : node.component.configurationVersion,
configuration: node.configuration, configuration: node.configuration,
additionalInfo: node.additionalInfo ? node.additionalInfo : {}, additionalInfo: node.additionalInfo ? node.additionalInfo : {},
debugFailures: node.debugFailures, debugSettings: node.debugSettings,
debugAllUntil: node.debugAllUntil,
debugAll: node.debugAll,
singletonMode: node.singletonMode, singletonMode: node.singletonMode,
queueName: node.queueName queueName: node.queueName
}; };

4
ui-ngx/src/app/modules/home/pages/rulechain/rulechain.module.ts

@ -33,7 +33,7 @@ import { RuleNodeLinkComponent } from './rule-node-link.component';
import { LinkLabelsComponent } from '@home/pages/rulechain/link-labels.component'; import { LinkLabelsComponent } from '@home/pages/rulechain/link-labels.component';
import { RuleNodeConfigComponent } from './rule-node-config.component'; import { RuleNodeConfigComponent } from './rule-node-config.component';
import { DurationLeftPipe } from '@shared/pipe/duration-left.pipe'; import { DurationLeftPipe } from '@shared/pipe/duration-left.pipe';
import { DebugConfigButtonComponent } from '@home/components/debug-config/debug-config-button.component'; import { DebugSettingsButtonComponent } from '@home/components/debug-settings/debug-settings-button.component';
@NgModule({ @NgModule({
declarations: [ declarations: [
@ -63,7 +63,7 @@ import { DebugConfigButtonComponent } from '@home/components/debug-config/debug-
HomeComponentsModule, HomeComponentsModule,
RuleChainRoutingModule, RuleChainRoutingModule,
DurationLeftPipe, DurationLeftPipe,
DebugConfigButtonComponent DebugSettingsButtonComponent
] ]
}) })
export class RuleChainModule { } export class RuleChainModule { }

20
ui-ngx/src/app/shared/import-export/import-export.service.ts

@ -649,18 +649,20 @@ export class ImportExportService {
); );
} }
private processOldRuleChainConnections(ruleChainImport: RuleChainImport): Observable<RuleChainImport> { private processOldRuleChainConnections({ruleChain, metadata}: RuleChainImport): Observable<RuleChainImport> {
ruleChainImport.ruleChain = this.prepareImport(ruleChainImport.ruleChain); ruleChain = this.prepareImport(ruleChain);
const metadata = ruleChainImport.metadata; metadata = {
...metadata,
nodes: metadata.nodes.map(({ debugMode, ...node }: RuleNode & { debugMode: boolean }) => {
return debugMode ? { ...node, debugSettings: { failuresEnabled: true, allEnabled: true} } : node
})
};
if ((metadata as any).ruleChainConnections) { if ((metadata as any).ruleChainConnections) {
const ruleChainNameResolveObservables: Observable<void>[] = []; const ruleChainNameResolveObservables: Observable<void>[] = [];
for (const ruleChainConnection of (metadata as any).ruleChainConnections) { for (const ruleChainConnection of (metadata as any).ruleChainConnections) {
if (ruleChainConnection.targetRuleChainId && ruleChainConnection.targetRuleChainId.id) { if (ruleChainConnection.targetRuleChainId && ruleChainConnection.targetRuleChainId.id) {
const ruleChainNode: RuleNode = { const ruleChainNode: RuleNode = {
name: '', name: '',
debugFailures: false,
debugAllUntil: 0,
debugAll: false,
singletonMode: false, singletonMode: false,
type: 'org.thingsboard.rule.engine.flow.TbRuleChainInputNode', type: 'org.thingsboard.rule.engine.flow.TbRuleChainInputNode',
configuration: { configuration: {
@ -688,13 +690,13 @@ export class ImportExportService {
} }
if (ruleChainNameResolveObservables.length) { if (ruleChainNameResolveObservables.length) {
return forkJoin(ruleChainNameResolveObservables).pipe( return forkJoin(ruleChainNameResolveObservables).pipe(
map(() => ruleChainImport) map(() => ({ruleChain, metadata}))
); );
} else { } else {
return of(ruleChainImport); return of({ruleChain, metadata});
} }
} else { } else {
return of(ruleChainImport); return of({ruleChain, metadata});
} }
} }

14
ui-ngx/src/app/shared/models/entity.models.ts

@ -193,10 +193,14 @@ export interface HasVersion {
version?: number; version?: number;
} }
export interface HasDebugConfig { export interface HasDebugSettings {
debugAll?: boolean; debugSettings?: DebugSettings;
debugFailures?: boolean;
debugAllUntil?: number;
} }
export type VersionedEntity = EntityInfoData & HasVersion | RuleChainMetaData; export interface DebugSettings {
failuresEnabled?: boolean;
allEnabled?: boolean;
allEnabledUntil?: number;
}
export type VersionedEntity = EntityInfoData & HasVersion | RuleChainMetaData;

6
ui-ngx/src/app/shared/models/rule-node.models.ts

@ -27,13 +27,13 @@ import { AppState } from '@core/core.state';
import { AbstractControl, UntypedFormGroup } from '@angular/forms'; import { AbstractControl, UntypedFormGroup } from '@angular/forms';
import { RuleChainType } from '@shared/models/rule-chain.models'; import { RuleChainType } from '@shared/models/rule-chain.models';
import { DebugRuleNodeEventBody } from '@shared/models/event.models'; import { DebugRuleNodeEventBody } from '@shared/models/event.models';
import { HasDebugConfig } from '@shared/models/entity.models'; import { HasDebugSettings } from '@shared/models/entity.models';
export interface RuleNodeConfiguration { export interface RuleNodeConfiguration {
[key: string]: any; [key: string]: any;
} }
export interface RuleNode extends BaseData<RuleNodeId>, HasDebugConfig { export interface RuleNode extends BaseData<RuleNodeId>, HasDebugSettings {
ruleChainId?: RuleChainId; ruleChainId?: RuleChainId;
type: string; type: string;
name: string; name: string;
@ -331,7 +331,7 @@ export interface RuleNodeComponentDescriptor extends ComponentDescriptor {
configurationDescriptor?: RuleNodeConfigurationDescriptor; configurationDescriptor?: RuleNodeConfigurationDescriptor;
} }
export interface FcRuleNodeType extends FcNode, HasDebugConfig { export interface FcRuleNodeType extends FcNode, HasDebugSettings {
component?: RuleNodeComponentDescriptor; component?: RuleNodeComponentDescriptor;
singletonMode?: boolean; singletonMode?: boolean;
queueName?: string; queueName?: string;

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

@ -4408,6 +4408,7 @@
"tenant-profiles": "Tenant profiles", "tenant-profiles": "Tenant profiles",
"add": "Add tenant profile", "add": "Add tenant profile",
"add-profile": "Add profile", "add-profile": "Add profile",
"debug": "Debug",
"edit": "Edit tenant profile", "edit": "Edit tenant profile",
"tenant-profile-details": "Tenant profile details", "tenant-profile-details": "Tenant profile details",
"no-tenant-profiles-text": "No tenant profiles found", "no-tenant-profiles-text": "No tenant profiles found",
@ -4476,7 +4477,6 @@
"maximum-ota-package-sum-data-size-required": "Maximum total size of OTA package files is required.", "maximum-ota-package-sum-data-size-required": "Maximum total size of OTA package files is required.",
"maximum-ota-package-sum-data-size-range": "Maximum total size of OTA package files can't be negative", "maximum-ota-package-sum-data-size-range": "Maximum total size of OTA package files can't be negative",
"maximum-debug-duration-min": "Maximum debug duration (min)", "maximum-debug-duration-min": "Maximum debug duration (min)",
"maximum-debug-duration-min-required": "Maximum debug duration is required.",
"maximum-debug-duration-min-range": "Maximum debug duration can't be negative", "maximum-debug-duration-min-range": "Maximum debug duration can't be negative",
"rest-requests-for-tenant": "REST requests for tenant", "rest-requests-for-tenant": "REST requests for tenant",
"transport-tenant-telemetry-msg-rate-limit": "Transport tenant telemetry messages", "transport-tenant-telemetry-msg-rate-limit": "Transport tenant telemetry messages",

Loading…
Cancel
Save