{"size": 1675, "ext": "js", "max_stars_repo_path": "src/containers/ItemsSearch/ItemsSearch.js", "max_stars_repo_name": "leonardosal/challenge-fe-meli", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/containers/ItemsSearch/ItemsSearch.js", "max_issues_repo_name": "leonardosal/challenge-fe-meli", "max_issues_repo_issues_event_min_datetime": "2020-07-21T12:45:49.000Z", "max_issues_repo_issues_event_max_datetime": "2021-05-10T11:53:28.000Z", "max_forks_repo_path": "src/containers/ItemsSearch/ItemsSearch.js", "max_forks_repo_name": "leonardosal/meli-clone-fe", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": 4, "max_forks_count": null, "avg_line_length": 22.3333333333, "max_line_length": 61, "alphanum_fraction": 0.5558208955}
import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import qs from 'qs';

import ItemRow from '../../components/ItemRow';
import { LoaderList } from '../../components/Loader';

import { Container, Panel } from '../../components/Wrappers';

class ItemsSearch extends PureComponent {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    const { onSubmit, location } = this.props;
    const param = qs.parse(location.search);
    if (param['?search']) {
      onSubmit(param['?search']);
    }
  }

  render() {
    const { loading, items } = this.props;
    return (
      <Container>
        <Panel>
          {!loading ? (
            items.map(item => (
              <ItemRow
                key={item.id}
                id={item.id}
                title={item.title}
                picture={item.picture}
                price={item.price}
                freeShipping={item.free_shipping}
              />
            ))
          ) : (
            <LoaderList />
          )}
        </Panel>
      </Container>
    );
  }
}

ItemsSearch.propTypes = {
  loading: PropTypes.bool,
  location: PropTypes.shape({
    search: '',
  }).isRequired,
  onSubmit: PropTypes.func.isRequired,
  items: PropTypes.arrayOf(
    PropTypes.shape({
      id: PropTypes.string,
      title: PropTypes.string,
      picture: PropTypes.string,
      price: PropTypes.shape({
        amount: PropTypes.number,
        currency: PropTypes.string,
        decimals: PropTypes.number,
        free_shipping: PropTypes.bool,
      }),
    })
  ),
};

ItemsSearch.defaultProps = {
  loading: true,
  items: [],
};

export default ItemsSearch;
