Add client.js to handle fetch requests.

Author: Arty26

ui/src/App.js

@@ -1,6 +1,8 @@
 import React, {Component} from 'react';
 import { HashRouter, Route, Link } from 'react-router-dom';
 
+import Client from "./Client";
+
 import reactLogo from './images/react.svg';
 import playLogo from './images/play.svg';
 import scalaLogo from './images/scala.png';
@@ -19,11 +21,10 @@ class App extends Component {
  }
 
  async componentDidMount() {
- const response = await fetch('/summary');
- const resContent = await response.json();
-
- this.setState({
- title: resContent.content
+ Client.getSummary(summary => {
+ this.setState({
+ title: summary.content
+ });
  });
  }
 

ui/src/Client.js

@@ -0,0 +1,27 @@
+/* eslint-disable no-undef */
+function getSummary(cb) {
+ return fetch(`/summary`, {
+ accept: "application/json"
+ })
+ .then(checkStatus)
+ .then(parseJSON)
+ .then(cb);
+}
+
+function checkStatus(response) {
+ if (response.status >= 200 && response.status < 300) {
+ return response;
+ }
+ const error = new Error(`HTTP Error ${response.statusText}`);
+ error.status = response.statusText;
+ error.response = response;
+ console.log(error); // eslint-disable-line no-console
+ throw error;
+}
+
+function parseJSON(response) {
+ return response.json();
+}
+
+const Client = { getSummary };
+export default Client;