AAE-36580 bootstrap as standalone app (#4667)

app/src/app/app.components.ts

@@ -25,13 +25,15 @@
 import { Component, ViewEncapsulation } from '@angular/core';
 import { AppService } from '@alfresco/aca-shared';
 import { MatIconRegistry } from '@angular/material/icon';
+import { RouterOutlet } from '@angular/router';
 
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.scss'],
   encapsulation: ViewEncapsulation.None,
-  standalone: false
+  standalone: true,
+  imports: [RouterOutlet]
 })
 export class AppComponent {
   constructor(

app/src/app/app.config.ts

@@ -22,8 +22,7 @@
  * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
  */
 
-import { BrowserModule } from '@angular/platform-browser';
-import { importProvidersFrom, NgModule } from '@angular/core';
+import { importProvidersFrom, ApplicationConfig } from '@angular/core';
 import { provideNoopAnimations, provideAnimations } from '@angular/platform-browser/animations';
 import { AuthGuard, CoreModule, AuthModule, provideTranslations } from '@alfresco/adf-core';
 import { AppService } from '@alfresco/aca-shared';
@@ -46,12 +45,10 @@ import localePl from '@angular/common/locales/pl';
 import localeFi from '@angular/common/locales/fi';
 import localeDa from '@angular/common/locales/da';
 import localeSv from '@angular/common/locales/sv';
-import { RouterModule } from '@angular/router';
-import { AppComponent } from './app.components';
-import { CONTENT_LAYOUT_ROUTES, ContentServiceExtensionModule, ContentUrlService, CoreExtensionsModule } from '@alfresco/aca-content';
+import { provideRouter, withHashLocation } from '@angular/router';
+import { CONTENT_LAYOUT_ROUTES, ContentServiceExtensionModule, ContentUrlService, provideExtensions } from '@alfresco/aca-content';
 import { ContentVersionService } from '@alfresco/adf-content-services';
 import { SHELL_APP_SERVICE, SHELL_AUTH_TOKEN, provideShellRoutes } from '@alfresco/adf-core/shell';
-import { StoreDevtoolsModule } from '@ngrx/store-devtools';
 import { APP_ROUTES } from './app.routes';
 
 registerLocaleData(localeFr);
@@ -71,20 +68,11 @@ registerLocaleData(localeFi);
 registerLocaleData(localeDa);
 registerLocaleData(localeSv);
 
-@NgModule({
-  imports: [
-    BrowserModule,
-    CoreModule.forRoot(),
-    CoreExtensionsModule.forRoot(),
-    !environment.production ? StoreDevtoolsModule.instrument({ maxAge: 25 }) : [],
-    RouterModule.forRoot(APP_ROUTES, {
-      useHash: true,
-      enableTracing: false // enable for debug only
-    }),
-    AppExtensionsModule,
-    ContentServiceExtensionModule
-  ],
+export const AppConfig: ApplicationConfig = {
   providers: [
+    importProvidersFrom(CoreModule.forRoot(), AppExtensionsModule, ContentServiceExtensionModule),
+    provideExtensions(),
+    provideRouter(APP_ROUTES, withHashLocation()),
     environment.e2e ? provideNoopAnimations() : provideAnimations(),
     provideShellRoutes(CONTENT_LAYOUT_ROUTES),
     { provide: ContentVersionService, useClass: ContentUrlService },
@@ -98,8 +86,5 @@ registerLocaleData(localeSv);
     },
     provideTranslations('app', 'assets'),
     importProvidersFrom(AuthModule.forRoot({ useHash: true }))
-  ],
-  declarations: [AppComponent],
-  bootstrap: [AppComponent]
-})
-export class AppModule {}
+  ]
+};

app/src/main.ts

@@ -23,13 +23,15 @@
  */
 
 import { enableProdMode } from '@angular/core';
-import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-
-import { AppModule } from './app/app.module';
 import { environment } from './environments/environment';
+import { bootstrapApplication } from '@angular/platform-browser';
+import { AppComponent } from './app/app.components';
+import { AppConfig } from './app/app.config';
 
 if (environment.production) {
   enableProdMode();
 }
 
-void platformBrowserDynamic().bootstrapModule(AppModule);
+void (async () => {
+  await bootstrapApplication(AppComponent, AppConfig);
+})();