How can I debug a problem like this. When I'm using application on desktop everything works fine and updates on database change, bug if I am using application on mobile for change I need to refresh manually. The application is one for both devices and there is no exception.

This. is the exact method that I use for subscribe in my component to receive the data.

  public getOrderDetails$(id: string): Observable<OrderItem | undefined> {
    if (!id || this.context.state.isServer) return of(undefined)
    this.isLoading = true;

    try {
      return this.db.collection<OrderItem>('orders').doc(id)
        .valueChanges({ idField: 'id' })
        .pipe(
          tap((order) => {
            if (!order) return
            if (!this.currentOrder) {
              this.currentOrder = order;
            }
            if (order.status !== this.currentOrder.status) {
              this.notification.pushNotification('The order has been updated.');
              this.currentOrder = order;
            }
            this.isLoading = false;
          }),
        );
    } catch (error) {
      console.error(error);
      this.isLoading = false;
      return of(undefined)
    }
  }