inteligr8/alfresco-content-app
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-content-app.git synced 2025-09-17 14:21:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

implemented review comments and removed process related code

Browse Source
This commit is contained in:
SheenaMalhotra182
2023-02-09 20:24:12 +05:30
committed by Yasa-Nataliya
parent 81dfc601d1
commit a2a7f982f9
6 changed files with 144 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
projects/aca-content/src/lib/components/header-actions/header-actions.component.html
View File

@@ -24,8 +24,6 @@
</div> </div>
</mat-menu> </mat-menu>
<app-main-action *ngIf="isTasksRoute() || isProcessesRoute()"></app-main-action>
<adf-toolbar-divider *ngIf="canShowSearchSeparator()"> <adf-toolbar-divider *ngIf="canShowSearchSeparator()">
</adf-toolbar-divider> </adf-toolbar-divider>
<aca-search-input class="app-search-input"></aca-search-input> <aca-search-input class="app-search-input"></aca-search-input>

127
projects/aca-content/src/lib/components/header-actions/header-actions.component.scss
View File

@@ -1,80 +1,55 @@
.aca-page-layout-header { .aca-page-layout-header {
// display: flex;
// align-items: center;
// flex: 0 0 65px;
// flex-basis: 96px;
// background: var(--theme-page-layout-header-background-color);
// border-bottom: 1px solid var(--theme-border-color, rgba(0, 0, 0, 0.07));
// padding: 0 24px;
.adf-breadcrumb-item { .app-search-input {
font-size: 20px !important; background: none;
font-weight: 400 !important; }
letter-spacing: 0.15px !important;
}
.app-search-input { .action-bar {
background: none; display: flex;
} flex: auto;
height: 32px;
.action-bar { margin-left: 24px;
display: flex;
flex: auto;
height: 32px;
margin-left: 24px;
adf-toolbar-divider { adf-toolbar-divider {
width: 24px !important; width: 24px !important;
height: 32px !important; height: 32px !important;
margin: 4px 0 0 12px !important; margin: 4px 0 0 12px !important;
} }
} }
.aca-mat-button { .aca-mat-button {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
letter-spacing: 0.25px; letter-spacing: 0.25px;
font-weight: 500; font-weight: 500;
font-size: 14px; font-size: 14px;
font-style: normal; font-style: normal;
border-radius: 6px; border-radius: 6px;
border: none; border: none;
} }
.aca-create-button { .aca-create-button {
width: 71px !important; width: 71px !important;
min-width: 71px; min-width: 71px;
height: 32px; height: 32px;
background-color: var(--theme-create-button-background-color); background-color: var(--theme-create-button-background-color);
color: var(--theme-create-button-text-color); color: var(--theme-create-button-text-color);
text-overflow: ellipsis; text-overflow: ellipsis;
display: flex; display: flex;
padding: 0; padding: 0;
} }
.aca-upload-button { .aca-upload-button {
width: 73px !important; width: 73px !important;
min-width: 73px; min-width: 73px;
height: 32px; height: 32px;
background-color: var(--theme-upload-button-background-color); background-color: var(--theme-upload-button-background-color);
color: var(--theme-upload-button-text-color); color: var(--theme-upload-button-text-color);
text-overflow: ellipsis; text-overflow: ellipsis;
display: flex; display: flex;
padding: 0; padding: 0;
margin-left: 12px; margin-left: 12px;
} }
}
// .aca-process-button {
// width: 130px !important;
// min-width: 130px;
// height: 32px;
// background-color: var(--theme-upload-button-background-color);
// color: var(--theme-upload-button-text-color);
// text-overflow: ellipsis;
// display: flex;
// padding: 0;
// margin-left: 12px;
// }
}

138
projects/aca-content/src/lib/components/header-actions/header-actions.component.spec.ts
View File

