ksd

import React, { Component } from 'react';
import { ItemRestClient } from './ItemRestClient';
import styled from 'styled-components';
import Loading from '../core/Loading';
import ErrorInfo from '../core/ErrorInfo';



// Create a <Title> react component that renders an <h1> which is
// centered, palevioletred and sized at 1.5em
const ItemListContainer = styled.div`

  text-align: center;

`;

const itemRestClient = new ItemRestClient();

class ItemList extends Component {
  constructor(props){
    super(props);
    this.state = { items: null, error: null }
    console.log("IL - constructor");
  }

  componentDidMount(){
    itemRestClient.search({})
      .then((items) => this.setState({ items }))
      .catch((error) => this.setState({ error }));
      console.log("IL - componentDidMount");
  }
  render() {
    console.log("IL - render");
    const { items, error  } = this.state;
    if (error){
      return <ErrorInfo error={error}/>
    }
    if (!items){
      return <Loading/>
    }
    return (
      <ItemListContainer>
        {JSON.stringify(items)}
      </ItemListContainer>

    );
  }
}

export default ItemList;