42 lines
1.3 KiB
TypeScript
42 lines
1.3 KiB
TypeScript
// Angular
|
|
import { Injectable } from '@angular/core';
|
|
|
|
// Rxjs
|
|
import { BehaviorSubject, Observable, combineLatest } from 'rxjs';
|
|
import { map } from 'rxjs/operators';
|
|
|
|
// State
|
|
import { Browser, Device, Size } from '../entities/device-configs.model';
|
|
import { getUserBrowser } from '../services/device-configs.service';
|
|
|
|
@Injectable({ providedIn: 'root' })
|
|
export class DeviceConfigsFacade {
|
|
private readonly deviceSubject = new BehaviorSubject<Device>('DESKTOP');
|
|
private readonly sizeSubject = new BehaviorSubject<Size | null>(null);
|
|
private readonly browserSubject = new BehaviorSubject<Browser>('UNKNOWN');
|
|
|
|
// Device
|
|
readonly device$: Observable<Device> = this.deviceSubject.asObservable();
|
|
// `null` hasta que se resuelve el tamaño (así lo declara el estado inicial)
|
|
readonly size$: Observable<Size | null> = this.sizeSubject.asObservable();
|
|
readonly isSmallDevice$: Observable<boolean> = combineLatest([
|
|
this.device$,
|
|
this.size$,
|
|
]).pipe(map(([device, size]) => device !== 'DESKTOP' && size !== 'LARGE'));
|
|
|
|
// Browser
|
|
readonly browser$: Observable<Browser> = this.browserSubject.asObservable();
|
|
|
|
getBrowser(): void {
|
|
this.browserSubject.next(getUserBrowser());
|
|
}
|
|
|
|
setDevice(device: Device): void {
|
|
this.deviceSubject.next(device);
|
|
}
|
|
|
|
setSize(size: Size): void {
|
|
this.sizeSubject.next(size);
|
|
}
|
|
}
|