#24: fix fetching autocomplete tags

src/app/core/services/private-catalogs.service.ts

@@ -747,7 +747,7 @@ export class PrivateCatalogsService {
     );
   }
 
-  getAllTag(): Observable<Tag[]> {
+  getAllTag(): Observable<string[]> {
     const url = apiConfig.apiBackendURL + apiConfig.urlGetAllTag;
 
     const req = {

src/app/shared/components/publish-to-marketplace-page/publish-to-marketplace-page.component.html

@@ -156,7 +156,7 @@
                 @for (tag of filteredTags | async; track tag) {
                   <mat-option [value]="tag"
                     ><span class="autocomplete-option">{{
-                      tag.tag
+                      tag
                     }}</span></mat-option
                   >
                 }

src/app/shared/components/publish-to-marketplace-page/publish-to-marketplace-page.component.ts

@@ -52,7 +52,6 @@ import { RichTextEditorDialogComponent } from '../rich-text-editor-dialog/rich-t
 import {
   catchError,
   combineLatest,
-  forkJoin,
   map,
   Observable,
   of,
@@ -81,7 +80,7 @@ interface ModelData {
   category?: CatalogFilter | null;
   toolkitType?: CatalogFilter | null;
   image?: any | null;
-  tags?: Tag[];
+  tags?: string[];
   documents?: any[];
 }
 
@@ -120,13 +119,14 @@ export class PublishToMarketplacePageComponent implements OnInit {
   toolkitTypes: CatalogFilter[] = [];
   tagCtrl = new FormControl('');
   @ViewChild('tagInput') tagInput!: ElementRef<HTMLInputElement>;
-  filteredTags: Observable<Tag[]>;
+  filteredTags!: Observable<string[]>;
 
   imageFile!: { content: File; name: string };
   documentFile!: { content: File; name: string };
   licenseProfile!: { content: File; name: string };
   tagsItems = signal<Tag[]>([]);
   documents = signal<DocumentModel[]>([]);
+  allTags = signal<string[]>([]);
 
   descInnerHTML!: string;
 
@@ -208,27 +208,6 @@ export class PublishToMarketplacePageComponent implements OnInit {
           return of({} as ModelData);
         }),
       ) || of({} as ModelData);
-
-    this.filteredTags = this.tagCtrl.valueChanges.pipe(
-      startWith(''),
-      map((value) => {
-        return this.transformValue(value);
-      }),
-      map((name) => (name ? this._filterTag(name) : this.tagsItems().slice())),
-    );
-  }
-
-  transformValue(value: string | Tag | null): string {
-    if (typeof value === 'string') {
-      return value;
-    } else if (value) {
-      return this.displayFn(value);
-    }
-    return '';
-  }
-
-  displayFn(tag: Tag): string {
-    return tag ? `${tag.tag}`.trim() : '';
   }
 
   buildForm() {
@@ -291,6 +270,20 @@ export class PublishToMarketplacePageComponent implements OnInit {
       },
       (err: any) => {},
     );
+
+    this.filteredTags = combineLatest([
+      this.tagCtrl.valueChanges.pipe(startWith('')),
+    ]).pipe(
+      map(([inputValue]) => {
+        const tags = this.allTags();
+        return inputValue ? this.filterTags(inputValue, tags) : tags;
+      }),
+    );
+  }
+
+  filterTags(inputValue: string, tags: string[]): string[] {
+    const filterValue = inputValue.toLowerCase();
+    return tags.filter((tag) => tag.toLowerCase().includes(filterValue));
   }
 
   convertToolkitTypesToCodes(
@@ -556,6 +549,10 @@ export class PublishToMarketplacePageComponent implements OnInit {
         catalog: solutionCatalog,
       });
     }
+    if (data.tags && data.tags.length > 0) {
+      const updatedTags = data.tags ?? [];
+      this.allTags.update((tags: string[]) => [...updatedTags]);
+    }
   }
 
   editModelName(name: string) {
@@ -598,12 +595,4 @@ export class PublishToMarketplacePageComponent implements OnInit {
     this.tagInput.nativeElement.value = '';
     this.tagCtrl.setValue(null);
   }
-
-  private _filterTag(value: string): Tag[] {
-    const filterValue = value.toLowerCase();
-
-    return this.tagsItems().filter((tag) =>
-      tag.tag.toLowerCase().includes(filterValue),
-    );
-  }
 }