api.js

const createApiComponent = (requestFn, initialState = {}) => (component) => {
   return class extends React.Component {
     state = { loading: false, ...initialState }
     
     componentDidMount() {
       this.setState({ loading: true })
       requestFn()
          .then(apiResult => { this.setState({ apiResult, loading: false }) })
          .catch(apiError => { this.setState({ apiError, loading: false }) })
     }
  
     render() {
        return component({ ...this.props, ...this.state })
     }
   }
}


// usage
class Page extends React.Component {
  render() {
     if (this.props.loading) { return <div>Loading...</div> }
                              
     return <div>result is: {this.props.apiResult.body}</div>
  } 
}
  
  
const apiPage = createApiComponent(() => fetch('/my/url'))(Page)