added version number from package.json and commit hash to footer

7 files changed, 61 insertions, 11 deletions

diff --git a/api/api.ts b/api/api.ts
index d0dee96..a2a1e95 100644
--- a/api/api.ts
+++ b/api/api.ts
@@ -62,3 +62,11 @@ export interface gameInfo {
 	started: number;
 	status: 'finished' | 'in_progress' | 'resign' | 'wait_for_opponent';
 }
+
+export interface serverStatus {
+	games: number;
+	version: {
+		commit: string;
+		number: string;
+	};
+}
diff --git a/api/log.py b/api/log.py
index c006f67..b8b7e4a 100644
--- a/api/log.py
+++ b/api/log.py
@@ -5,12 +5,8 @@ from os import environ
 load_dotenv()
 
 # logging module wrapper (same as db.py)
-log_level = [
-            None,
-            logging.ERROR,
-            logging.WARNING,
-            logging.INFO
-        ][int(environ["CONNECT4_LOG_LEVEL"])]
+log_level = [None, logging.ERROR, logging.WARNING,
+             logging.INFO][int(environ["CONNECT4_LOG_LEVEL"])]
 
 logging.basicConfig(format="[ %(levelname)s ]: %(message)s", level=log_level)
 
diff --git a/api/main.py b/api/main.py
index 58f9ac1..4c043f6 100644
--- a/api/main.py
+++ b/api/main.py
@@ -10,4 +10,9 @@ load_dotenv()
 
 # start the flask/socket.io server
 if __name__ == "__main__":
-    io.run(app, host="127.0.0.1", port=5000, debug=bool(int(environ["CONNECT4_DEBUG"])))
+    io.run(
+        app,
+        host="127.0.0.1",
+        port=5000,
+        debug=bool(int(environ["CONNECT4_DEBUG"]))
+    )
diff --git a/api/readme.md b/api/readme.md
index 6d0da60..d904f42 100644
--- a/api/readme.md
+++ b/api/readme.md
@@ -28,7 +28,11 @@ API return type classes are mostly defined in api/api.ts
 ```ts
 {
   users: int,
-  games: int
+  games: int,
+  version: {
+    commit: string,
+    number: string
+  }
 }
 ```
 
diff --git a/api/status.py b/api/status.py
index 32f96ee..a609d42 100644
--- a/api/status.py
+++ b/api/status.py
@@ -1,5 +1,11 @@
 from flask import Blueprint
 from db import cursor
+import json
+
+version = {
+    "number": json.loads(open("package.json", "r").read())["version"],
+    "commit": open(".git/refs/heads/master", "r").read().strip()
+}
 
 status = Blueprint('server_status', __name__)
 
@@ -13,7 +19,9 @@ def index():
             cursor.execute(
                 "select game_id from games where status = \"in_progress\""
             ).fetchall()
-        )
+        ),
+        "version":
+        version
     }
 
 
diff --git a/components/footer.tsx b/components/footer.tsx
index 8a1319e..575f7e9 100644
--- a/components/footer.tsx
+++ b/components/footer.tsx
@@ -1,5 +1,8 @@
-import { ReactNode } from 'react';
+import axios from 'axios';
+import { ReactNode, useEffect, useState } from 'react';
 import * as cookie from 'react-cookies';
+
+import { serverStatus } from '../api/api';
 import Logo from '../components/logo';
 
 import ExitToAppOutlinedIcon from '@material-ui/icons/ExitToAppOutlined';
@@ -25,11 +28,24 @@ function PageLink(props: {
 
 export function Footer() {
 	var loggedIn = !!cookie.load('token');
+	var [status, setStatus] = useState<serverStatus>();
+
+	useEffect(() => {
+		axios.request<serverStatus>({
+			url: '/api/status',
+		}).then(res => {
+			setStatus(res.data);
+		});
+	}, []);
 
 	return <div className='footer'>
-		<div className='header'>
+		<div className='header posrel'>
 			<Logo />
 			<h2>4 op een rij</h2>
+			<span className='versionString subtile posabs abscenterv'>
+				<span className='number'>v{status?.version.number}</span>
+				<span className='commit'>({status?.version.commit.substr(0, 8)})</span>
+			</span>
 		</div>
 		<div className='content'>
 			<div className='column'>
@@ -50,3 +66,6 @@ export function Footer() {
 		</div>
 	</div>;
 }
+
+Footer.getInitialProps = async () => {
+};
diff --git a/styles/footer.css b/styles/footer.css
index c413ade..cd43c7d 100644
--- a/styles/footer.css
+++ b/styles/footer.css
@@ -36,3 +36,13 @@
 	margin-top: 12px;
 	display: block;
 }
+
+.versionString {
+    font-feature-settings: 'tnum' on, 'lnum' on, 'salt' on;
+    margin-left: var(--spacing-small);
+}
+
+.versionString span {
+    margin-left: var(--spacing-small);
+    font-style: normal;
+}