{"size": 2082, "ext": "js", "max_stars_repo_path": "src/App.js", "max_stars_repo_name": "twistezo/online-shop", "max_stars_repo_stars_event_min_datetime": "2020-05-23T22:25:54.000Z", "max_stars_repo_stars_event_max_datetime": "2020-05-23T22:25:54.000Z", "max_issues_repo_path": "src/App.js", "max_issues_repo_name": "twistezo/online-shop", "max_issues_repo_issues_event_min_datetime": "2019-02-22T10:52:32.000Z", "max_issues_repo_issues_event_max_datetime": "2019-03-04T10:56:32.000Z", "max_forks_repo_path": "src/App.js", "max_forks_repo_name": "twistezo/online-shop", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 1, "max_issues_count": 1, "max_forks_count": null, "avg_line_length": 23.1333333333, "max_line_length": 70, "alphanum_fraction": 0.5489913545}
import React, { Component } from 'react'
import { DataGenerator } from './data/DataGenerator'
import DataUtils from './data/DataUtils'
import MainContainer from './components/MainContainer'
import './App.scss'

class App extends Component {
  static dataQuantity = 200

  constructor() {
    super()
    this.state = {
      data: null,
      error: {
        occured: false,
        message: ''
      }
    }
  }

  componentDidMount() {
    this.generateData()
      .then(data => {
        const items = DataUtils.loadFromLocalStorage(
          'items',
          DataUtils.rebuildItemsFromJson
        )
        items === null
          ? DataUtils.saveToLocalStorage('items', data.items)
          : (data.items = items)
        this.setState({ data })
      })
      .catch(err => {
        this.setState({
          error: {
            occured: true,
            message: err.message
          }
        })
      })
  }

  generateData = () =>
    new Promise((resolve, reject) => {
      const data = new DataGenerator().generate(App.dataQuantity)
      if (data instanceof Error) {
        reject(new Error('Generate mocks with DataGenerator failed.'))
      } else {
        resolve(new DataGenerator().generate(App.dataQuantity))
      }
    })

  ErrorContainer = () => {
    return (
      <div className="text-center pt-5">
        <div className="pb-2">
          <h2>Error while fetching data. Please reload the page.</h2>
          <h5>Error message: "{this.state.error.message}"</h5>
        </div>
      </div>
    )
  }

  WaitContainer = () => {
    return (
      <div className="text-center pt-5">
        <div className="pb-2">
          <h2>Downloading data...</h2>
        </div>
      </div>
    )
  }

  render() {
    if (
      this.state.data !== null &&
      this.state.data !== undefined &&
      !this.state.error.occured
    ) {
      return <MainContainer data={this.state.data} />
    } else if (this.state.error.occured) {
      return <this.ErrorContainer />
    } else {
      return <this.WaitContainer />
    }
  }
}

export default App
