Update not found text, support create field from select

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">

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')
+  })
 })

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) => {

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>

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"

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>()