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-07-24 17:31:52 +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/app.module.ts
+++ b/src/app/app.module.ts
@@ -56,7 +56,6 @@ import { ContentManagementService } from './services/content-management.service'
 import { NodeActionsService } from './services/node-actions.service';
 import { NodePermissionService } from './services/node-permission.service';
 import { SearchResultsComponent } from './components/search/search-results/search-results.component';
-import { SettingsComponent } from './components/settings/settings.component';
 import { ProfileResolver } from './services/profile.resolver';
 import { ExperimentalGuard } from './services/experimental-guard.service';

@@ -71,11 +70,9 @@ import { PermissionsManagerComponent } from './components/permission-manager/per
 import { AppRouteReuseStrategy } from './app.routes.strategy';
 import { AppInfoDrawerModule } from './components/info-drawer/info.drawer.module';
 import { DirectivesModule } from './directives/directives.module';
-import { ToggleInfoDrawerComponent } from './components/toolbar/toggle-info-drawer/toggle-info-drawer.component';
-import { DocumentDisplayModeComponent } from './components/toolbar/document-display-mode/document-display-mode.component';
-import { ToggleFavoriteComponent } from './components/toolbar/toggle-favorite/toggle-favorite.component';
 import { ContextMenuModule } from './components/context-menu/context-menu.module';
 import { ExtensionsModule } from '@alfresco/adf-extensions';
+import { AppToolbarModule } from './components/toolbar/toolbar.module';

