From 2b39e9d78069ab01cea7e352504a760c022935f2 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Fri, 14 Jun 2024 11:55:30 +0300 Subject: [PATCH 1/7] [PROD-3656] [FIX] Removed unnecessary parameters for MQTT Connector --- .../gateway-service-rpc-connector-templates.component.html | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html index c0f6997a36..ed297d59d0 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html @@ -37,7 +37,8 @@ [ngTemplateOutletContext]="{ $implicit: config, innerValue: false }"> -
From 24214688cbaa0e8ea5f96b18df8d39028c537fc9 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Fri, 14 Jun 2024 12:48:47 +0300 Subject: [PATCH 2/7] [PROD-3656] [FIX] added pipe --- ...eway-service-rpc-connector-templates.component.html | 2 +- ui-ngx/src/app/shared/pipe/is-exist.pipe.ts | 10 ++++++++++ ui-ngx/src/app/shared/shared.module.ts | 3 +++ 3 files changed, 14 insertions(+), 1 deletion(-) create mode 100644 ui-ngx/src/app/shared/pipe/is-exist.pipe.ts diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html index ed297d59d0..c12355e8d4 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html @@ -37,7 +37,7 @@ [ngTemplateOutletContext]="{ $implicit: config, innerValue: false }"> -
Date: Fri, 14 Jun 2024 12:55:27 +0300 Subject: [PATCH 3/7] [PROD-3656] [FIX] refactoring --- ui-ngx/src/app/shared/pipe/is-exist.pipe.ts | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/ui-ngx/src/app/shared/pipe/is-exist.pipe.ts b/ui-ngx/src/app/shared/pipe/is-exist.pipe.ts index ee40f2142a..f661048be6 100644 --- a/ui-ngx/src/app/shared/pipe/is-exist.pipe.ts +++ b/ui-ngx/src/app/shared/pipe/is-exist.pipe.ts @@ -1,3 +1,19 @@ +/// +/// 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 { Pipe, PipeTransform } from '@angular/core'; @Pipe({ From bcffa86ca37093867c7cb9261790e1a9455aadce Mon Sep 17 00:00:00 2001 From: mpetrov Date: Fri, 14 Jun 2024 13:12:21 +0300 Subject: [PATCH 4/7] [PROD-3656] [FIX] refactoring --- ...eway-service-rpc-connector-templates.component.html | 5 ++--- .../{is-exist.pipe.ts => key-value-not-empty.pipe.ts} | 10 ++++++---- ui-ngx/src/app/shared/shared.module.ts | 6 +++--- 3 files changed, 11 insertions(+), 10 deletions(-) rename ui-ngx/src/app/shared/pipe/{is-exist.pipe.ts => key-value-not-empty.pipe.ts} (70%) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html index c12355e8d4..035a5c6317 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html @@ -32,13 +32,12 @@ -
diff --git a/ui-ngx/src/app/shared/pipe/is-exist.pipe.ts b/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts similarity index 70% rename from ui-ngx/src/app/shared/pipe/is-exist.pipe.ts rename to ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts index f661048be6..320afd1dc4 100644 --- a/ui-ngx/src/app/shared/pipe/is-exist.pipe.ts +++ b/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts @@ -17,10 +17,12 @@ import { Pipe, PipeTransform } from '@angular/core'; @Pipe({ - name: 'isExist' + name: 'keyValueIsNotEmpty' }) -export class IsExistPipe implements PipeTransform { - transform(value: unknown): boolean { - return value !== null && value !== undefined; +export class KeyValueIsNotEmptyPipe implements PipeTransform { + transform(obj: Record): Record { + return Object.fromEntries( + Object.entries(obj).filter(([_, value]) => value !== null && value !== undefined) + ); } } diff --git a/ui-ngx/src/app/shared/shared.module.ts b/ui-ngx/src/app/shared/shared.module.ts index 9b8c930c2f..25bcd56b47 100644 --- a/ui-ngx/src/app/shared/shared.module.ts +++ b/ui-ngx/src/app/shared/shared.module.ts @@ -219,7 +219,7 @@ import { ImageGalleryDialogComponent } from '@shared/components/image/image-gall import { RuleChainSelectPanelComponent } from '@shared/components/rule-chain/rule-chain-select-panel.component'; import { WidgetButtonComponent } from '@shared/components/button/widget-button.component'; import { HexInputComponent } from '@shared/components/color-picker/hex-input.component'; -import { IsExistPipe } from "@shared/pipe/is-exist.pipe"; +import { KeyValueIsNotEmptyPipe } from "@shared/pipe/key-value-not-empty.pipe"; export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) { return markedOptionsService; @@ -367,7 +367,7 @@ export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) ShortNumberPipe, SelectableColumnsPipe, KeyboardShortcutPipe, - IsExistPipe, + KeyValueIsNotEmptyPipe, TbJsonToStringDirective, JsonObjectEditDialogComponent, HistorySelectorComponent, @@ -621,7 +621,7 @@ export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) SafePipe, ShortNumberPipe, SelectableColumnsPipe, - IsExistPipe, + KeyValueIsNotEmptyPipe, RouterModule, TranslateModule, JsonObjectEditDialogComponent, From 8895d9a82e08f9feb8a8eab41416748b1d2c4009 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Fri, 14 Jun 2024 17:44:29 +0300 Subject: [PATCH 5/7] [PROD-3656] [FIX] refactoring --- ...ice-rpc-connector-templates.component.html | 2 +- .../shared/pipe/key-value-not-empty.pipe.ts | 30 ++++++++++++++----- 2 files changed, 24 insertions(+), 8 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html index 035a5c6317..dc9da182ef 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html @@ -32,7 +32,7 @@ diff --git a/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts b/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts index 320afd1dc4..16c5ad29b0 100644 --- a/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts +++ b/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts @@ -14,15 +14,31 @@ /// limitations under the License. /// -import { Pipe, PipeTransform } from '@angular/core'; +import { KeyValueChanges, KeyValueDiffer, KeyValueDiffers, Pipe, PipeTransform } from '@angular/core'; +import { KeyValue, KeyValuePipe } from "@angular/common"; @Pipe({ - name: 'keyValueIsNotEmpty' + name: 'keyValueIsNotEmpty', }) -export class KeyValueIsNotEmptyPipe implements PipeTransform { - transform(obj: Record): Record { - return Object.fromEntries( - Object.entries(obj).filter(([_, value]) => value !== null && value !== undefined) - ); +export class KeyValueIsNotEmptyPipe extends KeyValuePipe implements PipeTransform { + private difference!: KeyValueDiffer; + + constructor(private readonly keyValueDiffers: KeyValueDiffers) { + super(keyValueDiffers); + } + + transform( + input: Record, + compareFn?: (a: KeyValue, b: KeyValue) => number + ): KeyValue[] & null { + super.transform(input, compareFn); + this.difference ??= this.keyValueDiffers.find(input).create(); + const differChanges: KeyValueChanges | null = this.difference.diff(input as any); + if (differChanges) { + console.log(differChanges) + const filteredEntries = [...Object.entries(input)] + .filter(([_, value]) => value !== null && value !== undefined); + return super.transform(new Map(filteredEntries), compareFn) as KeyValue[] & null; + } } } From 858b2eab0cbc16af23b378007f50b6c18bb57731 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Mon, 17 Jun 2024 11:09:47 +0300 Subject: [PATCH 6/7] [PROD-3656] [FIX] refactoring --- ...ice-rpc-connector-templates.component.html | 2 +- .../widget/widget-components.module.ts | 16 ++--- .../shared/pipe/key-value-not-empty.pipe.ts | 58 +++++++++++++------ ui-ngx/src/app/shared/shared.module.ts | 3 - 4 files changed, 50 insertions(+), 29 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html index dc9da182ef..4c5e9b68ba 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html @@ -32,7 +32,7 @@ diff --git a/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts b/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts index d345f5954f..81fbf0aa68 100644 --- a/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts +++ b/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts @@ -100,6 +100,7 @@ import { BarChartWidgetComponent } from '@home/components/widget/lib/chart/bar-c import { PolarAreaWidgetComponent } from '@home/components/widget/lib/chart/polar-area-widget.component'; import { RadarChartWidgetComponent } from '@home/components/widget/lib/chart/radar-chart-widget.component'; import { MobileAppQrcodeWidgetComponent } from '@home/components/widget/lib/mobile-app-qrcode-widget.component'; +import { KeyValueIsNotEmptyPipe } from "@shared/pipe/key-value-not-empty.pipe"; @NgModule({ declarations: @@ -168,13 +169,14 @@ import { MobileAppQrcodeWidgetComponent } from '@home/components/widget/lib/mobi PolarAreaWidgetComponent, RadarChartWidgetComponent ], - imports: [ - CommonModule, - SharedModule, - RpcWidgetsModule, - HomePageWidgetsModule, - SharedHomeComponentsModule - ], + imports: [ + CommonModule, + SharedModule, + RpcWidgetsModule, + HomePageWidgetsModule, + SharedHomeComponentsModule, + KeyValueIsNotEmptyPipe + ], exports: [ EntitiesTableWidgetComponent, AlarmsTableWidgetComponent, diff --git a/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts b/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts index 16c5ad29b0..60b09bab0b 100644 --- a/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts +++ b/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts @@ -14,31 +14,53 @@ /// limitations under the License. /// -import { KeyValueChanges, KeyValueDiffer, KeyValueDiffers, Pipe, PipeTransform } from '@angular/core'; -import { KeyValue, KeyValuePipe } from "@angular/common"; +import { + inject, + KeyValueChangeRecord, + KeyValueChanges, + KeyValueDiffer, + KeyValueDiffers, + Pipe, + PipeTransform +} from '@angular/core'; +import { KeyValue } from "@angular/common"; @Pipe({ name: 'keyValueIsNotEmpty', + pure: false, + standalone: true, }) -export class KeyValueIsNotEmptyPipe extends KeyValuePipe implements PipeTransform { - private difference!: KeyValueDiffer; +export class KeyValueIsNotEmptyPipe implements PipeTransform { + private differs: KeyValueDiffers = inject(KeyValueDiffers); + private differ!: KeyValueDiffer; + private keyValues: Array> = []; - constructor(private readonly keyValueDiffers: KeyValueDiffers) { - super(keyValueDiffers); - } + // This is a custom implementation of angular keyvalue pipe + // https://github.com/angular/angular/blob/main/packages/common/src/pipes/keyvalue_pipe.ts + transform( + input: Record, + ): Array> { + if (!input || (!(input instanceof Map) && typeof input !== 'object')) { + return null; + } + + this.differ ??= this.differs.find(input).create(); + + const differChanges: KeyValueChanges | null = this.differ.diff(input); - transform( - input: Record, - compareFn?: (a: KeyValue, b: KeyValue) => number - ): KeyValue[] & null { - super.transform(input, compareFn); - this.difference ??= this.keyValueDiffers.find(input).create(); - const differChanges: KeyValueChanges | null = this.difference.diff(input as any); if (differChanges) { - console.log(differChanges) - const filteredEntries = [...Object.entries(input)] - .filter(([_, value]) => value !== null && value !== undefined); - return super.transform(new Map(filteredEntries), compareFn) as KeyValue[] & null; + this.keyValues = []; + differChanges.forEachItem((r: KeyValueChangeRecord) => { + if (r.currentValue !== null && r.currentValue !== undefined) { + this.keyValues.push(this.makeKeyValuePair(r.key, r.currentValue!)); + } + }); } + + return this.keyValues; + } + + private makeKeyValuePair(key: string, value: unknown): KeyValue { + return {key: key, value: value}; } } diff --git a/ui-ngx/src/app/shared/shared.module.ts b/ui-ngx/src/app/shared/shared.module.ts index 25bcd56b47..567b80ed83 100644 --- a/ui-ngx/src/app/shared/shared.module.ts +++ b/ui-ngx/src/app/shared/shared.module.ts @@ -219,7 +219,6 @@ import { ImageGalleryDialogComponent } from '@shared/components/image/image-gall import { RuleChainSelectPanelComponent } from '@shared/components/rule-chain/rule-chain-select-panel.component'; import { WidgetButtonComponent } from '@shared/components/button/widget-button.component'; import { HexInputComponent } from '@shared/components/color-picker/hex-input.component'; -import { KeyValueIsNotEmptyPipe } from "@shared/pipe/key-value-not-empty.pipe"; export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) { return markedOptionsService; @@ -367,7 +366,6 @@ export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) ShortNumberPipe, SelectableColumnsPipe, KeyboardShortcutPipe, - KeyValueIsNotEmptyPipe, TbJsonToStringDirective, JsonObjectEditDialogComponent, HistorySelectorComponent, @@ -621,7 +619,6 @@ export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) SafePipe, ShortNumberPipe, SelectableColumnsPipe, - KeyValueIsNotEmptyPipe, RouterModule, TranslateModule, JsonObjectEditDialogComponent, From adc48ec13b6792c2880695296e1f627f2b91c662 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Mon, 17 Jun 2024 14:43:02 +0300 Subject: [PATCH 7/7] refactoring --- ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts b/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts index 60b09bab0b..d657564982 100644 --- a/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts +++ b/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts @@ -24,6 +24,7 @@ import { PipeTransform } from '@angular/core'; import { KeyValue } from "@angular/common"; +import { isDefinedAndNotNull } from "@core/utils"; @Pipe({ name: 'keyValueIsNotEmpty', @@ -51,7 +52,7 @@ export class KeyValueIsNotEmptyPipe implements PipeTransform { if (differChanges) { this.keyValues = []; differChanges.forEachItem((r: KeyValueChangeRecord) => { - if (r.currentValue !== null && r.currentValue !== undefined) { + if (isDefinedAndNotNull(r.currentValue)) { this.keyValues.push(this.makeKeyValuePair(r.key, r.currentValue!)); } });