javascript - React - return ステートメントを prop として関数を渡す方法

Question

頭を悩ませ続ける奇妙な問題があります。API からデータを取得し、返されたデータを React Router を使用して (小道具として) コンポーネントに渡そうとしています。ただし、返されるデータは「未定義」です。

MyRoutes.js:

let refreshAvailability = (profile_index) => {
    let fetch = new DataFetch();
    fetch.get(`/info/${profile_index}`, (err, res) => {
        let username = res[Object.keys(res)[0]].username;
        if(username !== undefined) {
            setTimeout(() => {return getStatus(username)}, 0);
            setInterval(() => {return getStatus(username)}, 10000); //Refresh every 10 seconds
        }
    });
}

let getStatus = (username) => {
    let userStatus = new userStatus();
    userStatus.getStatus(available => {
        //If i place console.log(available) here it will print the result, but when i return it, its undefined.
        return available;
    });
}

const myRoutes = () => (
  <BrowserRouter>    
            <Route exact path='status/:profile_index' render={(props) => (
                <Status {...props} available={refreshAvailability} />
            )}/>
  </BrowserRouter>
);

export default MyRoutes;

Status.js:

componentDidMount(){
    let userIndex = this.getUserIndex();
    let userStatus = this.props.available(userIndex);

    console.log(userStatus); //This prints undefined
}

どういうわけか問題は getStatus 関数にあるようです。そこにAPIの出力を記録すると、ステータスコンポーネントに記録されていることがわかりますが、それを返すと「未定義」が返されます。

これにより、React が return ステートメントを小道具として使用して関数をどのように処理しているのかという疑問が残ります。リターンなしで関数を渡すのと何か違いはありますか? または、コード内のものを見落としていますか?