[ADF-5316] - Content Type (#6602)

* [ADF-5316] - added content type editing for nodes

* [ADF-5316] - added content type editing for nodes

* [ADF-5316] - fix unit test #1

* [ADF-5316] - fix unit test #2

* [ADF-5316] - fix unit test - final

* Removed failing lint word

* [ADF-5316] - added alfresco api real calls

* Build fixed

* [ADF-5316] - fixed second loop trigger on model

* [ADF-5316] - fixed unit tests

* [ADF-5316] - removed unused stream

* [ADF-5316] - fixed package.json

* [ADF-5316] - added missing unit tests

* [ADF-5316] - fixed wrong import

Co-authored-by: Vito Albano <vitoalbano@vitoalbano-mbp-0120.local>

lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.html

@@ -15,7 +15,7 @@
                     <adf-select-filter-input *ngIf="showInputFilter" (change)="onFilterInputChange($event)"></adf-select-filter-input>
 
                     <mat-option *ngIf="showNoneOption()">{{ 'CORE.CARDVIEW.NONE' | translate }}</mat-option>
-                    <mat-option *ngFor="let option of getList() | async"
+                    <mat-option *ngFor="let option of list$ | async"
                                 [value]="option.key">
                         {{ option.label | translate }}
                     </mat-option>

lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.ts

@@ -18,7 +18,7 @@
 import { Component, Input, OnChanges, OnDestroy } from '@angular/core';
 import { CardViewSelectItemModel } from '../../models/card-view-selectitem.model';
 import { CardViewUpdateService } from '../../services/card-view-update.service';
-import { Observable, Subject } from 'rxjs';
+import { BehaviorSubject, combineLatest, Observable, Subject } from 'rxjs';
 import { CardViewSelectItemOption } from '../../interfaces/card-view.interfaces';
 import { MatSelectChange } from '@angular/material/select';
 import { BaseCardView } from '../base-card-view';
@@ -44,11 +44,13 @@ export class CardViewSelectItemComponent extends BaseCardView<CardViewSelectItem
     displayEmpty: boolean = true;
 
     value: string | number;
-    filter: string = '';
+    filter$: BehaviorSubject<string> = new BehaviorSubject('');
     showInputFilter: boolean = false;
 
     private onDestroy$ = new Subject<void>();
 
+    list$: Observable<CardViewSelectItemOption<string | number>[]> = null;
+
     constructor(cardViewUpdateService: CardViewUpdateService, private appConfig: AppConfigService) {
         super(cardViewUpdateService);
     }
@@ -63,10 +65,12 @@ export class CardViewSelectItemComponent extends BaseCardView<CardViewSelectItem
             .subscribe((options: CardViewSelectItemOption<string>[]) => {
                 this.showInputFilter = options.length > this.optionsLimit;
             });
+
+        this.list$ = this.getList();
     }
 
     onFilterInputChange(value: string) {
-        this.filter = value.toString();
+        this.filter$.next(value.toString());
     }
 
     isEditable(): boolean {
@@ -77,12 +81,12 @@ export class CardViewSelectItemComponent extends BaseCardView<CardViewSelectItem
         return this.options$ || this.property.options$;
     }
 
-    getList(): Observable<CardViewSelectItemOption<string>[]> {
-        return this.getOptions()
+    getList(): Observable<CardViewSelectItemOption<string | number>[]> {
+        return combineLatest([this.getOptions(), this.filter$])
             .pipe(
-                map((items: CardViewSelectItemOption<string>[]) => items.filter(
-                    (item: CardViewSelectItemOption<string>) =>
-                        item.label.toLowerCase().includes(this.filter.toLowerCase()))),
+                map(([items, filter]) => items.filter((item: CardViewSelectItemOption<string>) =>
+                    filter ? item.label.toLowerCase().includes(filter.toLowerCase())
+                        : true)),
                 takeUntil(this.onDestroy$)
             );
     }

lib/core/card-view/models/card-view-selectitem.model.ts

@@ -26,18 +26,25 @@ export class CardViewSelectItemModel<T> extends CardViewBaseItemModel implements
     type: string = 'select';
     options$: Observable<CardViewSelectItemOption<T>[]>;
 
+    valueFetch$: Observable<string> = null;
+
     constructor(cardViewSelectItemProperties: CardViewSelectItemProperties<T>) {
         super(cardViewSelectItemProperties);
 
         this.options$ = cardViewSelectItemProperties.options$;
-    }
 
-    get displayValue() {
-        return this.options$.pipe(
+        this.valueFetch$ = this.options$.pipe(
             switchMap((options) => {
                 const option = options.find((o) => o.key === this.value?.toString());
                 return of(option ? option.label : '');
-            })
-        );
+        }));
+    }
+
+    get displayValue() {
+        return this.valueFetch$;
+    }
+
+    setValue(value: any) {
+        this.value = value;
     }
 }

lib/core/i18n/en.json

@@ -199,7 +199,23 @@
         "CREATOR": "Creator",
         "CREATED_DATE": "Created Date",
         "MODIFIER": "Modifier",
-        "MODIFIED_DATE": "Modified Date"
+        "MODIFIED_DATE": "Modified Date",
+        "CONTENT_TYPE": "Content Type"
+      },
+      "CONTENT_TYPE": {
+        "DIALOG" :{
+          "TITLE" : "Change content type",
+          "DESCRIPTION": "Making this change to the content type will permanently add some properties and stored metadata to the document.",
+          "CONFIRM": "Are you sure you want to change the content type?",
+          "CANCEL": "CANCEL",
+          "APPLY": "SAVE CHANGES",
+          "VIEW_DETAILS": "View details",
+          "PROPERTY" :{
+            "NAME" : "Name",
+            "DESCRIPTION": "Description",
+            "DATA_TYPE": "Data type"
+          }
+        }
       },
       "ACTIONS": {
         "EDIT": "Edit",

lib/core/services/alfresco-api.service.ts

@@ -23,7 +23,7 @@ import {
     SearchApi,
     Node,
     GroupsApi,
-    AlfrescoApiCompatibility, AlfrescoApiConfig
+    AlfrescoApiCompatibility, AlfrescoApiConfig, TypesApi
 } from '@alfresco/js-api';
 import { AppConfigService, AppConfigValues } from '../app-config/app-config.service';
 import { Subject, Observable, BehaviorSubject } from 'rxjs';
@@ -102,6 +102,10 @@ export class AlfrescoApiService {
         return new GroupsApi(this.getInstance());
     }
 
+    get typesApi(): TypesApi {
+        return new TypesApi(this.getInstance());
+    }
+
     constructor(
         protected appConfig: AppConfigService,
         protected storageService: StorageService) {