import { isFunction } from 'exotic'
import { observe } from 'xmobx/mobx'
import unselectInputsList from './unselectInputsList'

// could check handleInputChange.isHandler | isSubscriber
function subscribeRadioGroupInputsList(inputsList, handleInputChange) {
  /**
   * @listens value change
   *
   * @todo - should convert most observables to Atom+Reaction
   * @todo - this may not be needed, forgot why we needed it, something for formhandler structure issue
   */
  const subscribe: void = input => {
    const onClickReference = input.onClick
    const subscriber = change => {
      console.render('Radio@subscriber', {
        handleInputChange,
        input,
      })

      if (isFunction(handleInputChange)) {
        handleInputChange(input, inputsList)
      } else {
        unselectInputsList(input, inputsList)
      }

      if (onClickReference && !onClickReference.isRadioSubscriber) {
        onClickReference()
      }
      // can check input.onInputChange ?
      // handleInputChange(input, change)
    }

    // this would also make sense would it not
    // observe(input, 'value', subscriber)

    // pass to ui/view
    // input.onChange =
    input.onClick = subscriber
    input.onClick.isRadioSubscriber = true
  }

  // console.log('RadioGroupState_init')
  inputsList.forEach(subscribe)
}

export { subscribeRadioGroupInputsList }
export default subscribeRadioGroupInputsList