First connection from ui to server

server/app.py

@@ -1,4 +1,4 @@
-from flask import Flask
+from flask import Flask, jsonify
 from flask_cors import CORS
 import toml
 

ui/src/App.js

@@ -1,10 +1,41 @@
 import React from 'react';
+import { getStatus } from "./services/ggsh.service";
 import './App.css';
 
-function App() {
+class InfoComponent extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      loading: true,
+      version: null,
+      status: null,
+    }
+  }
+
+  async componentDidMount() {
+    const { version, status } = await getStatus();
+    this.setState({loading: false, version, status});
+  }
+
+  render() {
+    if (this.state.loading) {
+      return <p>Connecting to back-end...</p>
+    }
+
+    if (this.state.status !== "healthy") {
+      return <p>Unable to communicate with API server! Error: {this.state.status}</p>
+    }
+    
+    return <p>API Version: {this.state.version}</p>
+  }
+}
+
+const App = () => {
   return (
     <div className="App">
       <p>TerrAssumptions!</p>
+      <hr/>
+      <InfoComponent/>
     </div>
   );
 }

ui/src/services/ggsh.service.js

@@ -1,2 +1,13 @@
 import { API_BASE } from "../config";
 
+export const getStatus = async () => {
+    try {
+        const res = await fetch(API_BASE + "/");
+        if (!res.ok) {
+            throw Error(res.statusText);
+        }
+        return await res.json();
+    } catch (err) {
+        return {status: err.message, version: null}
+    }
+}