From 0f3aa4b589c6a0063a31c4ac4adb5a5671f686a2 Mon Sep 17 00:00:00 2001 From: arditdomi <32884230+arditdomi@users.noreply.github.com> Date: Tue, 9 Feb 2021 20:10:09 +0100 Subject: [PATCH] =?UTF-8?q?[AAE-4515]=20Provide=20a=20way=20to=20disable/e?= =?UTF-8?q?nable=20the=20main=20file=20uploading=20di=E2=80=A6=20(#1981)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * [AAE-4515] Provide a way to disable/enable the main file uploading dialog * Fix expression has been changed after is has been checked error * Add unit tests * Fix linting errors --- .../store/src/actions/app.actions.ts | 9 +++- .../store/src/selectors/app.selectors.ts | 1 + .../aca-shared/store/src/states/app.state.ts | 1 + .../app-layout/app-layout.component.html | 14 ++---- .../app-layout/app-layout.component.spec.ts | 43 ++++++++++++++++++- .../layout/app-layout/app-layout.component.ts | 13 +++++- src/app/store/initial-state.ts | 1 + src/app/store/reducers/app.reducer.ts | 12 +++++- 8 files changed, 77 insertions(+), 17 deletions(-) diff --git a/projects/aca-shared/store/src/actions/app.actions.ts b/projects/aca-shared/store/src/actions/app.actions.ts index 578904d7a..01679f437 100644 --- a/projects/aca-shared/store/src/actions/app.actions.ts +++ b/projects/aca-shared/store/src/actions/app.actions.ts @@ -43,7 +43,8 @@ export enum AppActionTypes { ResetSelection = 'RESET_SELECTION', SetInfoDrawerState = 'SET_INFO_DRAWER_STATE', SetInfoDrawerMetadataAspect = 'SET_INFO_DRAWER_METADATA_ASPECT', - CloseModalDialogs = 'CLOSE_MODAL_DIALOGS' + CloseModalDialogs = 'CLOSE_MODAL_DIALOGS', + SetFileUploadingDialog = 'SET_FILE_UPLOADING_DIALOG' } export class SetSettingsParameterAction implements Action { @@ -127,3 +128,9 @@ export class SetRepositoryInfoAction implements Action { constructor(public payload: RepositoryInfo) {} } + +export class SetFileUploadingDialogAction implements Action { + readonly type = AppActionTypes.SetFileUploadingDialog; + + constructor(public payload: boolean) {} +} diff --git a/projects/aca-shared/store/src/selectors/app.selectors.ts b/projects/aca-shared/store/src/selectors/app.selectors.ts index 03beddbd5..709311fc2 100644 --- a/projects/aca-shared/store/src/selectors/app.selectors.ts +++ b/projects/aca-shared/store/src/selectors/app.selectors.ts @@ -44,6 +44,7 @@ export const getDocumentDisplayMode = createSelector(selectApp, (state) => state export const getRepositoryStatus = createSelector(selectApp, (state) => state.repository); export const isQuickShareEnabled = createSelector(getRepositoryStatus, (info) => info.status.isQuickShareEnabled); export const isAdmin = createSelector(selectApp, (state) => state.user.isAdmin); +export const getFileUploadingDialog = createSelector(selectApp, (state) => state.fileUploadingDialog); export const getSideNavState = createSelector(getAppSelection, getNavigationState, (selection, navigation) => { return { diff --git a/projects/aca-shared/store/src/states/app.state.ts b/projects/aca-shared/store/src/states/app.state.ts index 90f8831d0..9b30803aa 100644 --- a/projects/aca-shared/store/src/states/app.state.ts +++ b/projects/aca-shared/store/src/states/app.state.ts @@ -41,6 +41,7 @@ export interface AppState { showFacetFilter: boolean; documentDisplayMode: string; repository: RepositoryInfo; + fileUploadingDialog: boolean; } export interface AppStore { diff --git a/src/app/components/layout/app-layout/app-layout.component.html b/src/app/components/layout/app-layout/app-layout.component.html index 8bdb1468a..9cab121c1 100644 --- a/src/app/components/layout/app-layout/app-layout.component.html +++ b/src/app/components/layout/app-layout/app-layout.component.html @@ -10,13 +10,7 @@ > - + @@ -25,9 +19,7 @@ @@ -41,7 +33,7 @@ - + diff --git a/src/app/components/layout/app-layout/app-layout.component.spec.ts b/src/app/components/layout/app-layout/app-layout.component.spec.ts index 28115c683..aece3d063 100644 --- a/src/app/components/layout/app-layout/app-layout.component.spec.ts +++ b/src/app/components/layout/app-layout/app-layout.component.spec.ts @@ -25,13 +25,14 @@ import { NO_ERRORS_SCHEMA } from '@angular/core'; import { TestBed, ComponentFixture } from '@angular/core/testing'; -import { AppConfigService, UserPreferencesService } from '@alfresco/adf-core'; +import { AppConfigService, FileModel, UploadService, UserPreferencesService } from '@alfresco/adf-core'; import { AppLayoutComponent } from './app-layout.component'; import { AppTestingModule } from '../../../testing/app-testing.module'; import { Store } from '@ngrx/store'; import { AppStore, SetSelectedNodesAction, ResetSelectionAction } from '@alfresco/aca-shared/store'; import { Router, NavigationStart } from '@angular/router'; -import { Subject } from 'rxjs'; +import { of, Subject } from 'rxjs'; +import { By } from '@angular/platform-browser'; class MockRouter { private url = 'some-url'; @@ -52,6 +53,8 @@ describe('AppLayoutComponent', () => { let userPreference: UserPreferencesService; let store: Store; let router: Router; + let uploadService: UploadService; + let fakeFileList: FileModel[]; beforeEach(() => { TestBed.configureTestingModule({ @@ -73,6 +76,10 @@ describe('AppLayoutComponent', () => { store = TestBed.inject(Store); router = TestBed.inject(Router); userPreference = TestBed.inject(UserPreferencesService); + + fakeFileList = [new FileModel(new File([], 'fakeFile'))]; + + uploadService = TestBed.inject(UploadService); }); beforeEach(() => { @@ -178,4 +185,36 @@ describe('AppLayoutComponent', () => { expect(component.layout.container.toggleMenu).toHaveBeenCalled(); }); + + describe('File Uploading Dialog', () => { + it('should the uploading file dialog be visible on the left when the showFileUploadingDialog is true', async () => { + fixture.detectChanges(); + await fixture.whenStable(); + + uploadService.addToQueue(...fakeFileList); + fixture.detectChanges(); + await fixture.whenStable(); + + const fileUploadingDialog = fixture.debugElement.query(By.css('adf-file-uploading-dialog')); + + expect(fileUploadingDialog.attributes['position']).toEqual('left'); + expect(component.showFileUploadingDialog).toEqual(true); + expect(fileUploadingDialog).not.toEqual(null); + }); + + it('should the uploading file dialog not be visible when the showFileUploadingDialog is false', async () => { + spyOn(store, 'select').and.returnValue(of(false)); + fixture.detectChanges(); + await fixture.whenStable(); + + uploadService.addToQueue(...fakeFileList); + fixture.detectChanges(); + await fixture.whenStable(); + + const fileUploadingDialog = fixture.debugElement.query(By.css('adf-file-uploading-dialog')); + + expect(component.showFileUploadingDialog).toEqual(false); + expect(fileUploadingDialog).toEqual(null); + }); + }); }); diff --git a/src/app/components/layout/app-layout/app-layout.component.ts b/src/app/components/layout/app-layout/app-layout.component.ts index 90a406e77..6193c7f2a 100644 --- a/src/app/components/layout/app-layout/app-layout.component.ts +++ b/src/app/components/layout/app-layout/app-layout.component.ts @@ -28,10 +28,10 @@ import { Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@ang import { NavigationEnd, Router, NavigationStart } from '@angular/router'; import { Store } from '@ngrx/store'; import { Subject, Observable } from 'rxjs'; -import { filter, takeUntil, map, withLatestFrom } from 'rxjs/operators'; +import { filter, takeUntil, map, withLatestFrom, delay } from 'rxjs/operators'; import { NodePermissionService } from '@alfresco/aca-shared'; import { BreakpointObserver } from '@angular/cdk/layout'; -import { AppStore, getCurrentFolder, ResetSelectionAction } from '@alfresco/aca-shared/store'; +import { AppStore, getCurrentFolder, getFileUploadingDialog, ResetSelectionAction } from '@alfresco/aca-shared/store'; import { Directionality } from '@angular/cdk/bidi'; @Component({ @@ -56,6 +56,8 @@ export class AppLayoutComponent implements OnInit, OnDestroy { hideSidenav = false; direction: Directionality; + showFileUploadingDialog: boolean; + private minimizeConditions: string[] = ['search']; private hideConditions: string[] = ['/preview/']; @@ -119,6 +121,13 @@ export class AppLayoutComponent implements OnInit, OnDestroy { .subscribe(() => { this.store.dispatch(new ResetSelectionAction()); }); + + this.store + .select(getFileUploadingDialog) + .pipe(delay(0), takeUntil(this.onDestroy$)) + .subscribe((fileUploadingDialog: boolean) => { + this.showFileUploadingDialog = fileUploadingDialog; + }); } ngOnDestroy() { diff --git a/src/app/store/initial-state.ts b/src/app/store/initial-state.ts index 740195bd7..39bfd3a93 100644 --- a/src/app/store/initial-state.ts +++ b/src/app/store/initial-state.ts @@ -50,6 +50,7 @@ export const INITIAL_APP_STATE: AppState = { infoDrawerOpened: false, infoDrawerMetadataAspect: '', showFacetFilter: true, + fileUploadingDialog: true, documentDisplayMode: 'list', repository: { status: { diff --git a/src/app/store/reducers/app.reducer.ts b/src/app/store/reducers/app.reducer.ts index 27f5298eb..0e04c1a34 100644 --- a/src/app/store/reducers/app.reducer.ts +++ b/src/app/store/reducers/app.reducer.ts @@ -38,7 +38,8 @@ import { SetInfoDrawerStateAction, SetInfoDrawerMetadataAspectAction, SetHeaderColorAction, - SetCurrentNodeVersionAction + SetCurrentNodeVersionAction, + SetFileUploadingDialogAction } from '@alfresco/aca-shared/store'; import { INITIAL_APP_STATE } from '../initial-state'; @@ -94,6 +95,9 @@ export function appReducer(state: AppState = INITIAL_APP_STATE, action: Action): case SearchActionTypes.HideFilter: newState = hideSearchFilter(state); break; + case AppActionTypes.SetFileUploadingDialog: + newState = setUploadDialogVisibility(state, action as SetFileUploadingDialogAction); + break; default: newState = { ...state }; } @@ -256,3 +260,9 @@ function updateRepositoryStatus(state: AppState, action: SetRepositoryInfoAction newState.repository = action.payload; return newState; } + +function setUploadDialogVisibility(state: AppState, action: SetFileUploadingDialogAction): AppState { + const newState = { ...state }; + newState.fileUploadingDialog = action.payload; + return newState; +}