diff --git a/Dockerfile b/Dockerfile
index 5503910..c825a18 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -21,8 +21,10 @@ RUN npm install -g serve
# environment variables
ENV Author="Tudor Stanciu"
-ARG APP_VERSION=0.0.0.0
+ARG APP_VERSION=0.0.0
+ARG APP_DATE=1900-01-01
ENV APP_VERSION=${APP_VERSION}
+ENV APP_DATE=${REACT_APP_DATE}
#set workdir to root
WORKDIR /
diff --git a/config.js b/config.js
index 31f4240..673851e 100644
--- a/config.js
+++ b/config.js
@@ -1,5 +1,7 @@
const dev = {
NODE_ENV: "development",
+ APP_VERSION: "0.0.0",
+ APP_DATE: "1900-01-01",
REVERSE_PROXY_API_URL: "http://localhost:5050",
CHATBOT_API_URL: "http://localhost:5061",
REVERSE_PROXY_DOCS_URL: "https://toodle.ddns.net/hedgedoc/s/UkJ6S5NJz"
@@ -7,6 +9,8 @@ const dev = {
const prod = {
NODE_ENV: "production",
+ APP_VERSION: "0.0.0",
+ APP_DATE: "1900-01-01",
PUBLIC_URL: "/reverse-proxy",
REVERSE_PROXY_API_URL: "https://toodle.ddns.net/reverse-proxy-api",
CHATBOT_API_URL: "https://toodle.ddns.net/chatbot-api",
diff --git a/public/locales/en/translations.json b/public/locales/en/translations.json
index 489c76d..35bd876 100644
--- a/public/locales/en/translations.json
+++ b/public/locales/en/translations.json
@@ -170,6 +170,13 @@
"Platform": "API platform"
},
"Description": "This system is composed of three micro services, each with a well-defined role. The server (reverse proxy) is the only one that can work completely independently of the others, the api and the UI being auxiliary and having a role of visualizing the server's activity.",
+ "Versions": {
+ "Title": "Component versions",
+ "Server": "Server: {{version}}",
+ "Api": "API: {{version}}",
+ "Frontend": "UI: {{version}}"
+ },
+ "LastUpdateDate": "Last update date: {{date}}",
"Components": {
"Server": "Server:",
"Api": "API:",
diff --git a/public/locales/ro/translations.json b/public/locales/ro/translations.json
index 0c1d24b..a867974 100644
--- a/public/locales/ro/translations.json
+++ b/public/locales/ro/translations.json
@@ -161,6 +161,13 @@
"Platform": "Platformă API"
},
"Description": "Acest sistem este compus din trei microservicii, fiecare avand un rol bine definit. Serverul (reverse proxy-ul) este singurul care poate funcționa complet independent de celelalte, API-ul și UI-ul fiind auxiliare și având un rol de vizualizare a activității serverului.",
+ "Versions": {
+ "Title": "Versiuni componente",
+ "Server": "Server: {{version}}",
+ "Api": "API: {{version}}",
+ "Frontend": "UI: {{version}}"
+ },
+ "LastUpdateDate": "Data ultimei actualizări: {{date}}",
"Components": {
"Server": "Server:",
"Api": "API:",
diff --git a/src/features/system/components/SystemExtensionArea.js b/src/features/system/components/SystemExtensionArea.js
index e008167..ebbf7f8 100644
--- a/src/features/system/components/SystemExtensionArea.js
+++ b/src/features/system/components/SystemExtensionArea.js
@@ -1,7 +1,8 @@
import React from "react";
+import SystemVersionContainer from "./version/SystemVersionContainer";
const SystemExtensionArea = () => {
- return <>...;
+ return ;
};
export default SystemExtensionArea;
diff --git a/src/features/system/components/SystemVersionComponent.js b/src/features/system/components/SystemVersionComponent.js
deleted file mode 100644
index e491712..0000000
--- a/src/features/system/components/SystemVersionComponent.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import React from "react";
-import PropTypes from "prop-types";
-
-const SystemVersionComponent = ({ data }) => {
- return <>...;
-};
-
-SystemVersionComponent.propTypes = {
- data: PropTypes.object.isRequired
-};
-
-export default SystemVersionComponent;
diff --git a/src/features/system/components/version/SystemVersionComponent.js b/src/features/system/components/version/SystemVersionComponent.js
new file mode 100644
index 0000000..0c8d3b3
--- /dev/null
+++ b/src/features/system/components/version/SystemVersionComponent.js
@@ -0,0 +1,134 @@
+import React, { useMemo } from "react";
+import PropTypes from "prop-types";
+import { makeStyles } from "@material-ui/core/styles";
+import {
+ Typography,
+ List,
+ ListItem,
+ ListItemText,
+ ListItemAvatar
+} from "@material-ui/core";
+import Avatar from "@material-ui/core/Avatar";
+import WebAssetIcon from "@material-ui/icons/WebAsset";
+import DnsRoundedIcon from "@material-ui/icons/DnsRounded";
+import SettingsInputSvideoIcon from "@material-ui/icons/SettingsInputSvideo";
+import { useTranslation } from "react-i18next";
+
+const useStyles = makeStyles(theme => {
+ debugger;
+ return {
+ root: {
+ display: "flex",
+ flexDirection: "row",
+ padding: 0
+ },
+ value: {
+ fontSize: "0.9rem",
+ fontWeight: theme.typography.fontWeightMedium
+ }
+ };
+});
+
+const SystemVersionComponent = ({ data }) => {
+ const classes = useStyles();
+ const { t } = useTranslation();
+
+ const lastUpdateDate = useMemo(() => {
+ const format = "DD-MM-YYYY HH:mm:ss";
+ const server = t("DATE_FORMAT", {
+ date: {
+ value: data.server.lastUpdateDate,
+ format
+ }
+ });
+
+ const api = t("DATE_FORMAT", {
+ date: {
+ value: data.api.lastUpdateDate,
+ format
+ }
+ });
+
+ const frontend = t("DATE_FORMAT", {
+ date: {
+ value: process.env.APP_DATE,
+ format
+ }
+ });
+
+ return { server, api, frontend };
+ }, [data, t]);
+
+ return (
+ <>
+
+ {t("System.Versions.Title")}
+
+
+
+
+
+
+
+
+
+ {t("System.Versions.Server", {
+ version: data.server.version
+ })}
+
+ }
+ secondary={t("System.LastUpdateDate", {
+ date: lastUpdateDate.server
+ })}
+ />
+
+
+
+
+
+
+
+
+ {t("System.Versions.Api", {
+ version: data.api.version
+ })}
+
+ }
+ secondary={t("System.LastUpdateDate", {
+ date: lastUpdateDate.api
+ })}
+ />
+
+
+
+
+
+
+
+
+ {t("System.Versions.Frontend", {
+ version: process.env.APP_VERSION
+ })}
+
+ }
+ secondary={t("System.LastUpdateDate", {
+ date: lastUpdateDate.frontend
+ })}
+ />
+
+
+
+ );
+};
+
+SystemVersionComponent.propTypes = {
+ data: PropTypes.object.isRequired
+};
+
+export default SystemVersionComponent;
diff --git a/src/features/system/components/SystemVersionContainer.js b/src/features/system/components/version/SystemVersionContainer.js
similarity index 85%
rename from src/features/system/components/SystemVersionContainer.js
rename to src/features/system/components/version/SystemVersionContainer.js
index 6915ba5..46b91a4 100644
--- a/src/features/system/components/SystemVersionContainer.js
+++ b/src/features/system/components/version/SystemVersionContainer.js
@@ -2,7 +2,7 @@ import React, { useEffect } from "react";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import PropTypes from "prop-types";
-import { loadSystemVersion } from "../actionCreators";
+import { loadSystemVersion } from "../../actionCreators";
import SystemVersionComponent from "./SystemVersionComponent";
const SystemVersionContainer = ({ actions, data }) => {
@@ -10,7 +10,7 @@ const SystemVersionContainer = ({ actions, data }) => {
actions.loadSystemVersion();
}, []);
- return ;
+ return <>{data.loaded && };
};
SystemVersionContainer.propTypes = {