From 4d6d5eca8c6ee8c43340d18d323816885edeb9da Mon Sep 17 00:00:00 2001
From: Anton Tananaev <anton@traccar.org>
Date: Sun, 6 Nov 2022 09:36:10 -0800
Subject: Add debug information

---
 modern/.env                            |  1 +
 modern/src/resources/l10n/en.json      |  3 +++
 modern/src/settings/PreferencesPage.js | 28 ++++++++++++++++++++++++++++
 3 files changed, 32 insertions(+)

(limited to 'modern')

diff --git a/modern/.env b/modern/.env
index 38f15be3..c8702185 100644
--- a/modern/.env
+++ b/modern/.env
@@ -1,2 +1,3 @@
 ESLINT_NO_DEV_ERRORS=false
 REACT_APP_URL_NAME='localhost:8082'
+REACT_APP_VERSION=$npm_package_version
diff --git a/modern/src/resources/l10n/en.json b/modern/src/resources/l10n/en.json
index 9ce29a16..7a3fd272 100644
--- a/modern/src/resources/l10n/en.json
+++ b/modern/src/resources/l10n/en.json
@@ -214,6 +214,9 @@
     "settingsVolumeUnit": "Volume Unit",
     "settingsTwelveHourFormat": "12-hour Format",
     "settingsCoordinateFormat": "Coordinates Format",
+    "settingsServerVersion": "Server Version",
+    "settingsAppVersion": "App Version",
+    "settingsConnection": "Connection",
     "reportTitle": "Reports",
     "reportDevice": "Device",
     "reportGroup": "Group",
diff --git a/modern/src/settings/PreferencesPage.js b/modern/src/settings/PreferencesPage.js
index a7115bf8..e939732a 100644
--- a/modern/src/settings/PreferencesPage.js
+++ b/modern/src/settings/PreferencesPage.js
@@ -66,6 +66,10 @@ const PreferencesPage = () => {
   const user = useSelector((state) => state.session.user);
   const [attributes, setAttributes] = useState(user.attributes);
 
+  const versionApp = process.env.REACT_APP_VERSION.slice(0, -2);
+  const versionServer = useSelector((state) => state.session.server.version);
+  const socket = useSelector((state) => state.session.socket);
+
   const [token, setToken] = useState(null);
   const [tokenExpiration, setTokenExpiration] = useState(moment().add(1, 'week').locale('en').format(moment.HTML5_FMT.DATE));
 
@@ -331,6 +335,30 @@ const PreferencesPage = () => {
                 />
               </AccordionDetails>
             </Accordion>
+            <Accordion>
+              <AccordionSummary expandIcon={<ExpandMoreIcon />}>
+                <Typography variant="subtitle1">
+                  {t('sharedInfoTitle')}
+                </Typography>
+              </AccordionSummary>
+              <AccordionDetails className={classes.details}>
+                <TextField
+                  value={versionApp}
+                  label={t('settingsAppVersion')}
+                  disabled
+                />
+                <TextField
+                  value={versionServer || '-'}
+                  label={t('settingsServerVersion')}
+                  disabled
+                />
+                <TextField
+                  value={socket ? t('deviceStatusOnline') : t('deviceStatusOffline')}
+                  label={t('settingsConnection')}
+                  disabled
+                />
+              </AccordionDetails>
+            </Accordion>
             <div className={classes.buttons}>
               <Button
                 type="button"
-- 
cgit v1.2.3