[ADF-1344] New Custom Loading Content Directive for Datatable Component (#4156)

* [ADF-1344] New Custom Loading Content Directive for Datatable Component

* [ADF-1344] Add unit tests for directives on Document List

* [ADF-1344] Add directive prefix to context-menu directive

* [ADF-1344] Old directive selectors have been put back

* [ADF-1344] Add old selector for empty-content directive

lib/process-services/process-list/components/process-list.component.html

@@ -1,31 +1,33 @@
 <adf-datatable #dataTable
-        [data]="data"
-        [rows]="rows"
-        [columns]="columns"
-        [sorting]="sorting"
-        [loading]="isLoading"
-        [selectionMode]="selectionMode"
-        [multiselect]="multiselect"
-        (rowClick)="onRowClick($event)"
-        (row-keyup)="onRowKeyUp($event)">
-        <loading-content-template>
-            <ng-template>
-                <!--Add your custom loading template here-->
-                <mat-progress-spinner
-                    class="adf-process-list-loading-margin"
-                    [color]="'primary'"
-                    [mode]="'indeterminate'">
-                </mat-progress-spinner>
-            </ng-template>
-        </loading-content-template>
-        <no-content-template>
-            <ng-template>
-                    <adf-empty-content *ngIf="!emptyCustomContent"
+    [data]="data"
+    [rows]="rows"
+    [columns]="columns"
+    [sorting]="sorting"
+    [loading]="isLoading"
+    [selectionMode]="selectionMode"
+    [multiselect]="multiselect"
+    (rowClick)="onRowClick($event)"
+    (row-keyup)="onRowKeyUp($event)">
+    <adf-loading-content-template>
+        <ng-template>
+            <!--Add your custom loading template here-->
+            <mat-progress-spinner
+                *ngIf="!customLoadingContent"
+                class="adf-process-list-loading-margin"
+                [color]="'primary'"
+                [mode]="'indeterminate'">
+            </mat-progress-spinner>
+            <ng-content select="adf-custom-loading-content-template"></ng-content>
+        </ng-template>
+    </adf-loading-content-template>
+    <adf-no-content-template>
+        <ng-template>
+                <adf-empty-content *ngIf="!customEmptyContent"
                     icon="assessment"
                     [title]="(requestNode ? 'ADF_PROCESS_LIST.LIST.TITLE' : 'ADF_PROCESS_LIST.FILTERS.MESSAGES.NONE') | translate "
                     [subtitle]="'ADF_PROCESS_LIST.LIST.SUBTITLE'| translate">
-                    </adf-empty-content>
-                <ng-content select="adf-empty-custom-content"></ng-content>
-            </ng-template>
-        </no-content-template>
-    </adf-datatable>
+                </adf-empty-content>
+            <ng-content select="adf-custom-empty-content-template"></ng-content>
+        </ng-template>
+    </adf-no-content-template>
+</adf-datatable>

lib/process-services/process-list/components/process-list.component.spec.ts

@@ -455,9 +455,9 @@ describe('CustomProcessListComponent', () => {
 @Component({
     template: `
     <adf-process-instance-list [appId]="1">
-        <adf-empty-custom-content>
+        <adf-custom-empty-content-template>
             <p id="custom-id"> No Process Instance</p>
-        </adf-empty-custom-content>
+        </adf-custom-empty-content-template>
     </adf-process-instance-list>
        `
 })

lib/process-services/process-list/components/process-list.component.ts

@@ -19,7 +19,8 @@ import {
     DataTableSchema,
     DataRowEvent,
     DataTableAdapter,
-    EmptyCustomContentDirective
+    CustomEmptyContentTemplateDirective,
+    CustomLoadingContentTemplateDirective
 } from '@alfresco/adf-core';
 import {
     AppConfigService,
@@ -56,7 +57,11 @@ export class ProcessInstanceListComponent extends DataTableSchema  implements On
     static PRESET_KEY = 'adf-process-list.presets';
     public FORMAT_DATE: string = 'll';
 
-    @ContentChild(EmptyCustomContentDirective) emptyCustomContent: EmptyCustomContentDirective;
+    @ContentChild(CustomEmptyContentTemplateDirective)
+    customEmptyContent: CustomEmptyContentTemplateDirective;
+
+    @ContentChild(CustomLoadingContentTemplateDirective)
+    customLoadingContent: CustomLoadingContentTemplateDirective;
 
     /** The id of the app. */
     @Input()

lib/process-services/process-list/components/start-process.component.html

@@ -53,7 +53,7 @@
             (outcomeClick)="onOutcomeClick($event)"
             [showRefreshButton]="false">
             <button
-                form-custom-button
+                adf-form-custom-button
                 mat-button
                 (click)="cancelStartProcess()"
                 id="cancel_process">