Special attributes for units

4 files changed, 69 insertions, 14 deletions

diff --git a/modern/src/UserPage.js b/modern/src/UserPage.js
index c6274af9..d53777a5 100644
--- a/modern/src/UserPage.js
+++ b/modern/src/UserPage.js
@@ -2,7 +2,7 @@ import React, { useState } from 'react';
 import TextField from '@material-ui/core/TextField';
 
 import {
-  Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography,
+  Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography, FormControl, InputLabel, Select, MenuItem,
 } from '@material-ui/core';
 import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
 import { useDispatch, useSelector } from 'react-redux';
@@ -86,6 +86,39 @@ const UserPage = () => {
                 label={t('sharedPhone')}
                 variant="filled"
               />
+              <FormControl variant="filled" margin="normal" fullWidth>
+                <InputLabel>{t('settingsSpeedUnit')}</InputLabel>
+                <Select
+                  value={item.attributes.speedUnit || 'kn'}
+                  onChange={(event) => setItem({ ...item, attributes: { ...item.attributes, speedUnit: event.target.value } })}
+                >
+                  <MenuItem value="kn">{t('sharedKn')}</MenuItem>
+                  <MenuItem value="kmh">{t('sharedKmh')}</MenuItem>
+                  <MenuItem value="mph">{t('sharedMph')}</MenuItem>
+                </Select>
+              </FormControl>
+              <FormControl variant="filled" margin="normal" fullWidth>
+                <InputLabel>{t('settingsDistanceUnit')}</InputLabel>
+                <Select
+                  value={item.attributes.distanceUnit || 'km'}
+                  onChange={(event) => setItem({ ...item, attributes: { ...item.attributes, distanceUnit: event.target.value } })}
+                >
+                  <MenuItem value="km">{t('sharedKm')}</MenuItem>
+                  <MenuItem value="mi">{t('sharedMi')}</MenuItem>
+                  <MenuItem value="nmi">{t('sharedNmi')}</MenuItem>
+                </Select>
+              </FormControl>
+              <FormControl variant="filled" margin="normal" fullWidth>
+                <InputLabel>{t('settingsVolumeUnit')}</InputLabel>
+                <Select
+                  value={item.attributes.volumeUnit || 'ltr'}
+                  onChange={(event) => setItem({ ...item, attributes: { ...item.attributes, volumeUnit: event.target.value } })}
+                >
+                  <MenuItem value="ltr">{t('sharedLiter')}</MenuItem>
+                  <MenuItem value="usGal">{t('sharedUsGallon')}</MenuItem>
+                  <MenuItem value="impGal">{t('sharedImpGallon')}</MenuItem>
+                </Select>
+              </FormControl>
               <TextField
                 margin="normal"
                 value={item.poiLayer || ''}
diff --git a/modern/src/admin/ServerPage.js b/modern/src/admin/ServerPage.js
index 33f8eeee..5d47c35b 100644
--- a/modern/src/admin/ServerPage.js
+++ b/modern/src/admin/ServerPage.js
@@ -109,6 +109,39 @@ const ServerPage = () => {
                     <MenuItem value="dms">{t('sharedDegreesMinutesSeconds')}</MenuItem>
                   </Select>
                 </FormControl>
+                <FormControl variant="filled" margin="normal" fullWidth>
+                  <InputLabel>{t('settingsSpeedUnit')}</InputLabel>
+                  <Select
+                    value={item.attributes.speedUnit || 'kn'}
+                    onChange={(event) => setItem({ ...item, attributes: { ...item.attributes, speedUnit: event.target.value } })}
+                  >
+                    <MenuItem value="kn">{t('sharedKn')}</MenuItem>
+                    <MenuItem value="kmh">{t('sharedKmh')}</MenuItem>
+                    <MenuItem value="mph">{t('sharedMph')}</MenuItem>
+                  </Select>
+                </FormControl>
+                <FormControl variant="filled" margin="normal" fullWidth>
+                  <InputLabel>{t('settingsDistanceUnit')}</InputLabel>
+                  <Select
+                    value={item.attributes.distanceUnit || 'km'}
+                    onChange={(event) => setItem({ ...item, attributes: { ...item.attributes, distanceUnit: event.target.value } })}
+                  >
+                    <MenuItem value="km">{t('sharedKm')}</MenuItem>
+                    <MenuItem value="mi">{t('sharedMi')}</MenuItem>
+                    <MenuItem value="nmi">{t('sharedNmi')}</MenuItem>
+                  </Select>
+                </FormControl>
+                <FormControl variant="filled" margin="normal" fullWidth>
+                  <InputLabel>{t('settingsVolumeUnit')}</InputLabel>
+                  <Select
+                    value={item.attributes.volumeUnit || 'ltr'}
+                    onChange={(event) => setItem({ ...item, attributes: { ...item.attributes, volumeUnit: event.target.value } })}
+                  >
+                    <MenuItem value="ltr">{t('sharedLiter')}</MenuItem>
+                    <MenuItem value="usGal">{t('sharedUsGallon')}</MenuItem>
+                    <MenuItem value="impGal">{t('sharedImpGallon')}</MenuItem>
+                  </Select>
+                </FormControl>
                 <TextField
                   margin="normal"
                   value={item.poiLayer || ''}
diff --git a/modern/src/attributes/EditAttributesView.js b/modern/src/attributes/EditAttributesView.js
index 4343fde4..af90a73a 100644
--- a/modern/src/attributes/EditAttributesView.js
+++ b/modern/src/attributes/EditAttributesView.js
@@ -105,7 +105,8 @@ const EditAttributesView = ({ attributes, setAttributes, definitions }) => {
   const convertToList = (attributes) => {
     const booleanList = [];
     const otherList = [];
-    Object.keys(attributes || []).forEach((key) => {
+    const excludeAttributes = ['speedUnit', 'distanceUnit', 'volumeUnit'];
+    Object.keys(attributes || []).filter((key) => !excludeAttributes.includes(key)).forEach((key) => {
       const value = attributes[key];
       const type = getAttributeType(value);
       const subtype = getAttributeSubtype(key);
diff --git a/modern/src/attributes/useUserAttributes.js b/modern/src/attributes/useUserAttributes.js
index 0101d2f5..3c5ea019 100644
--- a/modern/src/attributes/useUserAttributes.js
+++ b/modern/src/attributes/useUserAttributes.js
@@ -45,18 +45,6 @@ export default (t) => useMemo(() => ({
     name: t('attributeUiHidePositionAttributes'),
     type: 'string',
   },
-  distanceUnit: {
-    name: t('settingsDistanceUnit'),
-    type: 'string',
-  },
-  speedUnit: {
-    name: t('settingsSpeedUnit'),
-    type: 'string',
-  },
-  volumeUnit: {
-    name: t('settingsVolumeUnit'),
-    type: 'string',
-  },
   timezone: {
     name: t('sharedTimezone'),
     type: 'string',