mirror of
https://github.com/Alfresco/alfresco-content-app.git
synced 2025-05-12 17:04:46 +00:00
[AAE-10533] Replace shell with adf-shell (#2806)
* [AAE-10533] Use shell from ADF * Remove shell.md
This commit is contained in:
Bartosz Sekuła
GitHub
parent
60ba8eb6ce
commit
ed20971962
@ -1,72 +0,0 @@
|
|||||||
/*
|
|
||||||
* Copyright © 2005 - 2021 Alfresco Software, Ltd. All rights reserved.
|
|
||||||
*
|
|
||||||
* License rights for this program may be obtained from Alfresco Software, Ltd.
|
|
||||||
* pursuant to a written agreement and any use of this program without such an
|
|
||||||
* agreement is prohibited.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import { ModuleWithProviders, NgModule } from '@angular/core';
|
|
||||||
import { Routes, provideRoutes, RouterModule, Route } from '@angular/router';
|
|
||||||
import { SHELL_LAYOUT_ROUTE } from './app-shell.routes';
|
|
||||||
import { SidenavLayoutModule } from '@alfresco/adf-core';
|
|
||||||
import { ExtensionsModule } from '@alfresco/adf-extensions';
|
|
||||||
import { ShellLayoutComponent } from './components/shell/shell.component';
|
|
||||||
|
|
||||||
export interface AppShellRoutesConfig {
|
|
||||||
shellParentRoute?: Route;
|
|
||||||
shellChildren: Routes;
|
|
||||||
}
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
imports: [SidenavLayoutModule, ExtensionsModule, RouterModule.forChild([]), CommonModule],
|
|
||||||
exports: [ShellLayoutComponent],
|
|
||||||
declarations: [ShellLayoutComponent]
|
|
||||||
})
|
|
||||||
export class AppShellModule {
|
|
||||||
static withRoutes(routes: Routes | AppShellRoutesConfig): ModuleWithProviders<AppShellModule> {
|
|
||||||
if (Array.isArray(routes)) {
|
|
||||||
return getModuleForRoutes(routes);
|
|
||||||
}
|
|
||||||
|
|
||||||
return getModuleForRouteConfig(routes);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function getModuleForRoutes(routes: Routes): ModuleWithProviders<AppShellModule> {
|
|
||||||
const shellLayoutRoute = SHELL_LAYOUT_ROUTE;
|
|
||||||
|
|
||||||
routes.forEach((childRoute) => {
|
|
||||||
shellLayoutRoute.children.push(childRoute);
|
|
||||||
});
|
|
||||||
|
|
||||||
return {
|
|
||||||
ngModule: AppShellModule,
|
|
||||||
providers: provideRoutes([shellLayoutRoute])
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
function getModuleForRouteConfig(config: AppShellRoutesConfig): ModuleWithProviders<AppShellModule> {
|
|
||||||
const shellLayoutRoute = SHELL_LAYOUT_ROUTE;
|
|
||||||
|
|
||||||
const shellParentRoute = config.shellParentRoute;
|
|
||||||
const shellChildrenRoutes = config.shellChildren;
|
|
||||||
|
|
||||||
shellLayoutRoute.children.push(...shellChildrenRoutes);
|
|
||||||
|
|
||||||
const rootRoute = shellParentRoute ? shellParentRoute : shellLayoutRoute;
|
|
||||||
|
|
||||||
if (config.shellParentRoute) {
|
|
||||||
if (rootRoute.children === undefined) {
|
|
||||||
rootRoute.children = [];
|
|
||||||
}
|
|
||||||
|
|
||||||
rootRoute.children.push(shellLayoutRoute);
|
|
||||||
}
|
|
||||||
|
|
||||||
return {
|
|
||||||
ngModule: AppShellModule,
|
|
||||||
providers: provideRoutes([rootRoute])
|
|
||||||
};
|
|
||||||
}
|
|
||||||
@ -1,20 +0,0 @@
|
|||||||
/*
|
|
||||||
* Copyright © 2005 - 2021 Alfresco Software, Ltd. All rights reserved.
|
|
||||||
*
|
|
||||||
* License rights for this program may be obtained from Alfresco Software, Ltd.
|
|
||||||
* pursuant to a written agreement and any use of this program without such an
|
|
||||||
* agreement is prohibited.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import { InjectionToken } from '@angular/core';
|
|
||||||
import { CanActivate, CanActivateChild, Route } from '@angular/router';
|
|
||||||
import { ShellLayoutComponent } from './components/shell/shell.component';
|
|
||||||
|
|
||||||
export const SHELL_AUTH_TOKEN = new InjectionToken<CanActivate & CanActivateChild>('SHELL_AUTH_TOKEN');
|
|
||||||
|
|
||||||
export const SHELL_LAYOUT_ROUTE: Route = {
|
|
||||||
path: '',
|
|
||||||
component: ShellLayoutComponent,
|
|
||||||
canActivate: [SHELL_AUTH_TOKEN],
|
|
||||||
children: []
|
|
||||||
};
|
|
||||||
@ -1,48 +0,0 @@
|
|||||||
<adf-sidenav-layout
|
|
||||||
#layout
|
|
||||||
[sidenavMin]="70"
|
|
||||||
[sidenavMax]="320"
|
|
||||||
[stepOver]="600"
|
|
||||||
[hideSidenav]="hideSidenav"
|
|
||||||
[expandedSidenav]="expandedSidenav"
|
|
||||||
(expanded)="onExpanded($event)"
|
|
||||||
>
|
|
||||||
<adf-sidenav-layout-header>
|
|
||||||
<ng-template let-isMenuMinimized="isMenuMinimized">
|
|
||||||
<div
|
|
||||||
role="heading"
|
|
||||||
aria-level="1"
|
|
||||||
*ngIf="!hideSidenav"
|
|
||||||
>
|
|
||||||
<adf-dynamic-component id="app.layout.header" [data]="{ layout }">
|
|
||||||
</adf-dynamic-component>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
</adf-sidenav-layout-header>
|
|
||||||
|
|
||||||
<adf-sidenav-layout-navigation>
|
|
||||||
<ng-template let-isMenuMinimized="isMenuMinimized">
|
|
||||||
<div
|
|
||||||
(swipeleft)="hideMenu($event)"
|
|
||||||
[attr.data-automation-id]="isMenuMinimized() ? 'collapsed' : 'expanded'"
|
|
||||||
>
|
|
||||||
<adf-dynamic-component
|
|
||||||
id="app.layout.sidenav"
|
|
||||||
[data]="{ mode: layout.isMenuMinimized ? 'collapsed' : 'expanded'}"
|
|
||||||
>
|
|
||||||
</adf-dynamic-component>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
</adf-sidenav-layout-navigation>
|
|
||||||
|
|
||||||
<adf-sidenav-layout-content>
|
|
||||||
<ng-template>
|
|
||||||
<router-outlet></router-outlet>
|
|
||||||
</ng-template>
|
|
||||||
</adf-sidenav-layout-content>
|
|
||||||
</adf-sidenav-layout>
|
|
||||||
|
|
||||||
<adf-dynamic-component id="app.shell.sibling">
|
|
||||||
</adf-dynamic-component>
|
|
||||||
|
|
||||||
<router-outlet name="viewer"></router-outlet>
|
|
||||||
@ -1,34 +0,0 @@
|
|||||||
.app-shell {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
flex: 1;
|
|
||||||
height: 100%;
|
|
||||||
overflow: hidden;
|
|
||||||
min-height: 0;
|
|
||||||
|
|
||||||
router-outlet[name='viewer'] + * {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 999;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
right: 0;
|
|
||||||
background-color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
adf-file-uploading-dialog {
|
|
||||||
z-index: 1000;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 599px) {
|
|
||||||
.adf-app-title {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 719px) {
|
|
||||||
.adf-app-logo {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,169 +0,0 @@
|
|||||||
/*
|
|
||||||
* Copyright © 2005 - 2021 Alfresco Software, Ltd. All rights reserved.
|
|
||||||
*
|
|
||||||
* License rights for this program may be obtained from Alfresco Software, Ltd.
|
|
||||||
* pursuant to a written agreement and any use of this program without such an
|
|
||||||
* agreement is prohibited.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import { NO_ERRORS_SCHEMA } from '@angular/core';
|
|
||||||
import { TestBed, ComponentFixture } from '@angular/core/testing';
|
|
||||||
import { AppConfigService, SidenavLayoutModule } from '@alfresco/adf-core';
|
|
||||||
import { ShellLayoutComponent } from './shell.component';
|
|
||||||
import { Store } from '@ngrx/store';
|
|
||||||
import { Router, NavigationStart, RouterModule } from '@angular/router';
|
|
||||||
import { of, Subject } from 'rxjs';
|
|
||||||
import { ExtensionsModule } from '@alfresco/adf-extensions';
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import { ShellAppService, SHELL_APP_SERVICE } from '../../services/shell-app.service';
|
|
||||||
import { HttpClientModule } from '@angular/common/http';
|
|
||||||
import { TranslateService } from '@ngx-translate/core';
|
|
||||||
import { TranslateServiceMock } from '@alfresco/aca-shared';
|
|
||||||
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
|
|
||||||
|
|
||||||
class MockRouter {
|
|
||||||
private url = 'some-url';
|
|
||||||
private subject = new Subject();
|
|
||||||
events = this.subject.asObservable();
|
|
||||||
routerState = { snapshot: { url: this.url } };
|
|
||||||
|
|
||||||
navigateByUrl(url: string) {
|
|
||||||
const navigationStart = new NavigationStart(0, url);
|
|
||||||
this.subject.next(navigationStart);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
describe('AppLayoutComponent', () => {
|
|
||||||
let fixture: ComponentFixture<ShellLayoutComponent>;
|
|
||||||
let component: ShellLayoutComponent;
|
|
||||||
let appConfig: AppConfigService;
|
|
||||||
let shellAppService: ShellAppService;
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
const shellService: ShellAppService = {
|
|
||||||
pageHeading$: of('Title'),
|
|
||||||
hideSidenavConditions: [],
|
|
||||||
minimizeSidenavConditions: [],
|
|
||||||
preferencesService: {
|
|
||||||
get: (_key: string) => 'true',
|
|
||||||
set: (_key: string, _value: any) => {}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
imports: [CommonModule, NoopAnimationsModule, HttpClientModule, SidenavLayoutModule, ExtensionsModule, RouterModule.forChild([])],
|
|
||||||
providers: [
|
|
||||||
Store,
|
|
||||||
{
|
|
||||||
provide: Router,
|
|
||||||
useClass: MockRouter
|
|
||||||
},
|
|
||||||
{
|
|
||||||
provide: SHELL_APP_SERVICE,
|
|
||||||
useValue: shellService
|
|
||||||
},
|
|
||||||
{ provide: TranslateService, useClass: TranslateServiceMock }
|
|
||||||
],
|
|
||||||
declarations: [ShellLayoutComponent],
|
|
||||||
schemas: [NO_ERRORS_SCHEMA]
|
|
||||||
});
|
|
||||||
|
|
||||||
fixture = TestBed.createComponent(ShellLayoutComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
appConfig = TestBed.inject(AppConfigService);
|
|
||||||
shellAppService = TestBed.inject(SHELL_APP_SERVICE);
|
|
||||||
});
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
appConfig.config.languages = [];
|
|
||||||
appConfig.config.locale = 'en';
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('sidenav state', () => {
|
|
||||||
it('should get state from configuration', () => {
|
|
||||||
appConfig.config.sideNav = {
|
|
||||||
expandedSidenav: false,
|
|
||||||
preserveState: false
|
|
||||||
};
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(component.expandedSidenav).toBe(false);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should resolve state to true is no configuration', () => {
|
|
||||||
appConfig.config.sidenav = {};
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(component.expandedSidenav).toBe(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should get state from user settings as true', () => {
|
|
||||||
appConfig.config.sideNav = {
|
|
||||||
expandedSidenav: false,
|
|
||||||
preserveState: true
|
|
||||||
};
|
|
||||||
|
|
||||||
spyOn(shellAppService.preferencesService, 'get').and.callFake((key) => {
|
|
||||||
if (key === 'expandedSidenav') {
|
|
||||||
return 'true';
|
|
||||||
}
|
|
||||||
return 'false';
|
|
||||||
});
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(component.expandedSidenav).toBe(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should get state from user settings as false', () => {
|
|
||||||
appConfig.config.sidenav = {
|
|
||||||
expandedSidenav: false,
|
|
||||||
preserveState: true
|
|
||||||
};
|
|
||||||
|
|
||||||
spyOn(shellAppService.preferencesService, 'get').and.callFake((key) => {
|
|
||||||
if (key === 'expandedSidenav') {
|
|
||||||
return 'false';
|
|
||||||
}
|
|
||||||
return 'true';
|
|
||||||
});
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(component.expandedSidenav).toBe(false);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should close menu on mobile screen size', () => {
|
|
||||||
component.minimizeSidenav = false;
|
|
||||||
component.layout.container = {
|
|
||||||
isMobileScreenSize: true,
|
|
||||||
toggleMenu: () => {}
|
|
||||||
};
|
|
||||||
|
|
||||||
spyOn(component.layout.container, 'toggleMenu');
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
component.hideMenu({ preventDefault: () => {} } as any);
|
|
||||||
|
|
||||||
expect(component.layout.container.toggleMenu).toHaveBeenCalled();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should close menu on mobile screen size also when minimizeSidenav true', () => {
|
|
||||||
fixture.detectChanges();
|
|
||||||
component.minimizeSidenav = true;
|
|
||||||
component.layout.container = {
|
|
||||||
isMobileScreenSize: true,
|
|
||||||
toggleMenu: () => {}
|
|
||||||
};
|
|
||||||
|
|
||||||
spyOn(component.layout.container, 'toggleMenu');
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
component.hideMenu({ preventDefault: () => {} } as any);
|
|
||||||
|
|
||||||
expect(component.layout.container.toggleMenu).toHaveBeenCalled();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,123 +0,0 @@
|
|||||||
/*
|
|
||||||
* Copyright © 2005 - 2021 Alfresco Software, Ltd. All rights reserved.
|
|
||||||
*
|
|
||||||
* License rights for this program may be obtained from Alfresco Software, Ltd.
|
|
||||||
* pursuant to a written agreement and any use of this program without such an
|
|
||||||
* agreement is prohibited.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import { AppConfigService, SidenavLayoutComponent } from '@alfresco/adf-core';
|
|
||||||
import { Component, Inject, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
|
|
||||||
import { NavigationEnd, Router } from '@angular/router';
|
|
||||||
import { Subject, Observable } from 'rxjs';
|
|
||||||
import { filter, takeUntil, map, withLatestFrom } from 'rxjs/operators';
|
|
||||||
import { BreakpointObserver } from '@angular/cdk/layout';
|
|
||||||
import { Directionality } from '@angular/cdk/bidi';
|
|
||||||
import { SHELL_APP_SERVICE, ShellAppService } from '../../services/shell-app.service';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-shell',
|
|
||||||
templateUrl: './shell.component.html',
|
|
||||||
styleUrls: ['./shell.component.scss'],
|
|
||||||
encapsulation: ViewEncapsulation.None,
|
|
||||||
host: { class: 'app-shell' }
|
|
||||||
})
|
|
||||||
export class ShellLayoutComponent implements OnInit, OnDestroy {
|
|
||||||
@ViewChild('layout', { static: true })
|
|
||||||
layout: SidenavLayoutComponent;
|
|
||||||
|
|
||||||
onDestroy$: Subject<boolean> = new Subject<boolean>();
|
|
||||||
isSmallScreen$: Observable<boolean>;
|
|
||||||
|
|
||||||
expandedSidenav: boolean;
|
|
||||||
minimizeSidenav = false;
|
|
||||||
hideSidenav = false;
|
|
||||||
direction: Directionality;
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private router: Router,
|
|
||||||
private appConfigService: AppConfigService,
|
|
||||||
private breakpointObserver: BreakpointObserver,
|
|
||||||
@Inject(SHELL_APP_SERVICE) private shellService: ShellAppService
|
|
||||||
) {}
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
this.isSmallScreen$ = this.breakpointObserver.observe(['(max-width: 600px)']).pipe(map((result) => result.matches));
|
|
||||||
|
|
||||||
this.hideSidenav = this.shellService.hideSidenavConditions.some((el) => this.router.routerState.snapshot.url.includes(el));
|
|
||||||
this.minimizeSidenav = this.shellService.minimizeSidenavConditions.some((el) => this.router.routerState.snapshot.url.includes(el));
|
|
||||||
|
|
||||||
if (!this.minimizeSidenav) {
|
|
||||||
this.expandedSidenav = this.getSidenavState();
|
|
||||||
} else {
|
|
||||||
this.expandedSidenav = false;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.router.events
|
|
||||||
.pipe(
|
|
||||||
withLatestFrom(this.isSmallScreen$),
|
|
||||||
filter(([event, isSmallScreen]) => isSmallScreen && event instanceof NavigationEnd),
|
|
||||||
takeUntil(this.onDestroy$)
|
|
||||||
)
|
|
||||||
.subscribe(() => {
|
|
||||||
this.layout.container.sidenav.close();
|
|
||||||
});
|
|
||||||
|
|
||||||
this.router.events
|
|
||||||
.pipe(
|
|
||||||
filter((event) => event instanceof NavigationEnd),
|
|
||||||
takeUntil(this.onDestroy$)
|
|
||||||
)
|
|
||||||
.subscribe((event: NavigationEnd) => {
|
|
||||||
this.minimizeSidenav = this.shellService.minimizeSidenavConditions.some((el) => event.urlAfterRedirects.includes(el));
|
|
||||||
this.hideSidenav = this.shellService.hideSidenavConditions.some((el) => event.urlAfterRedirects.includes(el));
|
|
||||||
|
|
||||||
this.updateState();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnDestroy() {
|
|
||||||
this.onDestroy$.next(true);
|
|
||||||
this.onDestroy$.complete();
|
|
||||||
}
|
|
||||||
|
|
||||||
hideMenu(event: Event) {
|
|
||||||
if (this.layout.container.isMobileScreenSize) {
|
|
||||||
event.preventDefault();
|
|
||||||
this.layout.container.toggleMenu();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
private updateState() {
|
|
||||||
if (this.minimizeSidenav && !this.layout.isMenuMinimized) {
|
|
||||||
this.layout.isMenuMinimized = true;
|
|
||||||
if (!this.layout.container.isMobileScreenSize) {
|
|
||||||
this.layout.container.toggleMenu();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!this.minimizeSidenav) {
|
|
||||||
if (this.getSidenavState() && this.layout.isMenuMinimized) {
|
|
||||||
this.layout.isMenuMinimized = false;
|
|
||||||
this.layout.container.toggleMenu();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onExpanded(state: boolean) {
|
|
||||||
if (!this.minimizeSidenav && this.appConfigService.get('sideNav.preserveState')) {
|
|
||||||
this.shellService.preferencesService.set('expandedSidenav', state);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
private getSidenavState(): boolean {
|
|
||||||
const expand = this.appConfigService.get<boolean>('sideNav.expandedSidenav', true);
|
|
||||||
const preserveState = this.appConfigService.get<boolean>('sideNav.preserveState', true);
|
|
||||||
|
|
||||||
if (preserveState) {
|
|
||||||
return this.shellService.preferencesService.get('expandedSidenav', expand.toString()) === 'true';
|
|
||||||
}
|
|
||||||
|
|
||||||
return expand;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,10 +0,0 @@
|
|||||||
/*
|
|
||||||
* Copyright © 2005 - 2021 Alfresco Software, Ltd. All rights reserved.
|
|
||||||
*
|
|
||||||
* License rights for this program may be obtained from Alfresco Software, Ltd.
|
|
||||||
* pursuant to a written agreement and any use of this program without such an
|
|
||||||
* agreement is prohibited.
|
|
||||||
*/
|
|
||||||
|
|
||||||
export * from './app-shell.module';
|
|
||||||
export * from './services/shell-app.service';
|
|
||||||
@ -1,24 +0,0 @@
|
|||||||
/*
|
|
||||||
* Copyright © 2005 - 2021 Alfresco Software, Ltd. All rights reserved.
|
|
||||||
*
|
|
||||||
* License rights for this program may be obtained from Alfresco Software, Ltd.
|
|
||||||
* pursuant to a written agreement and any use of this program without such an
|
|
||||||
* agreement is prohibited.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import { InjectionToken } from '@angular/core';
|
|
||||||
import { Observable } from 'rxjs';
|
|
||||||
|
|
||||||
export interface ShellPreferencesService {
|
|
||||||
set(preferenceKey: string, value: any): void;
|
|
||||||
get(preferenceKey: string, defaultValue: string): string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface ShellAppService {
|
|
||||||
pageHeading$: Observable<string>;
|
|
||||||
hideSidenavConditions: string[];
|
|
||||||
minimizeSidenavConditions: string[];
|
|
||||||
preferencesService: ShellPreferencesService;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const SHELL_APP_SERVICE = new InjectionToken<ShellAppService>('SHELL_APP_SERVICE');
|
|
||||||
@ -50,11 +50,9 @@ import localePl from '@angular/common/locales/pl';
|
|||||||
import localeFi from '@angular/common/locales/fi';
|
import localeFi from '@angular/common/locales/fi';
|
||||||
import localeDa from '@angular/common/locales/da';
|
import localeDa from '@angular/common/locales/da';
|
||||||
import localeSv from '@angular/common/locales/sv';
|
import localeSv from '@angular/common/locales/sv';
|
||||||
import { AppShellModule, SHELL_APP_SERVICE } from './app-shell';
|
|
||||||
import { TranslateModule } from '@ngx-translate/core';
|
import { TranslateModule } from '@ngx-translate/core';
|
||||||
import { RouterModule } from '@angular/router';
|
import { RouterModule } from '@angular/router';
|
||||||
import { AppComponent } from './app.components';
|
import { AppComponent } from './app.components';
|
||||||
import { SHELL_AUTH_TOKEN } from './app-shell/app-shell.routes';
|
|
||||||
import { CONTENT_LAYOUT_ROUTES } from './content-plugin/content.routes';
|
import { CONTENT_LAYOUT_ROUTES } from './content-plugin/content.routes';
|
||||||
import { ContentServiceExtensionModule } from './content-plugin/content-services-extension.module';
|
import { ContentServiceExtensionModule } from './content-plugin/content-services-extension.module';
|
||||||
import { CoreExtensionsModule } from './extensions/core.extensions.module';
|
import { CoreExtensionsModule } from './extensions/core.extensions.module';
|
||||||
@ -62,6 +60,7 @@ import { INITIAL_APP_STATE } from './content-plugin/store/initial-state';
|
|||||||
import { ContentVersionService } from '@alfresco/adf-content-services';
|
import { ContentVersionService } from '@alfresco/adf-content-services';
|
||||||
import { ContentUrlService } from './content-plugin/services/content-url.service';
|
import { ContentUrlService } from './content-plugin/services/content-url.service';
|
||||||
import { STORE_INITIAL_APP_DATA } from '@alfresco/aca-shared/store';
|
import { STORE_INITIAL_APP_DATA } from '@alfresco/aca-shared/store';
|
||||||
|
import { ShellModule, SHELL_APP_SERVICE, SHELL_AUTH_TOKEN } from '@alfresco/adf-core/shell';
|
||||||
|
|
||||||
registerLocaleData(localeFr);
|
registerLocaleData(localeFr);
|
||||||
registerLocaleData(localeDe);
|
registerLocaleData(localeDe);
|
||||||
@ -94,7 +93,7 @@ registerLocaleData(localeSv);
|
|||||||
relativeLinkResolution: 'legacy'
|
relativeLinkResolution: 'legacy'
|
||||||
}),
|
}),
|
||||||
AppExtensionsModule,
|
AppExtensionsModule,
|
||||||
AppShellModule.withRoutes({
|
ShellModule.withRoutes({
|
||||||
shellChildren: [CONTENT_LAYOUT_ROUTES]
|
shellChildren: [CONTENT_LAYOUT_ROUTES]
|
||||||
}),
|
}),
|
||||||
ContentServiceExtensionModule
|
ContentServiceExtensionModule
|
||||||
|
|||||||
@ -1,17 +0,0 @@
|
|||||||
---
|
|
||||||
Title: Shell
|
|
||||||
---
|
|
||||||
|
|
||||||
# Shell
|
|
||||||
|
|
||||||
[AppShellModule](../../app/src/app/app-shell/app-shell.module.ts) is designated as a main layout for the application.
|
|
||||||
|
|
||||||
I order to attach routes to appShell, `withRoutes(routes: Routes | AppShellRoutesConfig)` method should be used.
|
|
||||||
|
|
||||||
Passed routes are going to be attached to [shell main route](../../app/src/app/app-shell/app-shell.routes.ts)
|
|
||||||
|
|
||||||
If you would like to provide custom app guard, you can provide your own using [SHELL_AUTH_TOKEN](../../app/src/app/app-shell/app-shell.routes.ts)
|
|
||||||
|
|
||||||
## Shell Service
|
|
||||||
|
|
||||||
In order to use `shell`, you need to provide `SHELL_APP_SERVICE` which provides necessary options for shell component to work.
|
|
||||||
@ -24,6 +24,7 @@
|
|||||||
"@alfresco/adf-testing/shared": ["../alfresco-ng2-components/lib/testing/src/lib/shared"],
|
"@alfresco/adf-testing/shared": ["../alfresco-ng2-components/lib/testing/src/lib/shared"],
|
||||||
"@alfresco/adf-core": ["../alfresco-ng2-components/lib/core"],
|
"@alfresco/adf-core": ["../alfresco-ng2-components/lib/core"],
|
||||||
"@alfresco/adf-core/*": ["../alfresco-ng2-components/lib/core/*/public-api.ts"],
|
"@alfresco/adf-core/*": ["../alfresco-ng2-components/lib/core/*/public-api.ts"],
|
||||||
|
"@alfresco/adf-core/shell": ["../alfresco-ng2-components/lib/core/shell/src/index.ts"],
|
||||||
"@alfresco/adf-core/auth": ["../alfresco-ng2-components/lib/core/auth/src/index.ts"],
|
"@alfresco/adf-core/auth": ["../alfresco-ng2-components/lib/core/auth/src/index.ts"],
|
||||||
"@alfresco/adf-extensions": ["../alfresco-ng2-components/lib/extensions"],
|
"@alfresco/adf-extensions": ["../alfresco-ng2-components/lib/extensions"],
|
||||||
"@alfresco/adf-content-services": ["../alfresco-ng2-components/lib/content-services"],
|
"@alfresco/adf-content-services": ["../alfresco-ng2-components/lib/content-services"],
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user