import React from 'react'
import { EMPTY_ARRAY } from 'exotic'
import { NavigationListProps } from './typings'
import {
  defaultRenderButton,
  defaultRenderButtonList,
  defaultRenderWrapper,
} from './renderProps'

class NavigationList extends React.PureComponent<NavigationListProps> {
  static defaultProps = {
    className: '',
    list: EMPTY_ARRAY,
    renderItem: defaultRenderButton,
    renderList: defaultRenderButtonList,
    renderWrapper: defaultRenderWrapper,
  }
  render() {
    const { renderList, renderWrapper, ...remainingProps } = this.props

    const buttons = renderList(remainingProps)
    const children = <React.Fragment>{buttons}</React.Fragment>

    const view = renderWrapper({ ...remainingProps, children })
    return view
  }
}

export { NavigationList }
export default NavigationList