diff --git a/ui-ngx/src/app/modules/home/components/alarm-rules/alarm-rule-dialog.component.ts b/ui-ngx/src/app/modules/home/components/alarm-rules/alarm-rule-dialog.component.ts index 2209cbafba..f45e205246 100644 --- a/ui-ngx/src/app/modules/home/components/alarm-rules/alarm-rule-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/alarm-rules/alarm-rule-dialog.component.ts @@ -67,7 +67,7 @@ export class AlarmRuleDialogComponent extends DialogComponent(null, Validators.required), - id: ['', Validators.required], + id: [null as null | string, Validators.required], }), configuration: this.fb.group({ arguments: this.fb.control({}), @@ -101,7 +101,6 @@ export class AlarmRuleDialogComponent extends DialogComponent { - if (loading) { - this.fieldFormGroup.disable({emitEvent: false}); - } else { - this.fieldFormGroup.enable({emitEvent: false}); - if (this.data.isDirty) { - this.fieldFormGroup.markAsDirty(); - } - } - }); - } - onTestScript(expression: string): Observable { const calculatedFieldId = this.data.value?.id?.id; if (calculatedFieldId) { diff --git a/ui-ngx/src/app/modules/home/components/alarm-rules/alarm-rules-table-config.ts b/ui-ngx/src/app/modules/home/components/alarm-rules/alarm-rules-table-config.ts index 6fa6515663..8593b28956 100644 --- a/ui-ngx/src/app/modules/home/components/alarm-rules/alarm-rules-table-config.ts +++ b/ui-ngx/src/app/modules/home/components/alarm-rules/alarm-rules-table-config.ts @@ -152,7 +152,7 @@ export class AlarmRulesTableConfig extends EntityTableConfig { this.cellActionDescriptors.push( { - name: this.translate.instant('notification.copy-template'), + name: this.translate.instant('alarm-rule.copy'), icon: 'content_copy', isEnabled: () => true, onAction: ($event, entity) => this.copyCalculatedField(entity) diff --git a/ui-ngx/src/app/modules/home/components/alarm-rules/cf-alarm-rule-condition.component.ts b/ui-ngx/src/app/modules/home/components/alarm-rules/cf-alarm-rule-condition.component.ts index 2a0b7a7810..543b0a86dc 100644 --- a/ui-ngx/src/app/modules/home/components/alarm-rules/cf-alarm-rule-condition.component.ts +++ b/ui-ngx/src/app/modules/home/components/alarm-rules/cf-alarm-rule-condition.component.ts @@ -20,7 +20,7 @@ import { FormBuilder, NG_VALIDATORS, NG_VALUE_ACCESSOR, - UntypedFormControl, + ValidationErrors, Validator } from '@angular/forms'; import { MatDialog } from '@angular/material/dialog'; @@ -130,10 +130,10 @@ export class CfAlarmRuleConditionComponent implements ControlValueAccessor, Vali } public conditionSet() { - return this.modelValue && (this.modelValue.expression?.expression || this.modelValue.expression?.filters) || !this.required; + return this.modelValue && (this.modelValue.expression?.expression || this.modelValue.expression?.filters); } - public validate(c: UntypedFormControl) { + public validate(): ValidationErrors | null { return this.conditionSet() ? null : { alarmRuleCondition: { valid: false, @@ -166,11 +166,11 @@ export class CfAlarmRuleConditionComponent implements ControlValueAccessor, Vali private updateConditionInfo() { this.alarmRuleConditionFormGroup.patchValue( - { + this.modelValue ? { type: this.modelValue?.type, expression: this.modelValue?.expression, schedule: this.modelValue?.schedule, - }, {emitEvent: false} + } : null, {emitEvent: false} ); this.updateScheduleText(); this.updateSpecText(); diff --git a/ui-ngx/src/app/modules/home/components/alarm-rules/cf-alarm-rule.component.ts b/ui-ngx/src/app/modules/home/components/alarm-rules/cf-alarm-rule.component.ts index 5db525074d..cd6e06f293 100644 --- a/ui-ngx/src/app/modules/home/components/alarm-rules/cf-alarm-rule.component.ts +++ b/ui-ngx/src/app/modules/home/components/alarm-rules/cf-alarm-rule.component.ts @@ -20,8 +20,9 @@ import { FormBuilder, NG_VALIDATORS, NG_VALUE_ACCESSOR, - UntypedFormControl, - Validator + ValidationErrors, + Validator, + Validators } from '@angular/forms'; import { MatDialog } from '@angular/material/dialog'; import { isDefinedAndNotNull } from '@core/utils'; @@ -76,7 +77,7 @@ export class CfAlarmRuleComponent implements ControlValueAccessor, OnInit, Valid private modelValue: AlarmRule; alarmRuleFormGroup = this.fb.group({ - condition: this.fb.control(null), + condition: this.fb.control(null, Validators.required), alarmDetails: [null], dashboardId: [null] }); @@ -113,14 +114,12 @@ export class CfAlarmRuleComponent implements ControlValueAccessor, OnInit, Valid } writeValue(value: AlarmRule): void { - if (value) { - this.modelValue = value; - const model = this.modelValue ? { - ...this.modelValue, - dashboardId: this.modelValue.dashboardId?.id - } : null; - this.alarmRuleFormGroup.patchValue(model, {emitEvent: false}); - } + this.modelValue = value; + const model = this.modelValue ? { + ...this.modelValue, + dashboardId: this.modelValue.dashboardId?.id + } : null; + this.alarmRuleFormGroup.patchValue(model, {emitEvent: false}); } public openEditDetailsDialog($event: Event) { @@ -142,7 +141,7 @@ export class CfAlarmRuleComponent implements ControlValueAccessor, OnInit, Valid }); } - public validate(c: UntypedFormControl) { + public validate(): ValidationErrors | null { return (!this.required && !this.modelValue || this.alarmRuleFormGroup.valid) ? null : { alarmRule: { valid: false, diff --git a/ui-ngx/src/app/modules/home/components/alarm-rules/create-cf-alarm-rules.component.ts b/ui-ngx/src/app/modules/home/components/alarm-rules/create-cf-alarm-rules.component.ts index 2197d6d14c..8959d709fa 100644 --- a/ui-ngx/src/app/modules/home/components/alarm-rules/create-cf-alarm-rules.component.ts +++ b/ui-ngx/src/app/modules/home/components/alarm-rules/create-cf-alarm-rules.component.ts @@ -23,7 +23,7 @@ import { NG_VALIDATORS, NG_VALUE_ACCESSOR, UntypedFormArray, - UntypedFormControl, + ValidationErrors, Validator, Validators } from '@angular/forms'; @@ -159,8 +159,8 @@ export class CreateCfAlarmRulesComponent implements ControlValueAccessor, Valida return null; } - public validate(c: UntypedFormControl) { - return this.createAlarmRulesFormArray().length ? null : { + public validate(): ValidationErrors | null { + return this.createAlarmRulesFormGroup.valid && this.createAlarmRulesFormArray().length > 0 ? null : { createAlarmRules: { valid: false, }, diff --git a/ui-ngx/src/app/modules/home/components/api-key/api-key-generated-dialog.component.html b/ui-ngx/src/app/modules/home/components/api-key/api-key-generated-dialog.component.html index 82cd665f36..fc52b17580 100644 --- a/ui-ngx/src/app/modules/home/components/api-key/api-key-generated-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/api-key/api-key-generated-dialog.component.html @@ -96,6 +96,10 @@
device.connectivity.execute-following-command
+
+ warning + {{ 'api-key.generated-api-key-insecure-url' | translate }} +
diff --git a/ui-ngx/src/app/modules/home/components/api-key/api-key-generated-dialog.component.scss b/ui-ngx/src/app/modules/home/components/api-key/api-key-generated-dialog.component.scss index 7122a08f23..6fb607f5a5 100644 --- a/ui-ngx/src/app/modules/home/components/api-key/api-key-generated-dialog.component.scss +++ b/ui-ngx/src/app/modules/home/components/api-key/api-key-generated-dialog.component.scss @@ -15,9 +15,8 @@ */ @import '../../src/scss/constants'; -:host{ +:host { display: grid; - width: 500px; height: 100%; max-width: 100%; max-height: 100vh; @@ -26,6 +25,20 @@ .tb-install-instruction-text { min-height: 42px; } + + .insecure-url-warning { + .mat-icon { + color: #FAA405; + } + } + + @media #{$mat-sm} { + width: 470px; + } + + @media #{$mat-gt-sm} { + width: 720px; + } } :host ::ng-deep { diff --git a/ui-ngx/src/app/modules/home/components/api-key/api-key-generated-dialog.component.ts b/ui-ngx/src/app/modules/home/components/api-key/api-key-generated-dialog.component.ts index b60ba9ecde..999a701ae1 100644 --- a/ui-ngx/src/app/modules/home/components/api-key/api-key-generated-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/api-key/api-key-generated-dialog.component.ts @@ -34,7 +34,10 @@ export interface ApiKeyGeneratedDialogData { }) export class ApiKeyGeneratedDialogComponent extends DialogComponent { - apiKeyCommand = userInfoCommand(this.data.apiKey.value); + private baseUrl = window.location.origin; + + apiKeyCommand = userInfoCommand(this.baseUrl, this.data.apiKey.value); + secureUrl = this.baseUrl.startsWith('https'); selectedTab: number; constructor(protected store: Store, diff --git a/ui-ngx/src/app/shared/models/api-key.models.ts b/ui-ngx/src/app/shared/models/api-key.models.ts index e3950cc5dd..3e0360f1ee 100644 --- a/ui-ngx/src/app/shared/models/api-key.models.ts +++ b/ui-ngx/src/app/shared/models/api-key.models.ts @@ -19,7 +19,7 @@ import { HasTenantId } from '@shared/models/entity.models'; import { ApiKeyId } from '@shared/models/id/api-key-id'; import { UserId } from '@shared/models/id/user-id'; -export const userInfoCommand = (key: string): string => `curl -X GET "${window.location.origin}/api/auth/user" -H "Content-Type: application/json" -H "X-Authorization: ApiKey ${key}"` +export const userInfoCommand = (baseUrl: string, apiKey: string): string => `curl -X GET "${baseUrl}/api/auth/user" -H "Content-Type: application/json" -H "X-Authorization: ApiKey ${apiKey}"` export interface ApiKeyInfo extends BaseData, HasTenantId { enabled: boolean; diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json index 25efae80b3..b834af6d8e 100644 --- a/ui-ngx/src/assets/locale/locale.constant-en_US.json +++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json @@ -1012,6 +1012,7 @@ "generated-api-key-title": "API key generated. Let’s check connectivity!", "generated-api-key-copy": "Make sure to copy and save your API key now as you will not be able to see it again.", "generated-api-key-command": "Use the following instructions to check connectivity. As a result, you should receive the current user information:", + "generated-api-key-insecure-url": "Executing commands over an insecure HTTP connection will send your API key unencrypted, making it vulnerable to interception.", "list": "{ count, plural, =1 {One API key} other {List of # API keys} }", "manage": "Manage", "manage-api-keys": "Manage API keys",