AAE-36614 new provideShell api (#11006)

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`.

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';

lib/core/shell/src/lib/components/shell/shell.component.html

@@ -9,13 +9,14 @@
 >
   <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 }" />
-      </div>
+        @if (!hideSidenav) {
+          <div
+            role="heading"
+            aria-level="1"
+          >
+            <adf-dynamic-component id="app.layout.header" [data]="{ layout }" />
+          </div>
+        }
     </ng-template>
   </adf-sidenav-layout-header>
 

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,

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;
+}

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<ShellModule> {