fix(theme): save theme in local storage after theme changing

This commit is contained in:
Alex 2020-03-25 21:16:01 +03:00
parent 9e86f88fa2
commit a878bd2d80
3 changed files with 24 additions and 16 deletions

View file

@ -1,6 +1,7 @@
import {Injectable, OnDestroy} from '@angular/core';
import {Observable} from 'rxjs';
import {takeWhile} from 'rxjs/operators';
import {environment} from '../../../environments/environment';
@Injectable()
export class CurrentThemeService implements OnDestroy {
@ -10,6 +11,22 @@ export class CurrentThemeService implements OnDestroy {
subscriber.next(localStorage.theme);
}).pipe(takeWhile(() => this.alive));
setCurrentTheme(themeName: string): void {
const currentTheme = {
themeName: themeName,
expires_in: this.calculateExpiration(environment.currentThemeLife),
};
localStorage.setItem('theme', JSON.stringify(currentTheme));
}
calculateExpiration(iat: number): number {
const currentDate = new Date().getTime();
const timestamp = iat || Math.floor(Date.now() / 1000);
return Math.floor(timestamp + currentDate);
}
ngOnDestroy(): void {
this.alive = false;
}

View file

@ -6,6 +6,7 @@ import { AnalyticsService, LayoutService } from '../../../@core/utils';
import { map, takeUntil } from 'rxjs/operators';
import { Subject, Observable } from 'rxjs';
import { RippleService } from '../../../@core/utils/ripple.service';
import {CurrentThemeService} from '../../../@core/utils/theme.service';
@Component({
selector: 'ngx-header',
@ -57,6 +58,7 @@ export class HeaderComponent implements OnInit, OnDestroy {
private userService: UserData,
private layoutService: LayoutService,
private breakpointService: NbMediaBreakpointsService,
private currentThemeService: CurrentThemeService,
private analytics: AnalyticsService,
private rippleService: RippleService,
) {
@ -99,6 +101,7 @@ export class HeaderComponent implements OnInit, OnDestroy {
}
changeTheme(themeName: string) {
this.currentThemeService.setCurrentTheme(themeName);
this.themeService.changeTheme(themeName);
}

View file

@ -2,7 +2,7 @@ import {Component, OnDestroy} from '@angular/core';
import {NbMediaBreakpoint, NbThemeService} from '@nebular/theme';
import {Router} from '@angular/router';
import {AnalyticsService} from '../@core/utils';
import { environment } from '../../environments/environment';
import {CurrentThemeService} from '../@core/utils/theme.service';
@Component({
selector: 'ngx-starter',
@ -41,18 +41,13 @@ export class NgxStarterComponent implements OnDestroy {
];
constructor(private router: Router,
protected themeService: NbThemeService,
private themeService: NbThemeService,
private currentThemeService: CurrentThemeService,
private analytics: AnalyticsService,
) {}
navigate(themeName: string) {
const currentTheme = {
themeName: themeName,
expires_in: this.calculateExpiration(environment.currentThemeLife),
};
localStorage.setItem('theme', JSON.stringify(currentTheme));
this.currentThemeService.setCurrentTheme(themeName);
this.themeService.changeTheme(themeName);
this.router.navigate(['/pages/dashboard'], {queryParams: {theme: themeName}});
}
@ -63,11 +58,4 @@ export class NgxStarterComponent implements OnDestroy {
ngOnDestroy() {
}
calculateExpiration(iat: number): number {
const currentDate = new Date().getTime();
const timestamp = iat || Math.floor(Date.now() / 1000);
return Math.floor(timestamp + currentDate);
}
}