text: /**
   *
   * EditProduct
   *
   */
  
  import React from 'react';
  
  import { Row, Col } from 'reactstrap';
  
  import Input from '../../Common/Input';
  import Button from '../../Common/Button';
  
  const EditProduct = props => {
    const {
      product,
      productChange,
      formErrors,
      updateProduct,
      deleteProduct
    } = props;
  
    const handleSubmit = event => {
      event.preventDefault();
      updateProduct();
    };
  
    return (
      <div className='edit-product'>
        <form onSubmit={handleSubmit} noValidate>
          <Row>
            <Col xs='12'>
              <Input
                type={'text'}
                error={formErrors['name']}
                label={'Name'}
                name={'name'}
                placeholder={'Product Name'}
                value={product.name}
                onInputChange={(name, value) => {
                  productChange(name, value);
                }}
              />
            </Col>
            <Col xs='12' md='12'>
              <Input
                type={'textarea'}
                error={formErrors['description']}
                label={'Description'}
                name={'description'}
                placeholder={'Product Description'}
                value={product.description}
                onInputChange={(name, value) => {
                  productChange(name, value);
                }}
              />
            </Col>
          </Row>
          <hr />
          <div className='d-flex flex-column flex-md-row'>
            <Button
              type='submit'
              text='Save'
              className='mb-3 mb-md-0 mr-0 mr-md-3'
            />
            <Button
              variant='danger'
              text='Delete'
              onClick={() => deleteProduct(product._id)}
            />
          </div>
        </form>
      </div>
    );
  };
  
  export default EditProduct;
  