import React, { useState } from 'react'
import { useDispatch } from 'react-redux'

import { setText } from '../store/actions.js'

const lorem =
  'Excepteur aliqua cupidatat ullamco laboris cupidatat elit sint cillum incididunt. Anim sit excepteur laboris commodo ullamco consequat tempor. Velit elit eiusmod aute aliquip amet sunt minim deserunt voluptate esse ea sint. Commodo ipsum dolor dolor Lorem et consectetur minim ut in voluptate. Nulla qui consectetur nostrud sint anim minim duis qui amet. Ipsum reprehenderit eiusmod quis Lorem. Consectetur ipsum quis incididunt proident ea sit mollit veniam in excepteur.'

export const TextInput = () => {
  const [text, setTextState] = useState(lorem)
  const dispatch = useDispatch()
  return (
    <div>
      <textarea
        defaultValue={text}
        onInput={e => setTextState(e.target.value)}
      ></textarea>
      <button onClick={() => dispatch(setText(text))}>Load</button>
    </div>
  )
}
