text: import Stack from '@admin/components/stack'
  import PhoneNumbers from './phone_numbers'
  import PropTypes from 'prop-types'
  import Programs from './programs'
  import React from 'react'
  
  class CallActivity extends React.PureComponent {
  
    static contextTypes = {
      modal: PropTypes.object,
      twilio: PropTypes.object
    }
  
    static propTypes = {
      contact: PropTypes.any
    }
  
    state = {
      program: null,
      phone_number: null,
      cards: []
    }
  
    _handleCancel = this._handleCancel.bind(this)
    _handlePop = this._handlePop.bind(this)
    _handleProgram = this._handleProgram.bind(this)
    _handlePhoneNumber = this._handlePhoneNumber.bind(this)
    _handlePush = this._handlePush.bind(this)
  
    render() {
      return <Stack { ...this._getStack()} />
    }
  
    componentDidMount() {
      this._handlePush(Programs, this._getPrograms())
    }
  
    _getPhoneNumbers() {
      const { contact } = this.props
      return {
        contact,
        onBack: this._handlePop,
        onChoose: this._handlePhoneNumber
      }
    }
  
    _getPrograms() {
      return {
        onCancel: this._handleCancel,
        onChoose: this._handleProgram
      }
    }
  
    _getStack() {
      const { cards } = this.state
      return {
        cards,
        slideFirst: false
      }
    }
  
    _handleCancel() {
      this.context.modal.close()
    }
  
    _handlePop(index = -1) {
      this.setState({
        cards:this.state.cards.slice(0, index)
      })
    }
  
    _handleProgram(program) {
      const { contact } = this.props
      this.setState({ program }, () => {
        if(contact.phone_numbers.length === 1) {
          return this._handlePhoneNumber(contact.phone_numbers[0])
        }
        this._handlePush(PhoneNumbers, this._getPhoneNumbers())
      })
    }
  
    _handlePhoneNumber(phone_number) {
      const { program } = this.state
      const { contact } = this.props
      this.context.modal.close()
      this.context.twilio.call({
        program,
        number: phone_number.number,
        contact,
        device: 'maha'
      })
    }
  
    _handlePush(component, props) {
      this.setState({
        cards: [
          ...this.state.cards,
          { component, props }
        ]
      })
    }
  
  }
  
  export default CallActivity
  