[ACS-7577] [ADF] Remove Folder Directives from Content Services lib (#9582)

* ACS-7577 remove create and edit folder directive [ci:force]

* Revert "ACS-7577 remove create and edit folder directive [ci:force]"

This reverts commit a0055aa496d1c6ee64118035acb36b55ab59716b.

* ACS-7577 move edit and create folder directives to demo-shell [ci:force]

* ACS-7577 remove public-api and fix readme file [ci:force]

* ACS-7577 remove edit directive [ci:force]

* ACS-7577 update e2e tests [ci:force]

* ACS-7577 update e2e tests [ci:force]

* ACS-7577 update e2e tests [ci:force]

* ACS-7577 revert e2e tests [ci:force]

* ACS-7577 revert e2e tests and create button [ci:force]

* ACS-7577 refactor e2e test [ci:force]

---------

Co-authored-by: DaryaBalvanovich <darya.balvanovich1@hyland.com>

demo-shell/src/app/app.module.ts

@@ -67,6 +67,7 @@ import { ProcessCloudLayoutComponent } from './components/cloud/process-cloud-la
 import { CustomEditorComponent, CustomWidgetComponent } from './components/cloud/custom-form-components/custom-editor.component';
 import { SearchFilterChipsComponent } from './components/search/search-filter-chips.component';
 import { UserInfoComponent } from './components/app-layout/user-info/user-info.component';
+import { FolderDirectiveModule } from './folder-directive';
 
 @NgModule({
     imports: [
@@ -87,7 +88,8 @@ import { UserInfoComponent } from './components/app-layout/user-info/user-info.c
         ExtensionsModule.forRoot(),
         NgChartsModule,
         AppCloudSharedModule,
-        MonacoEditorModule.forRoot()
+        MonacoEditorModule.forRoot(),
+        FolderDirectiveModule
     ],
     declarations: [
         AppComponent,

demo-shell/src/app/components/files/files.component.html

@@ -64,19 +64,6 @@
                     <mat-icon>more_vert</mat-icon>
                 </button>
                 <mat-menu #menu="matMenu">
-                    <button mat-menu-item
-                            (error)="openSnackMessageError($event)"
-                            [adf-create-folder]="currentFolderId">
-                        <mat-icon>create_new_folder</mat-icon>
-                        <span>New folder</span>
-                    </button>
-                    <button mat-menu-item
-                            [disabled]="!canEditFolder(documentList.selection)"
-                            (error)="openSnackMessageError($event)"
-                            [adf-edit-folder]="documentList.selection[0]?.entry">
-                        <mat-icon>create</mat-icon>
-                        <span>Edit folder</span>
-                    </button>
                     <button mat-menu-item
                             adf-check-allowable-operation="delete"
                             [adf-nodes]="documentList.selection"

demo-shell/src/app/components/files/files.component.ts

@@ -390,17 +390,6 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
         return this.contentService.hasAllowableOperations(selection[0].entry, 'update');
     }
 
-    canEditFolder(selection: Array<NodeEntry>): boolean {
-        if (selection && selection.length === 1) {
-            const entry = selection[0].entry;
-
-            if (entry?.isFolder) {
-                return this.contentService.hasAllowableOperations(entry, 'update');
-            }
-        }
-        return false;
-    }
-
     canCreateContent(parentNode: Node): boolean {
         if (parentNode) {
             return this.contentService.hasAllowableOperations(parentNode, 'create');

demo-shell/src/app/folder-directive/folder-create.directive.md

@@ -0,0 +1,55 @@
+---
+Title: Folder Create directive
+Added: v2.0.0
+Status: Deprecated
+Last reviewed: 2019-01-16
+---
+
+# [Folder Create directive](../../../lib/content-services/src/lib/folder-directive/folder-create.directive.ts "Defined in folder-create.directive.ts")
+
+Creates folders.
+
+## Basic Usage
+
+```html
+<adf-toolbar>
+    <button mat-icon-button
+            [adf-create-folder]="documentList.currentFolderId"
+            title="Title of the dialog"
+            (success)="doSomething($event)">
+            <mat-icon>create_new_folder</mat-icon>
+    </button>
+</adf-toolbar>
+
+<adf-document-list #documentList ...>
+ ...
+</adf-document-list>
+```
+
+## Class members
+
+### Properties
+
+| Name | Type | Default value | Description |
+| ---- | ---- | ------------- | ----------- |
+| nodeType | `string` | "cm:folder" | Type of node to create. |
+| parentNodeId | `string` |  | Parent folder where the new folder will be located after creation. |
+| title | `string` | null | Title of folder creation dialog. |
+
+### Events
+
+| Name | Type | Description |
+| ---- | ---- | ----------- |
+| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when an error occurs (eg, a folder with same name already exists). |
+| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<Node>` | Emitted when the folder is created successfully. |
+
+## Details
+
+Pass this directive the id of the parent folder where you want the new folder node to be created.
+If no value is provided, the '-my-' alias is used.
+This will open a [Folder Dialog component](../../../lib/content-services/dialogs/folder.dialog.ts) to receive data for the new folder. If the data is valid
+then the dialog will emit a `success` event when it closes.
+
+## See also
+
+-   [Folder Edit directive](folder-edit.directive.md)

demo-shell/src/app/folder-directive/folder-create.directive.spec.ts

@@ -0,0 +1,146 @@
+/*!
+ * @license
+ * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Component } from '@angular/core';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { MatDialog } from '@angular/material/dialog';
+import { By } from '@angular/platform-browser';
+import { Subject, of } from 'rxjs';
+import { FolderCreateDirective } from './folder-create.directive';
+import { Node } from '@alfresco/js-api';
+import { ContentService } from '@alfresco/adf-content-services';
+import { ContentTestingModule } from 'lib/content-services/src/lib/testing/content.testing.module';
+
+@Component({
+    template: ` <div [adf-create-folder]="parentNode" (success)="success($event)" title="create-title" [nodeType]="'cm:my-little-pony'"></div>`
+})
+class TestTypeComponent {
+    parentNode = '';
+    public successParameter: Node = null;
+
+    success(node: Node) {
+        this.successParameter = node;
+    }
+}
+
+@Component({
+    template: `<div [adf-create-folder]="parentNode"></div>`
+})
+class TestComponent {
+    parentNode = '';
+    public successParameter: Node = null;
+}
+
+describe('FolderCreateDirective', () => {
+    let fixture: ComponentFixture<TestTypeComponent | TestComponent>;
+    let element;
+    let dialog: MatDialog;
+    let contentService: ContentService;
+    let dialogRefMock;
+
+    const event = { type: 'click', preventDefault: () => null };
+
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            imports: [ContentTestingModule],
+            declarations: [TestTypeComponent, TestComponent]
+        });
+        fixture = TestBed.createComponent(TestComponent);
+        element = fixture.debugElement.query(By.directive(FolderCreateDirective));
+        dialog = TestBed.inject(MatDialog);
+        contentService = TestBed.inject(ContentService);
+
+        dialogRefMock = {
+            afterClosed: (val) => of(val),
+            componentInstance: {
+                error: new Subject<any>(),
+                success: new Subject<Node>()
+            }
+        };
+    });
+
+    describe('With overrides', () => {
+        beforeEach(() => {
+            fixture = TestBed.createComponent(TestTypeComponent);
+            element = fixture.debugElement.query(By.directive(FolderCreateDirective));
+            dialog = TestBed.inject(MatDialog);
+            contentService = TestBed.inject(ContentService);
+            spyOn(dialog, 'open').and.returnValue(dialogRefMock);
+        });
+
+        it('should not emit folderCreate event when input value is undefined', async () => {
+            spyOn(dialogRefMock, 'afterClosed').and.returnValue(of(null));
+            spyOn(contentService.folderCreate, 'next');
+
+            fixture.detectChanges();
+            await fixture.whenStable();
+
+            element.nativeElement.click();
+            expect(contentService.folderCreate.next).not.toHaveBeenCalled();
+        });
+
+        it('should emit success event with node if the folder creation was successful', async () => {
+            const testNode = {};
+
+            element.triggerEventHandler('click', event);
+            dialogRefMock.componentInstance.success.next(testNode);
+
+            fixture.whenStable();
+            await fixture.whenStable();
+
+            expect(fixture.componentInstance.successParameter).toBe(testNode);
+        });
+
+        it('should open the dialog with the proper title and nodeType', () => {
+            fixture.detectChanges();
+            element.triggerEventHandler('click', event);
+
+            expect(dialog.open).toHaveBeenCalledWith(jasmine.any(Function), {
+                data: {
+                    parentNodeId: jasmine.any(String),
+                    createTitle: 'create-title',
+                    nodeType: 'cm:my-little-pony'
+                },
+                width: jasmine.any(String)
+            });
+        });
+    });
+
+    describe('Without overrides', () => {
+        beforeEach(() => {
+            fixture = TestBed.createComponent(TestComponent);
+            element = fixture.debugElement.query(By.directive(FolderCreateDirective));
+            dialog = TestBed.inject(MatDialog);
+            contentService = TestBed.inject(ContentService);
+            spyOn(dialog, 'open').and.returnValue(dialogRefMock);
+        });
+
+        it('should open the dialog with the default title and nodeType', () => {
+            fixture.detectChanges();
+            element.triggerEventHandler('click', event);
+
+            expect(dialog.open).toHaveBeenCalledWith(jasmine.any(Function), {
+                data: {
+                    parentNodeId: jasmine.any(String),
+                    createTitle: null,
+                    nodeType: 'cm:folder'
+                },
+                width: jasmine.any(String)
+            });
+        });
+    });
+});

demo-shell/src/app/folder-directive/folder-create.directive.ts

@@ -0,0 +1,87 @@
+/*!
+ * @license
+ * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint-disable */
+
+import { Directive, HostListener, Input, Output, EventEmitter } from '@angular/core';
+import { MatDialog } from '@angular/material/dialog';
+import { Node } from '@alfresco/js-api';
+import { ContentService, FolderDialogComponent } from '@alfresco/adf-content-services';
+
+const DEFAULT_FOLDER_PARENT_ID = '-my-';
+const DIALOG_WIDTH: number = 400;
+
+@Directive({
+    selector: '[adf-create-folder]'
+})
+export class FolderCreateDirective {
+    /** Parent folder where the new folder will be located after creation. */
+    @Input('adf-create-folder')
+    parentNodeId: string = DEFAULT_FOLDER_PARENT_ID;
+
+    /** Title of folder creation dialog. */
+    @Input()
+    title: string = null;
+
+    /** Type of node to create. */
+    @Input()
+    nodeType = 'cm:folder';
+
+    /** Emitted when an error occurs (eg, a folder with same name already exists). */
+    @Output()
+    error: EventEmitter<any> = new EventEmitter<any>();
+
+    /** Emitted when the folder is created successfully. */
+    @Output()
+    success: EventEmitter<Node> = new EventEmitter<Node>();
+
+    @HostListener('click', ['$event'])
+    onClick(event) {
+        event.preventDefault();
+        this.openDialog();
+    }
+
+    constructor(public dialogRef: MatDialog, public content: ContentService) {}
+
+    private get dialogConfig() {
+        const { parentNodeId, title: createTitle, nodeType } = this;
+
+        return {
+            data: { parentNodeId, createTitle, nodeType },
+            width: `${DIALOG_WIDTH}px`
+        };
+    }
+
+    private openDialog(): void {
+        const { dialogRef, dialogConfig, content } = this;
+        const dialogInstance = dialogRef.open(FolderDialogComponent, dialogConfig);
+
+        dialogInstance.componentInstance.error.subscribe((error) => {
+            this.error.emit(error);
+        });
+
+        dialogInstance.componentInstance.success.subscribe((node: Node) => {
+            this.success.emit(node);
+        });
+
+        dialogInstance.afterClosed().subscribe((node: Node) => {
+            if (node) {
+                content.folderCreate.next(node);
+            }
+        });
+    }
+}

demo-shell/src/app/folder-directive/folder-directive.module.ts

@@ -0,0 +1,29 @@
+/*!
+ * @license
+ * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { MaterialModule } from '../material.module';
+
+import { FolderCreateDirective } from './folder-create.directive';
+
+@NgModule({
+    imports: [CommonModule, MaterialModule],
+    declarations: [FolderCreateDirective],
+    exports: [FolderCreateDirective]
+})
+export class FolderDirectiveModule {}

demo-shell/src/app/folder-directive/index.ts

@@ -0,0 +1,20 @@
+/*!
+ * @license
+ * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export * from './folder-create.directive';
+
+export * from './folder-directive.module';