Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 | 1x 3x 3x 3x 3x 3x 2x 3x 3x 2x 3x 3x 2x | import { OverlayContainer } from '@angular/cdk/overlay';
import { inject, Injectable } from '@angular/core';
import { Actions, createEffect, ofType } from '@ngrx/effects';
import { Store } from '@ngrx/store';
import { map, tap, withLatestFrom } from 'rxjs/operators';
import { themeAction } from './theme.actions';
import { IThemeState } from './theme.interface';
import { themeSelector } from './theme.selectors';
@Injectable({
providedIn: 'root',
})
export class AppThemeEffects {
private readonly actions$ = inject(Actions);
private readonly store = inject(Store<IThemeState>);
private readonly overlayContainer = inject(OverlayContainer);
public readonly enableDarkTheme$ = createEffect(
() =>
this.actions$.pipe(
ofType(themeAction.enableDarkTheme.type),
tap(() => {
this.overlayContainer.getContainerElement().classList.add('unicorn-dark-theme');
}),
),
{ dispatch: false },
);
public readonly disableDarkTheme$ = createEffect(
() =>
this.actions$.pipe(
ofType(themeAction.disableDarkTheme.type),
tap(() => {
this.overlayContainer.getContainerElement().classList.remove('unicorn-dark-theme');
}),
),
{ dispatch: false },
);
public readonly toggleDarkTheme$ = createEffect(() =>
this.actions$.pipe(
ofType(themeAction.toggleDarkTheme.type),
withLatestFrom(this.store.select(themeSelector.darkThemeEnabled)),
map(([action, darkThemeEnabled]) => (darkThemeEnabled ? themeAction.disableDarkTheme() : themeAction.enableDarkTheme())),
),
);
}
|