From 7aa07ef5256dc414d0e49d900a63addbcc435672 Mon Sep 17 00:00:00 2001 From: Denys Vuika Date: Mon, 14 Jul 2025 08:21:05 -0400 Subject: [PATCH] AAE-36614 new provideShell api (#11006) --- lib/core/shell/README.md | 14 +++- lib/core/shell/src/index.ts | 1 + .../lib/components/shell/shell.component.html | 15 ++-- .../lib/components/shell/shell.component.ts | 18 ++++- lib/core/shell/src/lib/providers.ts | 68 +++++++++++++++++++ lib/core/shell/src/lib/shell.module.ts | 2 +- 6 files changed, 105 insertions(+), 13 deletions(-) create mode 100644 lib/core/shell/src/lib/providers.ts diff --git a/lib/core/shell/README.md b/lib/core/shell/README.md index 5d8cd6a2b9..dc978b5222 100644 --- a/lib/core/shell/README.md +++ b/lib/core/shell/README.md @@ -9,9 +9,19 @@ This module provides the main layout for the application, allowing you to define Passed routes are going to be attached to shell main route. ```typescript -import { provideShellRoutes } from '@alfresco/adf-core/shell'; +import { provideShell } from '@alfresco/adf-core/shell'; -provideShellRoutes([/*Your Routes*/]) +provideShell( + { + routes: [], + appService: AppService, + authGuard: AuthGuard, + navBar: { + minWidth: 0, + maxWidth: 100 + } + } +) ``` If you would like to provide custom app guard, you can provide your own using `SHELL_AUTH_TOKEN`. diff --git a/lib/core/shell/src/index.ts b/lib/core/shell/src/index.ts index f6c2a6f4cb..a1fefbbc49 100644 --- a/lib/core/shell/src/index.ts +++ b/lib/core/shell/src/index.ts @@ -19,3 +19,4 @@ export * from './lib/shell.module'; export * from './lib/services/shell-app.service'; export * from './lib/components/shell/shell.component'; export * from './lib/shell.routes'; +export * from './lib/providers'; diff --git a/lib/core/shell/src/lib/components/shell/shell.component.html b/lib/core/shell/src/lib/components/shell/shell.component.html index 1473035cb0..5859b800f0 100644 --- a/lib/core/shell/src/lib/components/shell/shell.component.html +++ b/lib/core/shell/src/lib/components/shell/shell.component.html @@ -9,13 +9,14 @@ > -
- -
+ @if (!hideSidenav) { +
+ +
+ } diff --git a/lib/core/shell/src/lib/components/shell/shell.component.ts b/lib/core/shell/src/lib/components/shell/shell.component.ts index 901141b5f7..94998d5288 100644 --- a/lib/core/shell/src/lib/components/shell/shell.component.ts +++ b/lib/core/shell/src/lib/components/shell/shell.component.ts @@ -15,7 +15,13 @@ * limitations under the License. */ -import { AppConfigService, SidenavLayoutComponent, SidenavLayoutModule } from '@alfresco/adf-core'; +import { + AppConfigService, + SidenavLayoutComponent, + SidenavLayoutContentDirective, + SidenavLayoutHeaderDirective, + SidenavLayoutNavigationDirective +} from '@alfresco/adf-core'; import { DynamicExtensionComponent } from '@alfresco/adf-extensions'; import { Component, DestroyRef, inject, Inject, OnInit, Optional, ViewChild, ViewEncapsulation } from '@angular/core'; import { NavigationEnd, Router, RouterModule } from '@angular/router'; @@ -24,12 +30,18 @@ import { filter, map, withLatestFrom } from 'rxjs/operators'; import { BreakpointObserver } from '@angular/cdk/layout'; import { Directionality } from '@angular/cdk/bidi'; import { SHELL_APP_SERVICE, SHELL_NAVBAR_MAX_WIDTH, SHELL_NAVBAR_MIN_WIDTH, ShellAppService } from '../../services/shell-app.service'; -import { CommonModule } from '@angular/common'; import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; @Component({ selector: 'app-shell', - imports: [CommonModule, SidenavLayoutModule, RouterModule, DynamicExtensionComponent], + imports: [ + RouterModule, + SidenavLayoutHeaderDirective, + SidenavLayoutNavigationDirective, + SidenavLayoutContentDirective, + DynamicExtensionComponent, + SidenavLayoutComponent + ], templateUrl: './shell.component.html', styleUrls: ['./shell.component.scss'], encapsulation: ViewEncapsulation.None, diff --git a/lib/core/shell/src/lib/providers.ts b/lib/core/shell/src/lib/providers.ts new file mode 100644 index 0000000000..dcddf0e8cd --- /dev/null +++ b/lib/core/shell/src/lib/providers.ts @@ -0,0 +1,68 @@ +/*! + * @license + * Copyright © 2005-2025 Hyland Software, Inc. and its affiliates. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { EnvironmentProviders, Provider } from '@angular/core'; +import { CanActivateChildFn, CanActivateFn, Routes } from '@angular/router'; +import { AppShellRoutesConfig, provideShellRoutes } from './shell.routes'; +import { SHELL_APP_SERVICE, SHELL_AUTH_TOKEN, SHELL_NAVBAR_MAX_WIDTH, SHELL_NAVBAR_MIN_WIDTH, ShellAppService } from './services/shell-app.service'; + +export interface ProvideShellOpts { + routes: Routes | AppShellRoutesConfig; + appService?: ShellAppService; + authGuard?: CanActivateFn | CanActivateChildFn; + navBar?: { + minWidth: number; + maxWidth: number; + }; +} + +/** + * Provides Shell-related api and providers + * + * @param opts Optional parameters + * @returns list of Angular providers + */ +export function provideShell(opts?: ProvideShellOpts): (Provider | EnvironmentProviders)[] { + const result: (Provider | EnvironmentProviders)[] = [provideShellRoutes(opts?.routes || [])]; + + if (opts?.appService) { + result.push({ + provide: SHELL_APP_SERVICE, + useValue: opts.appService + }); + } + + if (opts?.authGuard) { + result.push({ + provide: SHELL_AUTH_TOKEN, + useValue: opts.authGuard + }); + } + + if (opts?.navBar) { + result.push({ + provide: SHELL_NAVBAR_MIN_WIDTH, + useValue: opts.navBar.minWidth ?? 70 + }); + result.push({ + provide: SHELL_NAVBAR_MAX_WIDTH, + useValue: opts.navBar.maxWidth ?? 320 + }); + } + + return result; +} diff --git a/lib/core/shell/src/lib/shell.module.ts b/lib/core/shell/src/lib/shell.module.ts index a71979fb4e..59ade1e4f5 100644 --- a/lib/core/shell/src/lib/shell.module.ts +++ b/lib/core/shell/src/lib/shell.module.ts @@ -19,7 +19,7 @@ import { ModuleWithProviders, NgModule } from '@angular/core'; import { Routes, provideRouter } from '@angular/router'; import { AppShellRoutesConfig, SHELL_LAYOUT_ROUTE } from './shell.routes'; -/** @deprecated use `provideShellRoutes` instead */ +/** @deprecated use `provideShell` instead */ @NgModule() export class ShellModule { static withRoutes(routes: Routes | AppShellRoutesConfig): ModuleWithProviders {