Manually create XHR request for Angular

manual-request.ts

requestName(): Observable<Call> {
  return new Observable(observer => {
    const endpoint = 'endpoint';
    const data = {};

    // #region:multipart
    // In case of multipart
    const formData: FormData = new FormData();
    Object.keys(data).forEach((key) => {
      formData.append(key, data[key]);
    });
    // #endregion:multipart

    const request = new XMLHttpRequest();
    request.onreadystatechange = () => {
      if (request.readyState === 4) { // 4 === XMLHttpRequest.DONE
        const body = JSON.parse(request.response);
        if (request.status >= 200 && request.status < 300) {
          return observer.next(body.data);
        } else {
          return observer.error(body.data);
        }
      }
    };
    request.open('POST', endpoint);
    request.setRequestHeader('Authorization', 'Bearer whatever');
    request.send(formData);

    return { unsubscribe() {} };
  });
}