import { Injectable } from '@angular/core';
import { BehaviorSubject, Subject, takeUntil } from 'rxjs';
import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';

@Injectable({
  providedIn: 'root',
})
export class BreakpointsService {
  public IsMobile = new BehaviorSubject(false);
  destroyed = new Subject<void>();
  ngOnDestroy() {
    this.destroyed.next();
    this.destroyed.complete();
  }
  constructor(private breakpointObserver: BreakpointObserver) {
    this.checkTest();
  }
  
  checkTest() {
    this.breakpointObserver
      .observe([Breakpoints.XSmall, Breakpoints.Small])
      .pipe(takeUntil(this.destroyed))
      .subscribe((result) => {
        if (
          result.breakpoints['(max-width: 599.98px)'] ||
          result.breakpoints['(min-width: 600px) and (max-width: 959.98px)']
        ) {
          this.IsMobile.next(true);
        } else {
          this.IsMobile.next(false);
        }
      });
  }
  
  checkMob() {
    return this.IsMobile.getValue();
  }
}
