From 099bec6f1ddf9beb9e0551697ac3a4e360ccc695 Mon Sep 17 00:00:00 2001
From: arditdomi <32884230+arditdomi@users.noreply.github.com>
Date: Tue, 26 Jan 2021 16:57:17 +0100
Subject: [PATCH] [ACA-4262] Content node selector - show 2 tabs only in cloud
 attach file widget (#6578)

---
 .../content-node-selector.component.html         | 11 +++++++----
 .../content-node-selector.component.scss         |  8 ++++++++
 .../content-node-selector.component.spec.ts      | 16 ++++++++++++++++
 .../content-node-selector.component.ts           |  9 +++++++++
 4 files changed, 40 insertions(+), 4 deletions(-)

diff --git a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.html b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.html
index 288e97c440..6be6d2a23c 100644
--- a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.html
+++ b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.html
@@ -4,7 +4,10 @@
     <h2>{{title}}</h2>
 </header>
 
-<mat-tab-group class="adf-content-node-selector-dialog-content" (selectedIndexChange)="onTabSelectionChange($event)" mat-align-tabs="start">
+<mat-tab-group class="adf-content-node-selector-dialog-content"
+               mat-align-tabs="start"
+               (selectedIndexChange)="onTabSelectionChange($event)"
+               [class.adf-content-node-selector-headless-tabs]="!canPerformLocalUpload()">
     <mat-tab label="{{ 'NODE_SELECTOR.FILE_SERVER' | translate }}">
             <adf-content-node-selector-panel
                 [currentFolderId]="data?.currentFolderId"
@@ -29,15 +32,15 @@
                 (navigationChange)="onNavigationChange($event)">
             </adf-content-node-selector-panel>
     </mat-tab>
-    <mat-tab *ngIf="data?.showLocalUploadButton"
+    <mat-tab *ngIf="canPerformLocalUpload()"
              label="{{ 'NODE_SELECTOR.UPLOAD_FROM_DEVICE' | translate }}"
              [disabled]="isNotAllowedToUpload()">
     </mat-tab>
 </mat-tab-group>
 
 <mat-dialog-actions>
-    <div *ngIf="isLocalUploadTabSelected()">
-        <ng-container *ngIf="data?.showLocalUploadButton">
+    <div>
+        <ng-container *ngIf="isUploadEnabled()">
             <adf-upload-button
                 [staticTitle]="'FORM.FIELD.UPLOAD' | translate "
                 [multipleFiles]="isMultipleSelection()"
diff --git a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.scss b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.scss
index f9a6425074..73d996a3b4 100644
--- a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.scss
+++ b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.scss
@@ -3,6 +3,14 @@
     $foreground: map-get($theme, foreground);
     $background: map-get($theme, background);
 
+    adf-content-node-selector {
+        .adf-content-node-selector-headless-tabs {
+            .mat-tab-header {
+                display: none;
+            }
+        }
+    }
+
     .adf-content-node-selector-dialog {
         &-content {
             padding-left: 24px;
diff --git a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.spec.ts b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.spec.ts
index 99046a7f1e..33b5592fab 100644
--- a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.spec.ts
+++ b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.spec.ts
@@ -371,5 +371,21 @@ describe('ContentNodeSelectorComponent', () => {
 
             expect(component.isLocalUploadTabSelected()).toEqual(true);
         });
+
+        it('should tabs be headless when local upload is not enabled', () => {
+           component.data.showLocalUploadButton = false;
+           fixture.detectChanges();
+           const tabGroup = fixture.debugElement.queryAll(By.css('.adf-content-node-selector-headless-tabs'))[0];
+
+           expect(tabGroup).not.toBe(undefined);
+        });
+
+        it('should tabs show headers when local upload is enabled', () => {
+            component.data.showLocalUploadButton = true;
+            fixture.detectChanges();
+            const tabGroup = fixture.debugElement.queryAll(By.css('.adf-content-node-selector-headless-tabs'))[0];
+
+            expect(tabGroup).toBe(undefined);
+        });
     });
 });
diff --git a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.ts b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.ts
index a7173e5eb3..ae71f9bf63 100644
--- a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.ts
+++ b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.ts
@@ -137,4 +137,13 @@ export class ContentNodeSelectorComponent implements OnInit {
     isLocalUploadTabSelected (): boolean {
         return this.selectedTabIndex === 1;
     }
+
+    isUploadEnabled(): boolean {
+        return this.canPerformLocalUpload() && this.isLocalUploadTabSelected();
+    }
+
+    canPerformLocalUpload(): boolean {
+        return this.data?.showLocalUploadButton;
+    }
+
 }