From e06a98da37b2a773fbdae3cbb350650977eae435 Mon Sep 17 00:00:00 2001
From: shamoon <4887959+shamoon@users.noreply.github.com>
Date: Wed, 1 Nov 2023 12:14:37 -0700
Subject: [PATCH] Update not found text, support create field from select

---
 .../custom-fields-dropdown.component.html              |  2 ++
 .../custom-fields-dropdown.component.spec.ts           | 10 ++++++++++
 .../custom-fields-dropdown.component.ts                |  7 ++++++-
 .../components/common/input/check/check.component.html |  2 +-
 .../common/input/select/select.component.html          |  1 +
 .../components/common/input/select/select.component.ts |  3 +++
 6 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.html b/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.html
index c324efd8b..7d4881a77 100644
--- a/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.html
+++ b/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.html
@@ -13,6 +13,8 @@
                     bindLabel="name"
                     [(ngModel)]="field"
                     [placeholder]="placeholderText"
+                    [notFoundText]="notFoundText"
+                    (createNew)="createField($event)"
                     bindValue="id">
                 </pngx-input-select>
                 <div class="btn-toolbar" role="toolbar">
diff --git a/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.spec.ts b/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.spec.ts
index c5edfaf68..a95697b1e 100644
--- a/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.spec.ts
+++ b/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.spec.ts
@@ -124,4 +124,14 @@ describe('CustomFieldsDropdownComponent', () => {
     expect(toastInfoSpy).toHaveBeenCalled()
     expect(getFieldsSpy).toHaveBeenCalled()
   })
+
+  it('should support creating field with name', () => {
+    let modal: NgbModalRef
+    modalService.activeInstances.subscribe((m) => (modal = m[m.length - 1]))
+    component.createField('Foo bar')
+
+    expect(modal).not.toBeUndefined()
+    const editDialog = modal.componentInstance as CustomFieldEditDialogComponent
+    expect(editDialog.object.name).toEqual('Foo bar')
+  })
 })
diff --git a/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.ts b/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.ts
index 7cf47a91b..12c51133d 100644
--- a/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.ts
+++ b/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.ts
@@ -44,6 +44,10 @@ export class CustomFieldsDropdownComponent implements OnDestroy {
     return $localize`Choose field`
   }
 
+  get notFoundText(): string {
+    return $localize`No unused fields found`
+  }
+
   constructor(
     private customFieldsService: CustomFieldsService,
     private modalService: NgbModal,
@@ -82,8 +86,9 @@ export class CustomFieldsDropdownComponent implements OnDestroy {
     this.added.emit(this.customFields.find((f) => f.id === this.field))
   }
 
-  createField() {
+  createField(newName: string = null) {
     const modal = this.modalService.open(CustomFieldEditDialogComponent)
+    if (newName) modal.componentInstance.object = { name: newName }
     modal.componentInstance.succeeded
       .pipe(takeUntil(this.unsubscribeNotifier))
       .subscribe((newField) => {
diff --git a/src-ui/src/app/components/common/input/check/check.component.html b/src-ui/src/app/components/common/input/check/check.component.html
index 230a6d02b..9d75088b4 100644
--- a/src-ui/src/app/components/common/input/check/check.component.html
+++ b/src-ui/src/app/components/common/input/check/check.component.html
@@ -8,7 +8,7 @@
         </svg>&nbsp;<ng-container i18n>Remove</ng-container>
       </button>
     </div>
-    <div [class.col-md-9]="horizontal">
+    <div [ngClass]="{'col-md-9': horizontal, 'align-items-center': horizontal, 'd-flex': horizontal}">
       <div class="form-check">
         <input #inputField type="checkbox" class="form-check-input" [id]="inputId" [(ngModel)]="value" (change)="onChange(value)" (blur)="onTouched()" [disabled]="disabled">
         <label *ngIf="!horizontal" class="form-check-label" [for]="inputId">{{title}}</label>
diff --git a/src-ui/src/app/components/common/input/select/select.component.html b/src-ui/src/app/components/common/input/select/select.component.html
index 08cbfc9d7..56e256bb4 100644
--- a/src-ui/src/app/components/common/input/select/select.component.html
+++ b/src-ui/src/app/components/common/input/select/select.component.html
@@ -21,6 +21,7 @@
           addTagText="Add item"
           i18n-addTagText="Used for both types, correspondents, storage paths"
           [placeholder]="placeholder"
+          [notFoundText]="notFoundText"
           [multiple]="multiple"
           [bindLabel]="bindLabel"
           bindValue="id"
diff --git a/src-ui/src/app/components/common/input/select/select.component.ts b/src-ui/src/app/components/common/input/select/select.component.ts
index 437fc60d2..fafedee71 100644
--- a/src-ui/src/app/components/common/input/select/select.component.ts
+++ b/src-ui/src/app/components/common/input/select/select.component.ts
@@ -88,6 +88,9 @@ export class SelectComponent extends AbstractInputComponent<number> {
   @Input()
   showFilter: boolean = false
 
+  @Input()
+  notFoundText: string = $localize`No items found`
+
   @Output()
   createNew = new EventEmitter<string>()