UI: Fixed edit and improve create new

ui-ngx/src/app/modules/home/pages/notification/template/template-notification-dialog.component.ts

@@ -40,6 +40,7 @@ export interface TemplateNotificationDialogData {
   predefinedType?: NotificationType;
   isAdd?: boolean;
   isCopy?: boolean;
+  name?: string;
 }
 
 @Component({
@@ -85,6 +86,9 @@ export class TemplateNotificationDialogComponent
       this.hideSelectType = true;
       this.templateNotificationForm.get('notificationType').setValue(this.data.predefinedType, {emitEvent: false});
     }
+    if (isDefinedAndNotNull(this.data?.name)) {
+      this.templateNotificationForm.get('name').setValue(this.data.name, {emitEvent: false});
+    }
 
     if (data.isAdd || data.isCopy) {
       this.dialogTitle = 'notification.add-notification-template';

ui-ngx/src/app/shared/components/notification/template-autocomplete.component.html

@@ -29,7 +29,7 @@
           (click)="clear()">
     <mat-icon class="material-icons">close</mat-icon>
   </button>
-  <button *ngIf="selectTemplateFormGroup.get('templateName').value && !disabled && allowEdit"
+  <button *ngIf="selectTemplateFormGroup.get('templateName').value?.id && !disabled && allowEdit"
           type="button"
           matSuffix mat-icon-button aria-label="Edit"
           matTooltip="{{ 'notification.edit-notification-template' | translate }}"
@@ -62,6 +62,9 @@
         </div>
         <ng-template #searchNotEmpty>
           <span>{{ 'notification.no-template-matching' | translate : {template: truncate.transform(searchText, true, 6, &apos;...&apos;)} }}</span>
+          <span *ngIf="allowCreate">
+            <a translate (click)="createTemplateBySearchText($event, searchText)">notification.create-new-template</a>
+          </span>
         </ng-template>
       </div>
     </mat-option>

ui-ngx/src/app/shared/components/notification/template-autocomplete.component.ts

@@ -221,6 +221,16 @@ export class TemplateAutocompleteComponent implements ControlValueAccessor, OnIn
       predefinedType: this.notificationTypes
     });
   }
+  createTemplateBySearchText($event: Event, searchText: string) {
+    if ($event) {
+      $event.stopPropagation();
+    }
+    this.openNotificationTemplateDialog({
+      isAdd: true,
+      predefinedType: this.notificationTypes,
+      name: searchText
+    });
+  }
 
   private openNotificationTemplateDialog(dialogData?: TemplateNotificationDialogData) {
     this.dialog.open<TemplateNotificationDialogComponent, TemplateNotificationDialogData,

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

@@ -4071,6 +4071,7 @@
         "no-severity-found": "No severity found",
         "no-severity-matching": "'{{severity}}' not found.",
         "no-template-matching": "No resource matching '{{template}}' were found.",
+        "create-new-template": "Create a new one!",
         "not-found-slack-recipient": "Slack recipient not found",
         "notification": "Notification",
         "notification-center": "Notification center",