import React, {useState} from 'react';
import style from './Goods.module.sass';
import CreateGoodsForm from '../../../../forms/createGoodsForm/createGoodsForm';
import DynamicSearchGoods from '../../../../inputs/dynamicSearchGoods/dynamicSearchGoods';
import {dynamicSearchGoodsConstants} from "../../../../../constants/typesComponents";
import {connect} from 'react-redux';
import {reset} from 'redux-form';
import {clearGoodsData} from "../../../../../actions/actionCreator";

const Goods = (props) => {
    const [isOpenFormNewAttribute, setStatusFormNewAttribute] = useState(false);


    return(
      <div className={style.mainContainer}>
          <div className={style.goodsControlContainer}>
              <CreateGoodsForm/>
              <DynamicSearchGoods
                type={dynamicSearchGoodsConstants.GOODS_UPDATER}
              />
              <p
                  onClick={() => {
                      props.clearStorage();
                      props.clearForm()
                  }}
              >
                  Clear
              </p>
          </div>
          {/*<div className={style.goodsAttributesContainer}>*/}
              {/*{*/}
                  {/*props.goodsAttributes.map(elem => (*/}
                      {/*<GoodsAttributeElement*/}
                          {/*{...elem}*/}
                      {/*/>*/}
                  {/*))*/}
              {/*}*/}
              {/*<div className={style.newGoodsAttributeContainer}>*/}
                  {/*<h2 onClick={() => setStatusFormNewAttribute(!isOpenFormNewAttribute)}>*/}
                      {/*Добавить аттрибут*/}
                  {/*</h2>*/}
                  {/*{*/}
                      {/*isOpenFormNewAttribute && <CreateGoodsAttributeForm/>*/}
                  {/*}*/}
              {/*</div>*/}

          {/*</div>*/}
      </div>
    );
};

const mapStateToProps = state => {
    const {goodsData} = state.createGoodsReducers;

    return {
        goodsData
    }
};

const mapDispatchToProps = dispatch => ({
   clearStorage: () => dispatch(clearGoodsData()),
   clearForm: () => dispatch(reset('goodsForm'))
});

export default connect(mapStateToProps, mapDispatchToProps)(Goods);

// export default NewGoods;