mirror of
https://github.com/Alfresco/alfresco-content-app.git
synced 2025-05-12 17:04:46 +00:00
[ACA-3296] Header - support actions order (#1464)
* header action order property * apply sort for parents and children * update tests * use parent class to set style * render user component through configuration * header should allow disable actions rendering * update e2e header resource
This commit is contained in:
parent
523d9e5bcb
commit
234b41b917
@ -908,11 +908,12 @@
|
||||
"description": "Application settings",
|
||||
"icon": "settings",
|
||||
"disabled": true,
|
||||
"order": 10,
|
||||
"actions": {
|
||||
"click": "app.actions.settings"
|
||||
},
|
||||
"rules": {
|
||||
"visible": "app.toolbar.canViewFile"
|
||||
"visible": "app.navigation.isNotTrashcan"
|
||||
}
|
||||
},
|
||||
{
|
||||
@ -920,11 +921,12 @@
|
||||
"title": "New Button",
|
||||
"description": "new button description",
|
||||
"icon": "alarm_on",
|
||||
"order": 20,
|
||||
"actions": {
|
||||
"click": "app.actions.settings"
|
||||
},
|
||||
"rules": {
|
||||
"visible": "app.toolbar.canViewFile"
|
||||
"visible": "app.navigation.isNotTrashcan"
|
||||
}
|
||||
}
|
||||
]
|
||||
|
@ -869,24 +869,118 @@ describe('AppExtensionService', () => {
|
||||
features: {
|
||||
userActions: [
|
||||
{
|
||||
id: 'aca:toolbar/separator-2',
|
||||
id: 'aca:toolbar/action-2',
|
||||
order: 2,
|
||||
type: ContentActionType.separator,
|
||||
type: ContentActionType.button,
|
||||
title: 'action2'
|
||||
},
|
||||
{
|
||||
id: 'aca:toolbar/separator-1',
|
||||
id: 'aca:toolbar/action-1',
|
||||
order: 1,
|
||||
type: ContentActionType.separator,
|
||||
type: ContentActionType.button,
|
||||
title: 'action1'
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
expect(service.userActions.length).toBe(2);
|
||||
expect(service.userActions[0].id).toBe('aca:toolbar/separator-1');
|
||||
expect(service.userActions[1].id).toBe('aca:toolbar/separator-2');
|
||||
const actions = service.getUserActions();
|
||||
expect(actions[0].id).toBe('aca:toolbar/action-1');
|
||||
expect(actions[1].id).toBe('aca:toolbar/action-2');
|
||||
});
|
||||
});
|
||||
|
||||
describe('getHeaderActions', () => {
|
||||
it('should load user actions from the config', () => {
|
||||
applyConfig({
|
||||
$id: 'test',
|
||||
$name: 'test',
|
||||
$version: '1.0.0',
|
||||
$license: 'MIT',
|
||||
$vendor: 'Good company',
|
||||
$runtime: '1.5.0',
|
||||
features: {
|
||||
header: [
|
||||
{
|
||||
id: 'header.action.separator.1',
|
||||
order: 1,
|
||||
type: ContentActionType.separator
|
||||
},
|
||||
{
|
||||
id: 'header.action.separator.2',
|
||||
order: 2,
|
||||
type: ContentActionType.separator
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
expect(service.headerActions.length).toBe(2);
|
||||
});
|
||||
|
||||
it('should sort header actions by order', () => {
|
||||
applyConfig({
|
||||
$id: 'test',
|
||||
$name: 'test',
|
||||
$version: '1.0.0',
|
||||
$license: 'MIT',
|
||||
$vendor: 'Good company',
|
||||
$runtime: '1.5.0',
|
||||
features: {
|
||||
header: [
|
||||
{
|
||||
id: 'header.action.1',
|
||||
order: 2,
|
||||
type: ContentActionType.button
|
||||
},
|
||||
{
|
||||
id: 'header.action.2',
|
||||
order: 1,
|
||||
type: ContentActionType.button
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
const actions = service.getHeaderActions();
|
||||
expect(actions[0].id).toBe('header.action.2');
|
||||
expect(actions[1].id).toBe('header.action.1');
|
||||
});
|
||||
|
||||
it('should sort header menu children actions by order', () => {
|
||||
applyConfig({
|
||||
$id: 'test',
|
||||
$name: 'test',
|
||||
$version: '1.0.0',
|
||||
$license: 'MIT',
|
||||
$vendor: 'Good company',
|
||||
$runtime: '1.5.0',
|
||||
features: {
|
||||
header: [
|
||||
{
|
||||
id: 'header.action.1',
|
||||
order: 1,
|
||||
type: ContentActionType.menu,
|
||||
children: [
|
||||
{
|
||||
id: 'header.action.1',
|
||||
order: 2,
|
||||
type: ContentActionType.button
|
||||
},
|
||||
{
|
||||
id: 'header.action.2',
|
||||
order: 1,
|
||||
type: ContentActionType.button
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
const actions = service.getHeaderActions()[0];
|
||||
expect(actions.children[0].id).toBe('header.action.2');
|
||||
expect(actions.children[1].id).toBe('header.action.1');
|
||||
});
|
||||
});
|
||||
});
|
||||
|
@ -499,7 +499,26 @@ export class AppExtensionService implements RuleContext {
|
||||
}
|
||||
|
||||
getHeaderActions(): Array<ContentActionRef> {
|
||||
return this.headerActions.filter(action => this.filterVisible(action));
|
||||
return this.headerActions
|
||||
.filter(action => this.filterVisible(action))
|
||||
.map(action => {
|
||||
if (action.type === ContentActionType.menu) {
|
||||
const copy = this.copyAction(action);
|
||||
if (copy.children && copy.children.length > 0) {
|
||||
copy.children = copy.children
|
||||
.filter(childAction => this.filterVisible(childAction))
|
||||
.sort(sortByOrder)
|
||||
.reduce(reduceEmptyMenus, [])
|
||||
.reduce(reduceSeparators, []);
|
||||
}
|
||||
return copy;
|
||||
}
|
||||
|
||||
return action;
|
||||
})
|
||||
.sort(sortByOrder)
|
||||
.reduce(reduceEmptyMenus, [])
|
||||
.reduce(reduceSeparators, []);
|
||||
}
|
||||
|
||||
getAllowedContextMenuActions(): Array<ContentActionRef> {
|
||||
|
@ -51,6 +51,7 @@ import { LibrariesComponent } from './components/libraries/libraries.component';
|
||||
import { FavoriteLibrariesComponent } from './components/favorite-libraries/favorite-libraries.component';
|
||||
import { NodeVersionUploadDialogComponent } from './dialogs/node-version-upload/node-version-upload.dialog';
|
||||
import { NodeVersionsDialogComponent } from './dialogs/node-versions/node-versions.dialog';
|
||||
import { CurrentUserComponent } from './components/current-user/current-user.component';
|
||||
|
||||
import { AppStoreModule } from './store/app-store.module';
|
||||
import { MaterialModule } from './material.module';
|
||||
@ -177,7 +178,8 @@ registerLocaleData(localeSv);
|
||||
NodeVersionsDialogComponent,
|
||||
NodeVersionUploadDialogComponent,
|
||||
LibraryDialogComponent,
|
||||
CreateFromTemplateDialogComponent
|
||||
CreateFromTemplateDialogComponent,
|
||||
CurrentUserComponent
|
||||
],
|
||||
bootstrap: [AppComponent]
|
||||
})
|
||||
|
@ -13,8 +13,6 @@
|
||||
|
||||
<adf-toolbar-divider></adf-toolbar-divider>
|
||||
|
||||
<aca-current-user></aca-current-user>
|
||||
|
||||
<ng-container *ngFor="let actionRef of actions; trackBy: trackByActionId">
|
||||
<aca-toolbar-action [actionRef]="actionRef" color="default">
|
||||
</aca-toolbar-action>
|
||||
|
@ -1,9 +1,8 @@
|
||||
@mixin toolbar-actions-theme($theme) {
|
||||
$foreground: map-get($theme, foreground);
|
||||
|
||||
app-toolbar-button,
|
||||
app-toolbar-menu,
|
||||
adf-dynamic-component {
|
||||
.aca-toolbar-action {
|
||||
color: mat-color($foreground, text, 0.72);
|
||||
margin: 0 5px;
|
||||
}
|
||||
}
|
||||
|
@ -52,6 +52,7 @@ import { ToggleSharedComponent } from '../components/common/toggle-shared/toggle
|
||||
import { ViewNodeComponent } from '../components/toolbar/view-node/view-node.component';
|
||||
import { LanguagePickerComponent } from '../components/common/language-picker/language-picker.component';
|
||||
import { LogoutComponent } from '../components/common/logout/logout.component';
|
||||
import { CurrentUserComponent } from '../components/current-user/current-user.component';
|
||||
import { AppExtensionService } from '@alfresco/aca-shared';
|
||||
|
||||
export function setupExtensions(service: AppExtensionService): Function {
|
||||
@ -105,7 +106,8 @@ export class CoreExtensionsModule {
|
||||
'app.toolbar.toggleEditOffline': ToggleEditOfflineComponent,
|
||||
'app.toolbar.viewNode': ViewNodeComponent,
|
||||
'app.languagePicker': LanguagePickerComponent,
|
||||
'app.logout': LogoutComponent
|
||||
'app.logout': LogoutComponent,
|
||||
'app.user': CurrentUserComponent
|
||||
});
|
||||
|
||||
extensions.setAuthGuards({
|
||||
|
@ -38,6 +38,12 @@
|
||||
}
|
||||
],
|
||||
"header": [
|
||||
{
|
||||
"id": "app.header.user",
|
||||
"type": "custom",
|
||||
"component": "app.user",
|
||||
"order": 100
|
||||
},
|
||||
{
|
||||
"id": "app.header.more",
|
||||
"type": "menu",
|
||||
@ -47,6 +53,7 @@
|
||||
"children": [
|
||||
{
|
||||
"id": "app.header.about",
|
||||
"order": 100,
|
||||
"title": "APP.BROWSE.ABOUT.TITLE",
|
||||
"description": "APP.BROWSE.ABOUT.TITLE",
|
||||
"icon": "info",
|
||||
|
Loading…
x
Reference in New Issue
Block a user