We have an Angular 16.x.x based FE application where when we have an Observable for http request for orders checkout.component. We have placed a toastr inside .next() of the subscription along with a logger and the reason why we have placed the logger is to ensure the success response which we realized for some reasons that sometimes it does not execute the code inside .next(), however the order is placed and success response is ensured from the backend.

    this.accountService
      .checkout(orderObj)
      .pipe(finalize(() => (this.loading = false)))
      .subscribe({
        next: (res: any) => {
          logdna.log(`Checkout successful for: ${orderObj.email}`);
          this.toastr.success('Your order has been placed successfully');
        }
      });

What could be the possible reason? It is the first time i am facing such an issue and i have no clue why is it even happening?