import { Input  } from 'antd';
import { useEffect, useState } from 'react';
import { connect } from 'react-redux';
import { actionSearchGood } from '../action';
import {useHistory} from 'react-router-dom';

const { Search } = Input;

const InputSearchG = ({good:{_id}, search}) => { 
  let history = useHistory();
  const [idGood, setIdGood] = useState(_id);
  const [inputValue, setInputValue] = useState('');
  
  useEffect(() => {
    if(_id) {
      setIdGood(_id);
      history.push(`/good/${_id}`);
    }

  }, [_id])

  const onSearch = value => {
    console.log(value);
    search(value);
    setInputValue(''); console.log('setInputValue',)
   
  } 
  
  return (
    <Search placeholder="Найти товар " allowClear onSearch={onSearch} style={{ width: 250 }} value={inputValue} onChange={(e) => setInputValue(e.target.value)}/> 
  )
}

const mapStateToProps = (state) => ({
  good: state.promise.searchGood?.payload[0] || '',
}) 

const mapDispatchToProps = {
  search: actionSearchGood,
}

const InputSearchGood = connect(mapStateToProps, mapDispatchToProps)(InputSearchG);

export default InputSearchGood;