Component using useEffect and Axios to get async data

useEffect-async-loader.js

import React, { useState, useEffect } from "react";
import axios from "axios";

const fetchDataCall = async ({ api }) => {
  let apiReturn = await axios
    .get(api)
    .then(async function(response) {
      return response;
    })
    .catch(function(error) {
      console.log(error);
    });
  return apiReturn;
};

const ApiComponent = ({ api }) => {
  const [data, setData] = useState("");

  useEffect(() => {
    const fetchData = async api => {
      let response = await fetchDataCall({ api: api });
      setData(response);
    };

    fetchData(api);
  }, []);

  return (
    <div>
      {data && (make component)}
    </div>
  )
};

export default ApiComponent;