From 80c04463395434f3b1318163e8c6a41ae0d85f00 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mehmet=20=C3=87etin?= <92744169+mehmetcetin01140@users.noreply.github.com> Date: Tue, 28 Nov 2023 18:53:40 +0300 Subject: [PATCH] app component refactor --- src/app/showcase/layout/app.component.ts | 62 ++++++++++-------------- 1 file changed, 25 insertions(+), 37 deletions(-) diff --git a/src/app/showcase/layout/app.component.ts b/src/app/showcase/layout/app.component.ts index 81d0379a3cc..d75f5cbd60f 100644 --- a/src/app/showcase/layout/app.component.ts +++ b/src/app/showcase/layout/app.component.ts @@ -1,8 +1,8 @@ import { DOCUMENT, isPlatformBrowser } from '@angular/common'; import { HttpClientModule } from '@angular/common/http'; -import { Component, Inject, OnDestroy, OnInit, PLATFORM_ID, Renderer2 } from '@angular/core'; +import { AfterViewInit, Component, Inject, OnDestroy, OnInit, PLATFORM_ID, Renderer2 } from '@angular/core'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; -import { ActivatedRoute, NavigationEnd, Router, RouterOutlet} from '@angular/router'; +import { NavigationEnd, Router, RouterOutlet } from '@angular/router'; import { PrimeNGConfig } from 'primeng/api'; import { Subscription } from 'rxjs'; import { Theme } from '../domain/theme'; @@ -29,38 +29,10 @@ import { AppTopBarComponent } from './topbar/app.topbar.component'; imports: [RouterOutlet, FormsModule, ReactiveFormsModule, HttpClientModule, AppMainComponent, LandingComponent, AppNewsComponent, AppConfigComponent, AppTopBarComponent, AppMenuComponent], providers: [CarService, CountryService, EventService, NodeService, IconService, CustomerService, PhotoService, AppConfigService, ProductService] }) -export class AppComponent implements OnInit, OnDestroy { - constructor(@Inject(DOCUMENT) private document: Document, @Inject(PLATFORM_ID) private platformId: any, private renderer: Renderer2, private primeng: PrimeNGConfig, private configService: AppConfigService, private router: Router, private route: ActivatedRoute) { - if (isPlatformBrowser(platformId) && window && process.env.NODE_ENV === 'production') { - this.injectScripts(); - } - router.events.forEach((event) => { - - if(event instanceof NavigationEnd && event.url !== "/") { - - this.showConfigurator = true - - this.showMenuButton = true - } - - else if (event instanceof NavigationEnd){ - - - this.showConfigurator = false - - this.showMenuButton = false - - } - - }); - - isPlatformBrowser(this.platformId) && this.handleRouteEvents(); - - } - +export class AppComponent implements OnInit, AfterViewInit, OnDestroy { + constructor(@Inject(DOCUMENT) private document: Document, @Inject(PLATFORM_ID) private platformId: any, private renderer: Renderer2, private primeng: PrimeNGConfig, private configService: AppConfigService, private router: Router) {} public themeChangeSubscription: Subscription; - showConfigurator : boolean = false showMenuButton : boolean = false @@ -71,9 +43,6 @@ export class AppComponent implements OnInit, OnDestroy { this.themeChangeSubscription = this.configService.themeChange$.subscribe((theme: Theme) => { this.switchTheme(theme); }); - - - } ngAfterViewInit() { @@ -104,7 +73,7 @@ export class AppComponent implements OnInit, OnDestroy { this.renderer.appendChild(this.document.body, scriptBody); } - handleRouteEvents() { + bindRouteEvents() { this.router.events.subscribe((event) => { if (event instanceof NavigationEnd) { if (typeof window['gtag'] === 'function') { @@ -112,7 +81,24 @@ export class AppComponent implements OnInit, OnDestroy { page_path: event.urlAfterRedirects }); } + + const { theme, darkMode } = this.configService.config; + const landingTheme = darkMode ? 'lara-dark-blue' : 'lara-light-blue'; + if (event.urlAfterRedirects === '/' && theme !== landingTheme) { + this.switchTheme({ name: landingTheme, dark: darkMode }); + } + } + if(event instanceof NavigationEnd && event.url !== "/") { + this.showConfigurator = true + this.showMenuButton = true + } + + else if (event instanceof NavigationEnd){ + this.showConfigurator = false + this.showMenuButton = false + } + }); } @@ -136,6 +122,7 @@ export class AppComponent implements OnInit, OnDestroy { this.configService.completeThemeChange(theme); }); } + toggleDarkMode() { let newTheme = null; const { theme, darkMode } = this.configService.config; @@ -149,9 +136,10 @@ export class AppComponent implements OnInit, OnDestroy { this.configService.changeTheme({ name: newTheme, dark: !darkMode }); } + ngOnDestroy() { if (this.themeChangeSubscription) { this.themeChangeSubscription.unsubscribe(); } } -} +} \ No newline at end of file