/**
 * @todo loadable - keep getting rid of this somehow...?
 */

import React from 'react'
import { string, func, promise, oneOfType } from 'modules/view-container/types'
import { asyncComponent as asyncJobsComponent } from 'modules/SSR/async-component'
// import { Loader } from 'src/uxui/interface/Loader'
import { WaveLoader as Loading } from 'src/uxui/interface/Loader'

// const asyncRegistry = {}
const loader = React.createElement(Loader)

class AsyncComponent extends React.Component {
  static propTypes = {
    resolve: oneOfType([string, func, promise]).isRequired,
  }
  static from(path) {
    const attributes = { resolve: path, LoadingComponent: Loader }
    return asyncJobsComponent(attributes)

    // return React.createElement(AsyncComponent, attributes)
    // return <AsyncComponent {...attributes} />
    // return function AsyncRoute() {
    //   return React.createElement(AsyncComponent, attributes)
    // }
  }
  state = {
    isLoaded: false,
    component: undefined,
  }
  constructor(props) {
    super(props)
    // start loading
    this.startLoading()
  }
  componentDidMount() {
    return this.startLoading()
  }
  startLoading() {
    if (this.async) {
      return this.async
    }

    this.async = this.props.resolve().then(component => {
      // console.dev(component)
      this.handleOnAsyncLoad(component)
      return Promise.resolve(component)
    })

    return this.async
  }
  asyncBootstrap() {
    return this.startLoading()
  }

  handleOnAsyncLoad = required => {
    const component = required && required.default ? required.default : required
    this.setState({ component, isLoaded: true })
  }

  render() {
    if (this.state.isLoaded === false) {
      return loader
    }

    const { component } = this.state

    // @NOTE
    //   could pass in props here too,
    //   or scope the class inside of a function,
    //   or clone
    //   or use children traversal
    //   or rehydrate
    return React.createElement(component)
  }
}

export { AsyncComponent, Loader }
export default AsyncComponent