extra app modules (#596)

* toolbar module * lazy load Settings * fix build * remove duplicate build for e2e * Revert "remove duplicate build for e2e" This reverts commit 94b872239b.
2025-09-17 14:21:14 +00:00 · 2018-09-03 19:28:15 +01:00
parent a278ae149e
commit fa0d10c419
10 changed files with 143 additions and 59 deletions
--- a/src/app/components/toolbar/toolbar-action/toolbar-action.component.html
+++ b/src/app/components/toolbar/toolbar-action/toolbar-action.component.html
@@ -0,0 +1,43 @@
+<ng-container [ngSwitch]="entry.type">
+    <ng-container *ngSwitchCase="'default'">
+        <app-toolbar-button [type]="type" [actionRef]="entry"></app-toolbar-button>
+    </ng-container>
+
+    <ng-container *ngSwitchCase="'button'">
+        <app-toolbar-button [type]="type" [actionRef]="entry"></app-toolbar-button>
+    </ng-container>
+
+    <adf-toolbar-divider *ngSwitchCase="'separator'"
+        [id]="entry.id">
+    </adf-toolbar-divider>
+
+    <ng-container *ngSwitchCase="'menu'">
+        <button
+            [id]="entry.id"
+            color="primary"
+            mat-icon-button
+            [attr.title]="(entry.description || entry.title) | translate"
+            [matMenuTriggerFor]="menu">
+            <mat-icon>{{ entry.icon }}</mat-icon>
+        </button>
+
+        <mat-menu #menu="matMenu"
+            [overlapTrigger]="false">
+            <ng-container *ngFor="let child of entry.children; trackBy: trackByActionId">
+                <ng-container [ngSwitch]="child.type">
+                    <ng-container *ngSwitchCase="'custom'">
+                        <adf-dynamic-component [id]="child.component"></adf-dynamic-component>
+                    </ng-container>
+                    <ng-container *ngSwitchDefault>
+                        <app-toolbar-button type="menu-item" [actionRef]="child"></app-toolbar-button>
+                    </ng-container>
+                </ng-container>
+            </ng-container>
+        </mat-menu>
+    </ng-container>
+
+    <ng-container *ngSwitchCase="'custom'">
+        <adf-dynamic-component [id]="entry.component"></adf-dynamic-component>
+    </ng-container>
+</ng-container>
+
--- a/src/app/components/toolbar/toolbar-action/toolbar-action.component.ts
+++ b/src/app/components/toolbar/toolbar-action/toolbar-action.component.ts
@@ -0,0 +1,56 @@
+/*!
+ * @license
+ * Alfresco Example Content Application
+ *
+ * Copyright (C) 2005 - 2018 Alfresco Software Limited
+ *
+ * This file is part of the Alfresco Example Content Application.
+ * If the software was purchased under a paid Alfresco license, the terms of
+ * the paid license agreement will prevail.  Otherwise, the software is
+ * provided under the following open source license terms:
+ *
+ * The Alfresco Example Content Application is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * The Alfresco Example Content Application is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import {
+    Component,
+    ViewEncapsulation,
+    ChangeDetectionStrategy,
+    Input
+} from '@angular/core';
+import { AppStore } from '../../../store/states';
+import { Store } from '@ngrx/store';
+import { ContentActionRef } from '@alfresco/adf-extensions';
+import { AppExtensionService } from '../../../extensions/extension.service';
+
+@Component({
+    selector: 'aca-toolbar-action',
+    templateUrl: './toolbar-action.component.html',
+    encapsulation: ViewEncapsulation.None,
+    changeDetection: ChangeDetectionStrategy.OnPush,
+    host: { class: 'aca-toolbar-action' }
+})
+export class ToolbarActionComponent {
+    @Input() type = 'icon-button';
+    @Input() entry: ContentActionRef;
+
+    constructor(
+        protected store: Store<AppStore>,
+        protected extensions: AppExtensionService
+    ) {}
+
+    trackByActionId(index: number, action: ContentActionRef) {
+        return action.id;
+    }
+}
--- a/src/app/components/toolbar/toolbar-button/toolbar-button.component.html
+++ b/src/app/components/toolbar/toolbar-button/toolbar-button.component.html
@@ -0,0 +1,28 @@
+<ng-container [ngSwitch]="type">
+    <ng-container *ngSwitchCase="'icon-button'">
+        <button
+            [id]="actionRef.id"
+            mat-icon-button
+            color="primary"
+            [attr.title]="(actionRef.description || actionRef.title) | translate"
+            (click)="runAction()">
+            <mat-icon>{{ actionRef.icon }}</mat-icon>
+        </button>
+    </ng-container>
+    <ng-container *ngSwitchCase="'menu-item'">
+        <button
+            [id]="actionRef.id"
+            mat-menu-item
+            color="primary"
+            [disabled]="actionRef.disabled"
+            [attr.title]="(
+                actionRef.disabled
+                ? actionRef['description-disabled']
+                : actionRef.description || actionRef.title
+            ) | translate"
+            (click)="runAction()">
+            <mat-icon>{{ actionRef.icon }}</mat-icon>
+            <span>{{ actionRef.title | translate }}</span>
+        </button>
+    </ng-container>
+</ng-container>
--- a/src/app/components/toolbar/toolbar-button/toolbar-button.component.ts
+++ b/src/app/components/toolbar/toolbar-button/toolbar-button.component.ts
@@ -0,0 +1,62 @@
+/*!
+ * @license
+ * Alfresco Example Content Application
+ *
+ * Copyright (C) 2005 - 2018 Alfresco Software Limited
+ *
+ * This file is part of the Alfresco Example Content Application.
+ * If the software was purchased under a paid Alfresco license, the terms of
+ * the paid license agreement will prevail.  Otherwise, the software is
+ * provided under the following open source license terms:
+ *
+ * The Alfresco Example Content Application is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * The Alfresco Example Content Application is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import { Component, Input } from '@angular/core';
+import { ContentActionRef } from '@alfresco/adf-extensions';
+import { Store } from '@ngrx/store';
+import { AppStore } from '../../../store/states';
+import { appSelection } from '../../../store/selectors/app.selectors';
+import { take } from 'rxjs/operators';
+import { AppExtensionService } from '../../../extensions/extension.service';
+
+export enum ToolbarButtonType {
+    ICON_BUTTON = 'icon-button',
+    MENU_ITEM = 'menu-item'
+}
+
+@Component({
+    selector: 'app-toolbar-button',
+    templateUrl: 'toolbar-button.component.html'
+})
+export class ToolbarButtonComponent {
+    @Input() type: ToolbarButtonType = ToolbarButtonType.ICON_BUTTON;
+    @Input() actionRef: ContentActionRef;
+
+    constructor(
+        protected store: Store<AppStore>,
+        private extensions: AppExtensionService
+    ) {}
+
+    runAction() {
+        this.store
+            .select(appSelection)
+            .pipe(take(1))
+            .subscribe(selection => {
+                this.extensions.runActionById(this.actionRef.actions.click, {
+                    selection
+                });
+            });
+    }
+}
--- a/src/app/components/toolbar/toolbar.module.ts
+++ b/src/app/components/toolbar/toolbar.module.ts
@@ -0,0 +1,56 @@
+/*!
+ * @license
+ * Alfresco Example Content Application
+ *
+ * Copyright (C) 2005 - 2018 Alfresco Software Limited
+ *
+ * This file is part of the Alfresco Example Content Application.
+ * If the software was purchased under a paid Alfresco license, the terms of
+ * the paid license agreement will prevail.  Otherwise, the software is
+ * provided under the following open source license terms:
+ *
+ * The Alfresco Example Content Application is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * The Alfresco Example Content Application is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import { NgModule } from '@angular/core';
+import { DocumentDisplayModeComponent } from './document-display-mode/document-display-mode.component';
+import { ToggleFavoriteComponent } from './toggle-favorite/toggle-favorite.component';
+import { ToggleInfoDrawerComponent } from './toggle-info-drawer/toggle-info-drawer.component';
+import { CommonModule } from '@angular/common';
+import { CoreModule } from '@alfresco/adf-core';
+import { ToolbarButtonComponent } from './toolbar-button/toolbar-button.component';
+import { ToolbarActionComponent } from './toolbar-action/toolbar-action.component';
+import { ExtensionsModule } from '@alfresco/adf-extensions';
+
+export function components() {
+    return [
+        DocumentDisplayModeComponent,
+        ToggleFavoriteComponent,
+        ToggleInfoDrawerComponent,
+        ToolbarButtonComponent,
+        ToolbarActionComponent
+    ];
+}
+
+@NgModule({
+    imports: [
+        CommonModule,
+        CoreModule.forChild(),
+        ExtensionsModule.forChild()
+    ],
+    declarations: components(),
+    exports: components(),
+    entryComponents: components()
+})
+export class AppToolbarModule {}