import React from 'react'
import { isUndefined } from 'exotic'
import TextBox from 'src/inputs/TextBox'
import { validators } from 'src/forms/deps/_validators'
import { InputChain } from 'src/forms/input/InputChain'

class TextBoxInput extends InputChain {
  /**
   * this handles all text inputs, and is the default
   * @note !!!! added || true so it is always the fallback
   */
  static isSatisfiedByProps(props): boolean {
    const typesSupported = ['text', 'confirmPassword', 'telephone']
    return (
      isUndefined(props.type) ||
      typesSupported.includes(props.type) ||
      (props.identity !== 'SecurityCode' && props.type === 'password') ||
      true
    )
  }

  validate = () => {
    const state = this.get('state')
    const props = this.get('props')

    /**
     * !!!!!!!!
     * @note - this uses props.validationType while the others use state
     */
    this.isValid = validators.isValid(state.value, props.validationType)
  }

  render() {
    const props = this.get('props')
    const attributes = {
      ...props,
    }
    return <TextBox {...attributes} />
  }
}

export { TextBoxInput }
export default TextBoxInput