import React , { useState , useEffect } from 'react' ; import DonationStats from './DonationStats' ; type Props = { asyncFetchDonationsStats : any ; widgetId : number ; mainColor : string ; goalDateLimit ? : string ; } ; const FetchDonationStats = ( { asyncFetchDonationsStats , widgetId , mainColor , goalDateLimit , } ) => { const [ fetching , setFetching ] = useState ( true ) ; const [ data , setData ] = useState ( ) ; useEffect ( ( ) => { asyncFetchDonationsStats ( { widget_id : widgetId } ) . then ( ( { data } ) => { setData ( data . stats ) ; setFetching ( false ) ; } ) . catch ( ( err ) => { console . error ( 'FetchDonationStats: ' , err ) ; } ) ; } , [ asyncFetchDonationsStats , widgetId ] ) ; if ( fetching ) return < div />; else return ( < DonationStats data = { data } goalDateLimit = { goalDateLimit } mainColor = { mainColor } / > ) ; } ; export default FetchDonationStats ;