/* eslint-disable @typescript-eslint/explicit-member-accessibility */
import React from 'react'
import ReactDOM from 'react-dom'

interface ReactVersionAdapterProps {
  component: React.ComponentType<unknown>
  children?: React.ReactNode
}

class ReactVersionAdapter extends React.Component<ReactVersionAdapterProps> {
  refHold: HTMLDivElement | null = null

  public async init(hydrate = false) {
    const { component: Component, children, ...rest } = this.props
    const renderMethod = hydrate ? ReactDOM.hydrate : ReactDOM.render

    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
    // @ts-ignore wrong react component definition
    renderMethod(React.createElement(Component, rest, children), this.refHold)
  }

  componentDidUpdate() {
    this.init(true)
  }

  componentDidMount() {
    this.init()
  }

  render() {
    return <div ref={(ref) => (this.refHold = ref)} />
  }
}

export default ReactVersionAdapter