just-paja/improtresk-web

View on GitHub
src/orders/components/StayLengthPicker.jsx

Summary

Maintainability
B
5 hrs
Test Coverage
import moment from 'moment-timezone'

import Col from 'reactstrap/lib/Col'
import FormFeedback from 'reactstrap/lib/FormFeedback'
import Row from 'reactstrap/lib/Row'
import React, { Component } from 'react'
import PropTypes from 'prop-types'

import FormErrors from '../../forms/containers/FormErrors'
import InputCheckbox from '../../forms/components/InputCheckbox'

export default class StayLengthPicker extends Component {
  constructor () {
    super()
    this.handleChange = this.handleChange.bind(this)
  }

  getDates () {
    const current = moment(this.props.start)
    const end = moment(this.props.end)
    const dates = []
    while (!current.isAfter(end)) {
      dates.push(current.format('YYYY-MM-DD'))
      current.add(1, 'days')
    }
    return dates
  }

  handleChange (event) {
    const { value } = event.target
    let nextValue
    if (this.props.input.value) {
      if (this.props.input.value.indexOf(value) === -1) {
        nextValue = this.props.input.value.concat([value])
      } else {
        nextValue = this.props.input.value.filter(item => item !== value)
      }
    } else {
      nextValue = [value]
    }
    this.props.input.onChange(nextValue)
  }

  render () {
    const { input, meta } = this.props
    const dates = this.getDates()
    return (
      <div>
        <Col style={{ padding: '0 20px' }}>
          <Row>
            {dates.map(date => (
              <Col key={date} xs={12} md={4}>
                <InputCheckbox
                  disabled={meta.submitting}
                  checked={input.value && input.value.indexOf(date) !== -1}
                  input={{
                    value: date,
                    name: date,
                    onChange: this.handleChange
                  }}
                  meta={{}}
                  label={moment(date).format('L')}
                  rawLabel
                />
              </Col>
            ))}
          </Row>
        </Col>
        {meta.touched && meta.error ? (
          <FormFeedback>
            <FormErrors
              errors={meta.error}
              data={{ field: input.name }}
            />
          </FormFeedback>
        ) : null}
      </div>
    )
  }
}

StayLengthPicker.propTypes = {
  end: PropTypes.string.isRequired,
  input: PropTypes.object.isRequired,
  meta: PropTypes.object.isRequired,
  start: PropTypes.string.isRequired
}