@@ -17,93 +17,125 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { AppTestingModule } from '../../testing/app-testing.module'; import { AppTestingModule } from '../../testing/app-testing.module';
import { HeaderActionsComponent } from './header-actions.component'; import { HeaderActionsComponent } from './header-actions.component'
import { HarnessLoader } from '@angular/cdk/testing'; import { ContentActionType } from '@alfresco/adf-extensions';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed'; import { AppExtensionService } from '@alfresco/aca-shared';
import { MatButtonHarness } from '@angular/material/button/testing'; import { of } from 'rxjs';
import { MatMenuHarness } from '@angular/material/menu/testing';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { MatButtonModule } from '@angular/material/button';
import { MatMenuModule } from '@angular/material/menu';
import { By } from '@angular/platform-browser'; import { By } from '@angular/platform-browser';
import { CoreModule } from '@alfresco/adf-core';
import { AppHeaderActionsModule } from './header-actions.module';
describe('HeaderActionsComponent', () => { describe('HeaderActionsComponent', () => {
let component: HeaderActionsComponent; let component: HeaderActionsComponent;
let fixture: ComponentFixture<HeaderActionsComponent>; let fixture: ComponentFixture<HeaderActionsComponent>;
let loader: HarnessLoader;
let extensionService: AppExtensionService;
let getCreateActionsSpy: jasmine.Spy;
let getUploadActionsSpy: jasmine.Spy;
beforeEach(() => { beforeEach(() => {
TestBed.configureTestingModule({ TestBed.configureTestingModule({
imports: [AppTestingModule, NoopAnimationsModule, MatButtonModule, MatMenuModule], imports: [AppTestingModule, CoreModule.forRoot(), AppHeaderActionsModule],
declarations: [HeaderActionsComponent] declarations: [HeaderActionsComponent]
}); });
fixture = TestBed.createComponent(HeaderActionsComponent); fixture = TestBed.createComponent(HeaderActionsComponent);
component = fixture.componentInstance; component = fixture.componentInstance;
loader = TestbedHarnessEnvironment.loader(fixture); extensionService = TestBed.inject(AppExtensionService);
getCreateActionsSpy = spyOn(extensionService, 'getCreateActions');
getCreateActionsSpy.and.returnValue(
of([
{
id: 'action1',
type: ContentActionType.button,
title: 'create action one'
},
{
id: 'action2',
type: ContentActionType.button,
title: 'create action two'
}
])
);
getUploadActionsSpy = spyOn(extensionService, 'getUploadActions');
getUploadActionsSpy.and.returnValue(
of([
{
id: 'action3',
type: ContentActionType.button,
title: 'upload action one'
}
])
);
fixture = TestBed.createComponent(HeaderActionsComponent);
component = fixture.componentInstance;
fixture.detectChanges();
}); });
it('total number of buttons in header should be 2 if route is personal-files', async () => { it('total number of buttons in header should be 2 if route is personal-files', async () => {
spyOn(component, 'isPersonalFilesRoute').and.returnValue(true); spyOn(component, 'isPersonalFilesRoute').and.returnValue(true);
const buttons = await loader.getAllHarnesses(MatButtonHarness); fixture.detectChanges();
const createButton = await loader.getAllHarnesses(MatButtonHarness.with({text: 'APP.HEADER.BUTTONS.CREATE'}));
const uploadButton = await loader.getAllHarnesses(MatButtonHarness.with({text: 'APP.HEADER.BUTTONS.UPLOAD'})); const buttons = fixture.debugElement.queryAll(By.css('.action-bar > .aca-mat-button'));
const createButton: HTMLButtonElement = fixture.debugElement.query(By.css('[data-automation-id="create-button"]')).nativeElement;
const uploadButton: HTMLButtonElement = fixture.debugElement.query(By.css('[data-automation-id="upload-button"]')).nativeElement;
expect(buttons.length).toBe(2); expect(buttons.length).toBe(2);
expect(createButton.length).toBe(1); expect(createButton).toBeTruthy();
expect(uploadButton.length).toBe(1); expect(uploadButton).toBeTruthy();
}); });
it('total number of buttons in header should be 1 if route is libraries', async () => { it('total number of buttons in header should be 1 if route is libraries', async () => {
spyOn(component, 'isLibrariesRoute').and.returnValue(true); spyOn(component, 'isLibrariesRoute').and.returnValue(true);
const buttons = await loader.getAllHarnesses(MatButtonHarness); fixture.detectChanges();
const createButton = await loader.getAllHarnesses(MatButtonHarness.with({text: 'APP.HEADER.BUTTONS.CREATE'}));
const buttons = fixture.debugElement.queryAll(By.css('.action-bar > .aca-mat-button'));
const createButton: HTMLButtonElement = fixture.debugElement.query(By.css('[data-automation-id="create-button"]')).nativeElement;
expect(buttons.length).toBe(1); expect(buttons.length).toBe(1);
expect(createButton.length).toBe(1); expect(createButton).toBeTruthy();
}); });
it('should open and close the create menu', async () => { async function clickCreateMenu() {
fixture.detectChanges();
await fixture.whenStable();
const button: HTMLButtonElement = fixture.debugElement.query(By.css('[data-automation-id="create-button"]')).nativeElement;
button.click();
}
async function clickUploadMenu() {
fixture.detectChanges();
await fixture.whenStable();
const button: HTMLButtonElement = fixture.debugElement.query(By.css('[data-automation-id="upload-button"]')).nativeElement;
button.click();
}
it('should render menu items when create menu is opened' , async () => {
spyOn(component, 'isPersonalFilesRoute').and.returnValue(true); spyOn(component, 'isPersonalFilesRoute').and.returnValue(true);
const createMenu = await loader.getHarness(MatMenuHarness.with({ triggerText: 'APP.HEADER.BUTTONS.CREATE' })); await clickCreateMenu();
expect(await createMenu.isOpen()).toBe(false); const menuItems = fixture.debugElement.queryAll(By.css('.app-toolbar-menu-item'));
await createMenu.open(); expect(menuItems.length).toBe(2);
expect(await createMenu.isOpen()).toBe(true);
await createMenu.close(); const menuItemOne: HTMLSpanElement = (menuItems[0].nativeElement as HTMLButtonElement).querySelector('[data-automation-id="menu-item-title"]');
expect(await createMenu.isOpen()).toBe(false); const menuItemTwo: HTMLSpanElement = (menuItems[1].nativeElement as HTMLButtonElement).querySelector('[data-automation-id="menu-item-title"]');
expect(menuItemOne.innerText).toBe('create action one');
expect(menuItemTwo.innerText).toBe('create action two');
}); });
it('should open and close the upload menu', async () => { it('should render menu items when upload menu is opened', async () => {
spyOn(component, 'isPersonalFilesRoute').and.returnValue(true); spyOn(component, 'isPersonalFilesRoute').and.returnValue(true);
const uploadMenu = await loader.getHarness(MatMenuHarness.with({ triggerText: 'APP.HEADER.BUTTONS.UPLOAD' })); await clickUploadMenu();
expect(await uploadMenu.isOpen()).toBe(false); const menuItems = fixture.debugElement.queryAll(By.css('.app-toolbar-menu-item'));
await uploadMenu.open(); expect(menuItems.length).toBe(1);
expect(await uploadMenu.isOpen()).toBe(true);
await uploadMenu.close(); const menuItemOne: HTMLSpanElement = (menuItems[0].nativeElement as HTMLButtonElement).querySelector('[data-automation-id="menu-item-title"]');
expect(await uploadMenu.isOpen()).toBe(false); expect(menuItemOne.innerText).toBe('upload action one');
});
it('should load create menu on click of create button', async () => {
spyOn(component, 'isPersonalFilesRoute').and.returnValue(true);
const buttons = await loader.getHarness(MatButtonHarness.with({ selector: '.aca-create-button' }));
buttons.click();
const createMenu = fixture.debugElement.queryAll(By.css('.app-create-menu__root-menu app-create-menu__sub-menu'));
expect(createMenu).toBeTruthy();
});
it('should load upload menu on click of upload button', async () => {
spyOn(component, 'isPersonalFilesRoute').and.returnValue(true);
const buttons = await loader.getHarness(MatButtonHarness.with({ selector: '.aca-upload-button' }));
buttons.click();
const uploadMenu = fixture.debugElement.queryAll(By.css('.app-upload-menu__root-menu app-upload-menu__sub-menu'));
expect(uploadMenu).toBeTruthy();
}); });
}); });

