{"size": 2112, "ext": "js", "max_stars_repo_path": "src/App.js", "max_stars_repo_name": "katkaldunska/file-comparer", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/App.js", "max_issues_repo_name": "katkaldunska/file-comparer", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/App.js", "max_forks_repo_name": "katkaldunska/file-comparer", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 27.4285714286, "max_line_length": 119, "alphanum_fraction": 0.5317234848}
import React, { Component } from 'react';
import { Button, Alert } from 'react-bootstrap';
import Cells from './Cells/Cells';
import FileUploader from './FileUploader/FileUploader';
import CleanButton from './FileUploader/CleanButton';
import './App.css';

class App extends Component {
  state = {
    translation: {},
    languages: [],
    error: false,
    errorMessage: ''
  };

  callApi = () => {
    return fetch('http://localhost:5000/defaultFiles')
    .then(response => response.json());
  };

  uploadDefaultFiles = () => {
    this.callApi()
      .then(res => {
        if (res.files && res.files.length !== 2) {
          this.setState({
            error: true,
            errorMessage: `Na serwerze znajduje się liczba plików inna niż 2: ${res.files.length}`,
            translation: {},
            languages: []
          });
        } else if (!!res.translation) {
          this.setState({
            translation: res.translation,
            languages: res.files,
            error: false,
            errorMessage: ''
          });
        } else {
          this.setState({
            error: true,
            errorMessage: 'Uszkodzone pliki na serwerze',
            translation: {},
            languages: []
          });
        }
      })
      .catch(err => console.log(err));
  }

  render() {
    return (
      <div className="App">
        <FileUploader/>
        <Button bsstyle='link' onClick={() => { this.uploadDefaultFiles() }}>
          Załaduj zawartość plików
        </Button>
        <CleanButton/>
        { Object.keys(this.state.translation).length > 0 &&
          <section>
            <Alert bsstyle='info'>
              Nazwy etykiet edytuj w tabeli. Takie same etykiety dla obu języków, bądź puste, są zaznaczone na czerwono
            </Alert>
            <Cells translation = {this.state.translation} languages = {this.state.languages}/>
          </section>
        }
        { this.state.error &&
          <Alert bsstyle='danger'>
            { this.state.errorMessage }
          </Alert>
        }
      </div>
    );
  }
}
;
export default App;
