I'm trying to override a method of an object returned from an async function but get this error; dataProvider.getList is not a function

i tried to extend the object simply in this way but obviously is not correct

function App() {

    const [dataProvider, setDataProvider] = useState(null);
  
    useEffect(() => {
      const buildDataProvider = async () => {
  
        //this must to be called with await 
        const dataProvider = await buildHasuraProvider({
          clientOptions: { uri: 'http://localhost:8080/v1/graphql' }
        });
  
        //this object should be the same as above but with an overridend method  (getList)
        const  extendeDataProvider = {
          ...dataProvider,
           getList: (resource, params) => {
             if (resource === 'apikeys') {
               //implementation missing
             } else {
              // fallback to the default implementation  
              return dataProvider.getList(resource, params);
            }
          }
        }
  
        setDataProvider(() => extendeDataProvider);
      
      };
  
      buildDataProvider();
    }, []);
  
    if (!dataProvider) return <p>Loading...</p>;
  
    return (<Admin dataProvider={dataProvider} />)
  }
  
  export default App;