From 421ba9a9267081c1ffb1566af73eb1f94c9c086e Mon Sep 17 00:00:00 2001 From: David Requeno Date: Sun, 2 Nov 2025 17:43:58 -0600 Subject: [PATCH] Task/migrate app component to standalone --- apps/client/src/app/app.component.ts | 12 ++-- apps/client/src/app/app.module.ts | 83 ---------------------------- apps/client/src/main.ts | 77 +++++++++++++++++++++++--- 3 files changed, 76 insertions(+), 96 deletions(-) delete mode 100644 apps/client/src/app/app.module.ts diff --git a/apps/client/src/app/app.component.ts b/apps/client/src/app/app.component.ts index 5ecb7bf8b..3e9bec58b 100644 --- a/apps/client/src/app/app.component.ts +++ b/apps/client/src/app/app.component.ts @@ -1,5 +1,3 @@ -import { GfHoldingDetailDialogComponent } from '@ghostfolio/client/components/holding-detail-dialog/holding-detail-dialog.component'; -import { HoldingDetailDialogParams } from '@ghostfolio/client/components/holding-detail-dialog/interfaces/interfaces'; import { getCssVariable } from '@ghostfolio/common/helper'; import { InfoItem, User } from '@ghostfolio/common/interfaces'; import { hasPermission, permissions } from '@ghostfolio/common/permissions'; @@ -22,7 +20,9 @@ import { ActivatedRoute, NavigationEnd, PRIMARY_OUTLET, - Router + Router, + RouterLink, + RouterOutlet } from '@angular/router'; import { DataSource } from '@prisma/client'; import { addIcons } from 'ionicons'; @@ -31,6 +31,10 @@ import { DeviceDetectorService } from 'ngx-device-detector'; import { Subject } from 'rxjs'; import { filter, takeUntil } from 'rxjs/operators'; +import { GfFooterComponent } from './components/footer/footer.component'; +import { GfHeaderComponent } from './components/header/header.component'; +import { GfHoldingDetailDialogComponent } from './components/holding-detail-dialog/holding-detail-dialog.component'; +import { HoldingDetailDialogParams } from './components/holding-detail-dialog/interfaces/interfaces'; import { NotificationService } from './core/notification/notification.service'; import { DataService } from './services/data.service'; import { ImpersonationStorageService } from './services/impersonation-storage.service'; @@ -42,7 +46,7 @@ import { UserService } from './services/user/user.service'; changeDetection: ChangeDetectionStrategy.OnPush, templateUrl: './app.component.html', styleUrls: ['./app.component.scss'], - standalone: false + imports: [RouterOutlet, RouterLink, GfHeaderComponent, GfFooterComponent] }) export class AppComponent implements OnDestroy, OnInit { @HostBinding('class.has-info-message') get getHasMessage() { diff --git a/apps/client/src/app/app.module.ts b/apps/client/src/app/app.module.ts deleted file mode 100644 index 63de8fca7..000000000 --- a/apps/client/src/app/app.module.ts +++ /dev/null @@ -1,83 +0,0 @@ -import { Platform } from '@angular/cdk/platform'; -import { - provideHttpClient, - withInterceptorsFromDi -} from '@angular/common/http'; -import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core'; -import { MatAutocompleteModule } from '@angular/material/autocomplete'; -import { MatChipsModule } from '@angular/material/chips'; -import { - DateAdapter, - MAT_DATE_FORMATS, - MAT_DATE_LOCALE, - MatNativeDateModule -} from '@angular/material/core'; -import { MatSnackBarModule } from '@angular/material/snack-bar'; -import { MatTooltipModule } from '@angular/material/tooltip'; -import { BrowserModule } from '@angular/platform-browser'; -import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; -import { ServiceWorkerModule } from '@angular/service-worker'; -import { provideIonicAngular } from '@ionic/angular/standalone'; -import { provideMarkdown } from 'ngx-markdown'; -import { provideNgxSkeletonLoader } from 'ngx-skeleton-loader'; -import { NgxStripeModule, STRIPE_PUBLISHABLE_KEY } from 'ngx-stripe'; - -import { environment } from '../environments/environment'; -import { CustomDateAdapter } from './adapter/custom-date-adapter'; -import { DateFormats } from './adapter/date-formats'; -import { AppRoutingModule } from './app-routing.module'; -import { AppComponent } from './app.component'; -import { GfFooterComponent } from './components/footer/footer.component'; -import { GfHeaderComponent } from './components/header/header.component'; -import { authInterceptorProviders } from './core/auth.interceptor'; -import { httpResponseInterceptorProviders } from './core/http-response.interceptor'; -import { LanguageService } from './core/language.service'; -import { GfNotificationModule } from './core/notification/notification.module'; - -export function NgxStripeFactory(): string { - return environment.stripePublicKey; -} - -@NgModule({ - bootstrap: [AppComponent], - declarations: [AppComponent], - imports: [ - AppRoutingModule, - BrowserAnimationsModule, - BrowserModule, - GfFooterComponent, - GfHeaderComponent, - GfNotificationModule, - MatAutocompleteModule, - MatChipsModule, - MatNativeDateModule, - MatSnackBarModule, - MatTooltipModule, - NgxStripeModule.forRoot(environment.stripePublicKey), - ServiceWorkerModule.register('ngsw-worker.js', { - enabled: environment.production, - registrationStrategy: 'registerImmediately' - }) - ], - providers: [ - authInterceptorProviders, - httpResponseInterceptorProviders, - LanguageService, - provideHttpClient(withInterceptorsFromDi()), - provideIonicAngular(), - provideMarkdown(), - provideNgxSkeletonLoader(), - { - provide: DateAdapter, - useClass: CustomDateAdapter, - deps: [LanguageService, MAT_DATE_LOCALE, Platform] - }, - { provide: MAT_DATE_FORMATS, useValue: DateFormats }, - { - provide: STRIPE_PUBLISHABLE_KEY, - useFactory: NgxStripeFactory - } - ], - schemas: [CUSTOM_ELEMENTS_SCHEMA] -}) -export class AppModule {} diff --git a/apps/client/src/main.ts b/apps/client/src/main.ts index 96d6c0582..0e2104c76 100644 --- a/apps/client/src/main.ts +++ b/apps/client/src/main.ts @@ -2,11 +2,38 @@ import { locale } from '@ghostfolio/common/config'; import { InfoResponse } from '@ghostfolio/common/interfaces'; import { filterGlobalPermissions } from '@ghostfolio/common/permissions'; -import { enableProdMode } from '@angular/core'; -import { LOCALE_ID } from '@angular/core'; -import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; +import { Platform } from '@angular/cdk/platform'; +import { + provideHttpClient, + withInterceptorsFromDi +} from '@angular/common/http'; +import { enableProdMode, importProvidersFrom, LOCALE_ID } from '@angular/core'; +import { MatAutocompleteModule } from '@angular/material/autocomplete'; +import { MatChipsModule } from '@angular/material/chips'; +import { + DateAdapter, + MAT_DATE_FORMATS, + MAT_DATE_LOCALE, + MatNativeDateModule +} from '@angular/material/core'; +import { MatSnackBarModule } from '@angular/material/snack-bar'; +import { MatTooltipModule } from '@angular/material/tooltip'; +import { bootstrapApplication } from '@angular/platform-browser'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { ServiceWorkerModule } from '@angular/service-worker'; +import { provideIonicAngular } from '@ionic/angular/standalone'; +import { provideMarkdown } from 'ngx-markdown'; +import { provideNgxSkeletonLoader } from 'ngx-skeleton-loader'; +import { NgxStripeModule, STRIPE_PUBLISHABLE_KEY } from 'ngx-stripe'; -import { AppModule } from './app/app.module'; +import { CustomDateAdapter } from './app/adapter/custom-date-adapter'; +import { DateFormats } from './app/adapter/date-formats'; +import { AppRoutingModule } from './app/app-routing.module'; +import { AppComponent } from './app/app.component'; +import { authInterceptorProviders } from './app/core/auth.interceptor'; +import { httpResponseInterceptorProviders } from './app/core/http-response.interceptor'; +import { LanguageService } from './app/core/language.service'; +import { GfNotificationModule } from './app/core/notification/notification.module'; import { environment } from './environments/environment'; (async () => { @@ -29,9 +56,41 @@ import { environment } from './environments/environment'; enableProdMode(); } - platformBrowserDynamic() - .bootstrapModule(AppModule, { - providers: [{ provide: LOCALE_ID, useValue: locale }] - }) - .catch((error) => console.error(error)); + await bootstrapApplication(AppComponent, { + providers: [ + { provide: LOCALE_ID, useValue: locale }, + authInterceptorProviders, + httpResponseInterceptorProviders, + LanguageService, + provideHttpClient(withInterceptorsFromDi()), + provideIonicAngular(), + provideMarkdown(), + provideNgxSkeletonLoader(), + { + provide: DateAdapter, + useClass: CustomDateAdapter, + deps: [LanguageService, MAT_DATE_LOCALE, Platform] + }, + { provide: MAT_DATE_FORMATS, useValue: DateFormats }, + { + provide: STRIPE_PUBLISHABLE_KEY, + useFactory: () => environment.stripePublicKey + }, + importProvidersFrom( + AppRoutingModule, + BrowserAnimationsModule, + MatAutocompleteModule, + MatChipsModule, + MatNativeDateModule, + MatSnackBarModule, + MatTooltipModule, + NgxStripeModule.forRoot(environment.stripePublicKey), + ServiceWorkerModule.register('ngsw-worker.js', { + enabled: environment.production, + registrationStrategy: 'registerImmediately' + }), + GfNotificationModule + ) + ] + }); })();