import React from 'react'
import { ExpandableCard, ExpandableState } from '@skava/ui/dist/components/organisms/ExpandableCard'
import { AddressToggleProps } from './typings'
import {
  defaultRenderToggleButton,
  defaultRenderExpandedView,
  defaultRenderDefaultView,
  defaultRenderAddNewButton,
  defaultRenderSavedButton,
} from './renderProps'

class AddressToggle extends React.Component<AddressToggleProps> {
  static defaultProps = {
    className: '',
    // render props
    renderToggleButton: defaultRenderToggleButton,
    renderExpandedView: defaultRenderExpandedView,
    renderDefaultView: defaultRenderDefaultView,
    renderSavedButton: defaultRenderSavedButton,
    renderAddNewButton: defaultRenderAddNewButton,
  }

  observableState = new ExpandableState()

  componentWillMount() {
    const { hasDefaultFormView } = this.props
    if (hasDefaultFormView === true) {
      this.observableState.handleToggle()
    }
  }

  render() {
    const {
      renderToggleButton,
      renderExpandedView,
      renderDefaultView,
      ...remainingProps
    } = this.props

    return (
      <ExpandableCard
        renderDefaultView={renderDefaultView}
        renderExpandedView={renderExpandedView}
        renderToggleButton={renderToggleButton}
        state={this.observableState}
        {...remainingProps}
      />
    )
  }
}

export { AddressToggle }
export default AddressToggle