import { connect } from 'react-redux';
import { GoodCardCharacteristic, SortableComponent } from './index';
import { Card } from 'antd';
import { actionClearFirstImg, actionChangeArrInGood } from '../action';

const CartGoodAdmin = ({ good: { _id, images }, upLoad, clearUpLoad, onChangeArrInGood }) => {
  return (
    <Card>
      <GoodCardCharacteristic/>
      <div style={{ textAlign: 'center' }}>
        <strong >Фото можно поменять местами</strong>
      </div>
      <div>
      <SortableComponent
       images={images}
       idGood={_id}
       upLoad={upLoad}
       clearUpLoad={clearUpLoad}
       onChangeArrInGood={onChangeArrInGood} />
      </div>
    </Card>
  );
};

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

const mapDispatchToProps = {
  clearUpLoad: actionClearFirstImg,
  onChangeArrInGood: actionChangeArrInGood
};

const CCartGoodAdmin = connect(mapStateToProps, mapDispatchToProps)(CartGoodAdmin);

export default CCartGoodAdmin;
