Merge pull request #13840 from ArtemDzhereleiko/AD/enh/entity-autocomplete-create-new

Improve create new for entity autocomplete

ui-ngx/src/app/modules/home/components/ai-model/ai-model-dialog.component.ts

@@ -41,6 +41,7 @@ import { deepTrim } from '@core/utils';
 export interface AIModelDialogData {
   AIModel?: AiModel;
   isAdd?: boolean;
+  name?: string;
 }
 
 @Component({
@@ -111,6 +112,10 @@ export class AIModelDialogComponent extends DialogComponent<AIModelDialogCompone
       })
     });
 
+    if (this.data.name) {
+      this.aiModelForms.get('name').patchValue(this.data.name, {emitEvent: false});
+    }
+
     this.aiModelForms.get('configuration.provider').valueChanges.pipe(
       takeUntilDestroyed()
     ).subscribe((provider: AiProvider) => {

ui-ngx/src/app/modules/home/components/rule-node/external/ai-config.component.html

@@ -29,7 +29,7 @@
         labelText="rule-node-config.ai.model"
         (entityChanged)="onEntityChange($event)"
         [entityType]="entityType.AI_MODEL"
-        (createNew)="createModelAi('modelId')"
+        (createNew)="createModelAi($event, 'modelId')"
         formControlName="modelId">
       </tb-entity-autocomplete>
     </section>

ui-ngx/src/app/modules/home/components/rule-node/external/ai-config.component.ts

@@ -98,12 +98,13 @@ export class AiConfigComponent extends RuleNodeConfigurationComponent {
     return this.translate.instant(`rule-node-config.ai.response-format-hint-${this.aiConfigForm.get('responseFormat.type').value}`);
   }
 
-  createModelAi(formControl: string) {
+  createModelAi(name: string, formControl: string) {
     this.dialog.open<AIModelDialogComponent, AIModelDialogData, AiModel>(AIModelDialogComponent, {
       disableClose: true,
       panelClass: ['tb-dialog', 'tb-fullscreen-dialog'],
       data: {
-        isAdd: true
+        isAdd: true,
+        name
       }
     }).afterClosed()
       .subscribe((model) => {

ui-ngx/src/app/modules/home/pages/mobile/applications/mobile-app-dialog.component.ts

@@ -29,6 +29,7 @@ import { MobileAppService } from '@core/http/mobile-app.service';
 
 export interface MobileAppDialogData {
   platformType: PlatformType;
+  name?: string
 }
 
 @Component({
@@ -55,6 +56,9 @@ export class MobileAppDialogComponent extends DialogComponent<MobileAppDialogCom
   ngAfterViewInit(): void {
     setTimeout(() => {
       this.mobileAppComponent.entityForm.markAsDirty();
+      if (this.data.name) {
+        this.mobileAppComponent.entityForm.get('title').patchValue(this.data.name, {emitEvent: false});
+      }
       this.mobileAppComponent.entityForm.patchValue({platformType: this.data.platformType});
       this.mobileAppComponent.entityForm.get('platformType').disable({emitEvent: false});
       this.mobileAppComponent.isEdit = true;

ui-ngx/src/app/modules/home/pages/mobile/bundes/mobile-bundle-dialog.component.html

@@ -58,7 +58,7 @@
           labelText="mobile.android-application"
           [entityType]="entityType.MOBILE_APP"
           [entitySubtype]="platformType.ANDROID"
-          (createNew)="createApplication('androidAppId', platformType.ANDROID)"
+          (createNew)="createApplication($event, 'androidAppId', platformType.ANDROID)"
           formControlName="androidAppId">
         </tb-entity-autocomplete>
         <tb-entity-autocomplete
@@ -68,7 +68,7 @@
           labelText="mobile.ios-application"
           [entityType]="entityType.MOBILE_APP"
           [entitySubtype]="platformType.IOS"
-          (createNew)="createApplication('iosAppId', platformType.IOS)"
+          (createNew)="createApplication($event, 'iosAppId', platformType.IOS)"
           formControlName="iosAppId">
         </tb-entity-autocomplete>
         <mat-form-field appearance="outline">

ui-ngx/src/app/modules/home/pages/mobile/bundes/mobile-bundle-dialog.component.ts

@@ -148,12 +148,13 @@ export class MobileBundleDialogComponent extends DialogComponent<MobileBundleDia
     }
   }
 
-  createApplication(formControl: string, platformType: PlatformType) {
+  createApplication(name: string, formControl: string, platformType: PlatformType) {
     this.dialog.open<MobileAppDialogComponent, MobileAppDialogData, MobileApp>(MobileAppDialogComponent, {
       disableClose: true,
       panelClass: ['tb-dialog', 'tb-fullscreen-dialog'],
       data: {
-        platformType
+        platformType,
+        name
       }
     }).afterClosed()
       .subscribe((app) => {

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

@@ -71,6 +71,11 @@
           <span>
               {{ noEntitiesMatchingText | translate: {entity: searchText} }}
           </span>
+          @if (allowCreateNew) {
+            <span>
+              <a translate (click)="createNewEntity($event, searchText)">entity.create-new-key</a>
+            </span>
+          }
         </ng-template>
       </div>
     </mat-option>

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

@@ -142,7 +142,7 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit
   entityChanged = new EventEmitter<BaseData<EntityId>>();
 
   @Output()
-  createNew = new EventEmitter<void>();
+  createNew = new EventEmitter<string>();
 
   @ViewChild('entityInput', {static: true}) entityInput: ElementRef;
 
@@ -451,9 +451,9 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit
     return entityType;
   }
 
-  createNewEntity($event: Event) {
+  createNewEntity($event: Event, searchText?: string) {
     $event.stopPropagation();
-    this.createNew.emit();
+    this.createNew.emit(searchText);
   }
 
   get showEntityLink(): boolean {