Good afternoon. Please tell me how can I return the 'event. loaded' which then dispatch it to the state

const startSpeedTestAsync = () => async (dispatch: Dispatch) => {
  const url = config.SPEED_TEST;


dispatch(setLoadTest(true));

const startTime = new Date().getTime();


dispatch(startSpeedTest({ startTime, isShowInfo: false }));



 const endRequest = (data: unknown) => {
    const endTime = new Date().getTime();
    dispatch(setEndTime(endTime));
    dispatch(calcSpeed(data));
    dispatch(stopSpeedTest({ isLoadTest: false, isShowInfo: true }));
  };



const sendHttpRequest = (metod: string, currenUrl: string) => {
    const promise: Promise<unknown> = new Promise((resolve) => {
      const xhr = new XMLHttpRequest();

  xhr.timeout = 5000;

  xhr.onprogress = function (event) {
    console.log('loaded: ', event.loaded);
    return event.loaded;
  };
  xhr.onreadystatechange = function () {
    // Only run if the request is complete
    if (xhr.readyState !== 4) return;
    resolve(xhr.onprogress);

    // resolve(xhr.onprogress);
  };
  xhr.open(metod, currenUrl);
  xhr.send();
});
return promise;

};

  sendHttpRequest('GET', url)
    .then((response: any) => console.log(response))
    .catch(endRequest);
};

I can not understand how to properly process the request that everything turned out. I'm trying to implement a request for xmlhttprequest and return the size of the downloaded file to then calculate the speed of the Internet connection. The problem is that I don't know how to return this size.