API endpoint check

src/components/job.jsx

@@ -50,7 +50,7 @@ class Job extends Component {
   }
 
   fetchStats = () => {
-    return API({
+    return API.request({
       url: "/core/stats",
       data: {
         group: "job/" + this.props.jobid
@@ -61,13 +61,13 @@ class Job extends Component {
 
       this.setState({ stats: response.data })
     })
-    .catch(err => console.log(err))
+    .catch(() => {})
   }
 
   fetchJobInfo = id => {
     if (!id) id = this.state.jobid
 
-    return API({
+    return API.request({
       url: "/job/status",
       data: {
         jobid: this.props.jobid
@@ -78,18 +78,18 @@ class Job extends Component {
 
       this.setState({ jobstatus: response.data })
     })
-    .catch(err => console.error(err))
+    .catch(() => {})
   }
 
   stopJob = () => {
-    return API({
+    return API.request({
       url: "/job/stop",
       data: {
         jobid: this.props.jobid
       }
     })
     .then(() => this.props.refreshStats())
-    .catch(err => console.error(err))
+    .catch(() => {})
   }
 
   renderSize = bytes => {

src/components/settings.jsx

@@ -16,8 +16,8 @@ class Settings extends Component {
   componentDidMount = () => this.fetchSettings()
 
   fetchSettings = () => {
-    return new Promise((resolve, reject) => {
-      return API({
+    return new Promise((resolve) => {
+      return API.request({
         url: "/options/get"
       })
       .then(response => {
@@ -27,14 +27,13 @@ class Settings extends Component {
 
         return resolve()
       })
-      .catch(reject)
+      .catch(() => {})
     })
   }
 
   showSettings = () => {
-    this.fetchSettings()
+    return this.fetchSettings()
     .then(() => this.setState({ show: true }))
-    .catch(err => console.error(err))
   }
 
   renderSettings = () => {

src/utils/API.js

@@ -1,8 +1,56 @@
 import axios from 'axios'
 
-const API = axios.create({
-  method: "POST",
-  baseURL: "http://192.168.1.70:5572"
-})
+class API {
+  constructor() {
+    this.available = true
+    this.retryInterval = undefined
+    this.instance = axios.create({
+      method: "POST",
+      baseURL: "http://localhost:5572"
+    })
+  }
 
-export default API
+  request = options => {
+    return new Promise((resolve, reject) => {
+      if (!this.available) return reject()
+
+      return this.instance(options)
+      .then(response => {
+        if (!response.data) throw new Error("no data in response")
+        this.available = true
+        return resolve(response)
+      })
+      .catch(err => {
+        // endpoint was unreachable
+        if ((!err || !err.response || !err.response.status) && this.available) {
+          this.available = false
+          if (this.retryInterval === undefined) this.retryInterval = setInterval(this.retryStatus, 5000);
+        }
+
+        // log error and reject
+        console.error(err)
+        return reject()
+      })
+    })
+  }
+
+  /**
+   * when the endpoint is unavailable it will be retried every 5 seconds
+   */
+  retryStatus = () => {
+    return this.instance({
+      url: "/core/version"
+    })
+    .then(() => {
+      this.available = true
+      clearInterval(this.retryInterval)
+    })
+    .catch(err => {})
+  }
+
+  getEndpointStatus = () => this.available
+}
+
+const APIClass = new API()
+
+export default APIClass