From 3972e6ca1a0b66cbeda175c1ea15e5f7d877993a Mon Sep 17 00:00:00 2001
From: Collin Beczak <88843144+CollinBeczak@users.noreply.github.com>
Date: Fri, 1 Sep 2023 15:25:04 -0500
Subject: [PATCH] Add Api Version Number in Footer (#2075)

* Add Api Version Number in Footer

* fix formatting
---
 src/components/Footer/Footer.js   | 36 +++++++++++++++++++++++++++++++
 src/components/Footer/Messages.js |  5 +++++
 2 files changed, 41 insertions(+)

diff --git a/src/components/Footer/Footer.js b/src/components/Footer/Footer.js
index d326d75fc..77ba32e69 100644
--- a/src/components/Footer/Footer.js
+++ b/src/components/Footer/Footer.js
@@ -4,6 +4,29 @@ import SvgSymbol from '../SvgSymbol/SvgSymbol'
 import messages from './Messages'
 
 class Footer extends Component {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      data : null
+    };
+  }
+
+  componentDidMount() {
+    this.renderMyData();
+  }
+
+  renderMyData(){
+    fetch(`${process.env.REACT_APP_MAP_ROULETTE_SERVER_URL}/api/v2/service/info`)
+        .then((response) => response.json())
+        .then((responseJson) => {
+          this.setState({ data : responseJson })
+        })
+        .catch((error) => {
+          console.error(error);
+        });
+  }
+  
   render() {
     return (
       <footer
@@ -22,6 +45,19 @@ class Footer extends Component {
                   </a>
                 </span>
               </h3>
+             { this.state.data ? 
+              <h3 className="mr-text-white mr-text-md mr-mb-2">
+                  <FormattedMessage {...messages.APIVersionLabel} />{' '}
+                  <span className="mr-text-green-light mr-font-mono mr-text-base">
+                    <a
+                      href={`https://github.com/maproulette/maproulette-backend/releases/tag/v${this.state.data.compiletime.version}`}
+                    >
+                      v{this.state.data.compiletime.version}
+                    </a>
+                  </span>
+                </h3> : 
+                null 
+              }
             </div>
 
             <div className="mr-mb-8 md:mr-mb-0 md:mr-px-4 md:mr-flex-1">
diff --git a/src/components/Footer/Messages.js b/src/components/Footer/Messages.js
index 6dba0298f..f86e31551 100644
--- a/src/components/Footer/Messages.js
+++ b/src/components/Footer/Messages.js
@@ -9,6 +9,11 @@ export default defineMessages({
     defaultMessage: "MapRoulette",
   },
 
+  APIVersionLabel: {
+    id: "Footer.APIversionLabel",
+    defaultMessage: "MaprouletteAPI",
+  },
+
   getHelp: {
     id: "Footer.getHelp",
     defaultMessage: "Get Help",