@NgModule({
    imports: [
@@ -97,7 +94,8 @@ import { ExtensionsModule } from '@alfresco/adf-extensions';

        DirectivesModule,
        ContextMenuModule.forRoot(),
-        AppInfoDrawerModule
+        AppInfoDrawerModule,
+        AppToolbarModule
    ],
    declarations: [
        AppComponent,
@@ -122,11 +120,7 @@ import { ExtensionsModule } from '@alfresco/adf-extensions';
        NodePermissionsDialogComponent,
        PermissionsManagerComponent,
        SearchResultsComponent,
-        SettingsComponent,
-        SharedLinkViewComponent,
-        ToggleInfoDrawerComponent,
-        DocumentDisplayModeComponent,
-        ToggleFavoriteComponent
+        SharedLinkViewComponent
    ],
    providers: [
        { provide: RouteReuseStrategy, useClass: AppRouteReuseStrategy },
@@ -149,10 +143,7 @@ import { ExtensionsModule } from '@alfresco/adf-extensions';
    entryComponents: [
        LibraryDialogComponent,
        NodeVersionsDialogComponent,
-        NodePermissionsDialogComponent,
-        ToggleInfoDrawerComponent,
-        DocumentDisplayModeComponent,
-        ToggleFavoriteComponent
+        NodePermissionsDialogComponent
    ],
    bootstrap: [AppComponent]
 })
--- a/src/app/app.routes.ts
+++ b/src/app/app.routes.ts
@@ -39,7 +39,6 @@ import { TrashcanComponent } from './components/trashcan/trashcan.component';
 import { LoginComponent } from './components/login/login.component';
 import { GenericErrorComponent } from './components/generic-error/generic-error.component';
 import { SearchResultsComponent } from './components/search/search-results/search-results.component';
-import { SettingsComponent } from './components/settings/settings.component';

 import { ProfileResolver } from './services/profile.resolver';

@@ -53,7 +52,7 @@ export const APP_ROUTES: Routes = [
    },
    {
        path: 'settings',
-        component: SettingsComponent,
+        loadChildren: 'src/app/components/settings/settings.module#AppSettingsModule',
        data: {
            title: 'Settings'
        }
--- a/src/app/components/preview/preview.module.ts
+++ b/src/app/components/preview/preview.module.ts
@@ -34,6 +34,7 @@ import { AppInfoDrawerModule } from '../info-drawer/info.drawer.module';
 import { PreviewComponent } from './preview.component';
 import { ViewUtilService } from './view-util.service';
 import { PreviewExtensionComponent } from './preview-extension.component';
+import { AppToolbarModule } from '../toolbar/toolbar.module';

 const routes: Routes = [
    {
@@ -50,7 +51,8 @@ const routes: Routes = [
        ContentDirectiveModule,
        DirectivesModule,
        AppInfoDrawerModule,
-        CoreExtensionsModule.forChild()
+        CoreExtensionsModule.forChild(),
+        AppToolbarModule
    ],
    declarations: [
        PreviewComponent,
--- a/src/app/components/settings/settings.module.ts
+++ b/src/app/components/settings/settings.module.ts
@@ -0,0 +1,47 @@
+/*!
+ * @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 { SettingsComponent } from './settings.component';
+import { Routes, RouterModule } from '@angular/router';
+import { CommonModule } from '@angular/common';
+import { CoreModule } from '@alfresco/adf-core';
+
+const routes: Routes = [
+    {
+        path: '',
+        component: SettingsComponent
+    }
+];
+
+@NgModule({
+    imports: [
+        CommonModule,
+        CoreModule.forChild(),
+        RouterModule.forChild(routes)
+    ],
+    declarations: [SettingsComponent]
+})
+export class AppSettingsModule {}
--- a/src/app/components/toolbar/toolbar-action/toolbar-action.component.html
+++ b/src/app/components/toolbar/toolbar-action/toolbar-action.component.html
--- a/src/app/components/toolbar/toolbar-action/toolbar-action.component.ts
+++ b/src/app/components/toolbar/toolbar-action/toolbar-action.component.ts
@@ -31,8 +31,8 @@ import {
 } from '@angular/core';
 import { AppStore } from '../../../store/states';
 import { Store } from '@ngrx/store';
-import { AppExtensionService } from '../../extension.service';
 import { ContentActionRef } from '@alfresco/adf-extensions';
+import { AppExtensionService } from '../../../extensions/extension.service';

@Component({
    selector: 'aca-toolbar-action',
--- 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
@@ -25,11 +25,11 @@

 import { Component, Input } from '@angular/core';
 import { ContentActionRef } from '@alfresco/adf-extensions';
-import { AppExtensionService } from '../../extension.service';
 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',
@@ -38,36 +38,7 @@ export enum ToolbarButtonType {

@Component({
    selector: 'app-toolbar-button',
-    template: `
-        <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>
-    `
+    templateUrl: 'toolbar-button.component.html'
 })
 export class ToolbarButtonComponent {
    @Input() type: ToolbarButtonType = ToolbarButtonType.ICON_BUTTON;
--- 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 {}
--- a/src/app/extensions/core.extensions.module.ts
+++ b/src/app/extensions/core.extensions.module.ts
@@ -28,13 +28,11 @@ import { CommonModule } from '@angular/common';
 import { APP_INITIALIZER, ModuleWithProviders, NgModule } from '@angular/core';
 import { LayoutComponent } from '../components/layout/layout.component';
 import { TrashcanComponent } from '../components/trashcan/trashcan.component';
-import { ToolbarActionComponent } from './components/toolbar/toolbar-action.component';
 import * as app from './evaluators/app.evaluators';
 import * as nav from './evaluators/navigation.evaluators';
 import { AppExtensionService } from './extension.service';
 import { ToggleInfoDrawerComponent } from '../components/toolbar/toggle-info-drawer/toggle-info-drawer.component';
 import { ToggleFavoriteComponent } from '../components/toolbar/toggle-favorite/toggle-favorite.component';
-import { ToolbarButtonComponent } from './components/toolbar/toolbar-button.component';
 import { MetadataTabComponent } from '../components/info-drawer/metadata-tab/metadata-tab.component';
 import { CommentsTabComponent } from '../components/info-drawer/comments-tab/comments-tab.component';
 import { VersionsTabComponent } from '../components/info-drawer/versions-tab/versions-tab.component';
@@ -49,14 +47,6 @@ export function setupExtensions(service: AppExtensionService): Function {
        CommonModule,
        CoreModule.forChild(),
        ExtensionsModule.forChild()
-    ],
-    declarations: [
-        ToolbarActionComponent,
-        ToolbarButtonComponent
-    ],
-    exports: [
-        ToolbarActionComponent,
-        ToolbarButtonComponent
    ]
 })
 export class CoreExtensionsModule {