import { Input, Button } from 'antd';
import { SearchOutlined } from '@ant-design/icons';
import { useState } from 'react';
// import { useEffect, useState } from 'react';
import { connect } from 'react-redux';
import { Link } from 'react-router-dom';

const InputSearchG = ({ nick }) => {
  const [inputValue, setInputValue] = useState('');
  // const [user, setUser] = useState(nick);

  // useEffect(() => {
  //   if (nick && nick.acl && nick.acl.includes('admin')) {
  //     setUser('admin');
  //   }
  // }, [nick]);

  return (
    < >
      <Input
        placeholder="Найти товар "
        value={inputValue}
        size="middle"
        style={{ width: '40%' }}
        onChange={(e) => setInputValue(e.target.value)}/>
      <Link to={`/search/${inputValue}`}><Button icon={<SearchOutlined />} onClick={() => setInputValue('')}/></Link>

    </>
  );
};

const mapStateToProps = (state) => ({
  nick: state.auth.payload?.sub || ''
});

const InputSearchGood = connect(mapStateToProps)(InputSearchG);

export default InputSearchGood;
