How can I do and conditional complete on Rxjs and angular

Question

Hello currently I'm using an observable to get the screen size of a device and determinate if it is a mobile or desktop device but I would like to add a conditional complete by using take(0) but I don't now the way . currently this my code

import { BreakpointObserver, BreakpointState } from '@angular/cdk/layout';
import { Component, Input, OnInit } from '@angular/core';
import { take } from 'rxjs';

@Component({
  selector: 'app-sidebar',
  templateUrl: './sidebar.component.html',
  styleUrls: ['./sidebar.component.scss']
})
export class SidebarComponent implements OnInit {


  @Input() observerMode: boolean = false;

  isMobile: boolean = false;
  constructor(private breakpointObserver: BreakpointObserver) { }

  ngOnInit(): void {
    this.breakpointObserver
      .observe(['(min-width: 750px)'])
      .pipe(take(0))
      .subscribe((state: BreakpointState) => {
        if (state.matches) {
          console.log('desktop');
          this.isMobile = false;
        } else {
          this.isMobile = true;
        }
      });
  }

}

I would like to use take(0) if the observerMode is false.

Answer 1

You can use “takeWhile()” with your observerMode

Answer 2

It sounds like you want to prevent emissions when observerMode is false. In that case, you can just use a filter:

    this.breakpointObserver
      .observe(['(min-width: 750px)'])
      .pipe(filter(() => this.observerMode)
      .subscribe(state => this.isMobile = state.matches);