8
projects/aca-content/src/lib/components/header-actions/header-actions.component.ts
View File

@@ -85,12 +85,4 @@ export class HeaderActionsComponent extends PageComponent implements OnInit, OnD
return false; return false;
} }
} }
isTasksRoute(): boolean {
return this.router.url.includes('/tasks');
}
isProcessesRoute(): boolean {
return this.router.url.includes('/processes');
}
} }

11
projects/aca-shared/src/lib/components/document-base-page/document-base-page.component.ts
View File

@@ -25,7 +25,7 @@
import { DocumentListComponent, ShareDataRow } from '@alfresco/adf-content-services'; import { DocumentListComponent, ShareDataRow } from '@alfresco/adf-content-services';
import { ShowHeaderMode } from '@alfresco/adf-core'; import { ShowHeaderMode } from '@alfresco/adf-core';
import { ContentActionRef, ContentActionType, DocumentListPresetRef, SelectionState } from '@alfresco/adf-extensions'; import { ContentActionRef, DocumentListPresetRef, SelectionState } from '@alfresco/adf-extensions';
import { OnDestroy, OnInit, OnChanges, ViewChild, SimpleChanges, Directive } from '@angular/core'; import { OnDestroy, OnInit, OnChanges, ViewChild, SimpleChanges, Directive } from '@angular/core';
import { Store } from '@ngrx/store'; import { Store } from '@ngrx/store';
import { MinimalNodeEntity, MinimalNodeEntryEntity, NodePaging } from '@alfresco/js-api'; import { MinimalNodeEntity, MinimalNodeEntryEntity, NodePaging } from '@alfresco/js-api';
@@ -70,15 +70,12 @@ export abstract class PageComponent implements OnInit, OnDestroy, OnChanges {
filterSorting = 'name-asc'; filterSorting = 'name-asc';
createActions: Array<ContentActionRef> = []; createActions: Array<ContentActionRef> = [];
uploadActions: Array<ContentActionRef> = []; uploadActions: Array<ContentActionRef> = [];
mainAction$: Observable<ContentActionRef>;
actionTypes = ContentActionType;
protected subscriptions: Subscription[] = []; protected subscriptions: Subscription[] = [];
protected constructor(protected store: Store<AppStore>, protected extensions: AppExtensionService, protected content: DocumentBasePageService) {} protected constructor(protected store: Store<AppStore>, protected extensions: AppExtensionService, protected content: DocumentBasePageService) {}
ngOnInit() { ngOnInit() {
this.mainAction$ = this.extensions.getMainAction().pipe(takeUntil(this.onDestroy$));
this.extensions this.extensions
.getCreateActions() .getCreateActions()
@@ -93,7 +90,7 @@ export abstract class PageComponent implements OnInit, OnDestroy, OnChanges {
.subscribe((actions) => { .subscribe((actions) => {
this.uploadActions = actions; this.uploadActions = actions;
}); });
this.sharedPreviewUrl$ = this.store.select(getSharedUrl); this.sharedPreviewUrl$ = this.store.select(getSharedUrl);
this.infoDrawerOpened$ = this.store.select(isInfoDrawerOpened).pipe(map((infoDrawerState) => !this.isOutletPreviewUrl() && infoDrawerState)); this.infoDrawerOpened$ = this.store.select(isInfoDrawerOpened).pipe(map((infoDrawerState) => !this.isOutletPreviewUrl() && infoDrawerState));
@@ -144,10 +141,6 @@ export abstract class PageComponent implements OnInit, OnDestroy, OnChanges {
this.store.dispatch(new SetSelectedNodesAction([])); this.store.dispatch(new SetSelectedNodesAction([]));
} }
runAction(action: string): void {
this.extensions.runActionById(action);
}
showPreview(node: MinimalNodeEntity, extras?: ViewNodeExtras) { showPreview(node: MinimalNodeEntity, extras?: ViewNodeExtras) {
if (node && node.entry) { if (node && node.entry) {
let id: string; let id: string;

6
projects/aca-shared/src/lib/components/page-layout/page-layout.component.scss
View File

@@ -11,6 +11,12 @@
background: var(--theme-page-layout-header-background-color); background: var(--theme-page-layout-header-background-color);
border-bottom: 1px solid var(--theme-border-color, rgba(0, 0, 0, 0.07)); border-bottom: 1px solid var(--theme-border-color, rgba(0, 0, 0, 0.07));
padding: 0 24px; padding: 0 24px;
.adf-breadcrumb-item {
font-size: 20px !important;
font-weight: 400 !important;
letter-spacing: 0.15px !important;
}
} }
.aca-page-layout-content { .aca-page-layout-content {