1 files changed, 33 insertions, 27 deletions
diff --git a/modern/src/settings/ComputedAttributePage.js b/modern/src/settings/ComputedAttributePage.js
index 73759fa..fea613a 100644
--- a/modern/src/settings/ComputedAttributePage.js
+++ b/modern/src/settings/ComputedAttributePage.js
@@ -1,19 +1,19 @@
 import React, { useState } from 'react';
-import { Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography,  FormControl, InputLabel, MenuItem, Select, TextField } from "@material-ui/core";
+import {
+  Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography, FormControl, InputLabel, MenuItem, Select, TextField,
+} from '@material-ui/core';
+import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
 import t from '../common/localization';
 import EditItemView from '../EditItemView';
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
 import positionAttributes from '../attributes/positionAttributes';
 
-
 const useStyles = makeStyles(() => ({
   details: {
     flexDirection: 'column',
   },
 }));
 
-const ComputedAttributePage =() => {
-
+const ComputedAttributePage = () => {
   const classes = useStyles();
   const [item, setItem] = useState();
   const [key, setKey] = useState();
@@ -24,20 +24,21 @@ const ComputedAttributePage =() => {
     type: value.type,
   }));
 
-  const handleChange = event => {
+  const handleChange = (event) => {
     const newValue = event.target.value;
     setKey(newValue);
     const positionAttribute = positionAttributes[newValue];
-    if(positionAttribute && positionAttribute.type) {
-      setItem({...item, attribute: newValue, type: positionAttribute.type});
+    if (positionAttribute && positionAttribute.type) {
+      setItem({ ...item, attribute: newValue, type: positionAttribute.type });
     } else {
-      setItem({...item, attribute: newValue});
+      setItem({ ...item, attribute: newValue });
     }
-  }
+  };
 
   return (
     <EditItemView endpoint="/attributes/computed" item={item} setItem={setItem}>
-      {item &&
+      {item
+        && (
         <Accordion defaultExpanded>
           <AccordionSummary expandIcon={<ExpandMoreIcon />}>
             <Typography variant="subtitle1">
@@ -48,46 +49,51 @@ const ComputedAttributePage =() => {
             <TextField
               margin="normal"
               value={item.description || ''}
-              onChange={event => setItem({...item, description: event.target.value})}
+              onChange={(event) => setItem({ ...item, description: event.target.value })}
               label={t('sharedDescription')}
-              variant="filled" />
+              variant="filled"
+            />
             <FormControl variant="filled" margin="normal" fullWidth>
               <InputLabel>{t('sharedAttribute')}</InputLabel>
-              <Select 
-                value={item.attribute || ''} 
-                onChange={handleChange}>
+              <Select
+                value={item.attribute || ''}
+                onChange={handleChange}
+              >
                 {options.map((option) => (
                   <MenuItem key={option.key} value={option.key}>{option.name}</MenuItem>
                 ))}
               </Select>
-            </FormControl>            
+            </FormControl>
             <TextField
               margin="normal"
               value={item.expression || ''}
-              onChange={event => setItem({...item, expression: event.target.value})}
+              onChange={(event) => setItem({ ...item, expression: event.target.value })}
               label={t('sharedExpression')}
               multiline
               rows={4}
-              variant="filled" />
+              variant="filled"
+            />
             <FormControl
               variant="filled"
               margin="normal"
               fullWidth
-              disabled={key in positionAttributes}>
+              disabled={key in positionAttributes}
+            >
               <InputLabel>{t('sharedType')}</InputLabel>
               <Select
                 value={item.type || ''}
-                onChange={event => setItem({...item, type: event.target.value})}>
-                <MenuItem value={'string'}>{t('sharedTypeString')}</MenuItem>
-                <MenuItem value={'number'}>{t('sharedTypeNumber')}</MenuItem>
-                <MenuItem value={'boolean'}>{t('sharedTypeBoolean')}</MenuItem>
+                onChange={(event) => setItem({ ...item, type: event.target.value })}
+              >
+                <MenuItem value="string">{t('sharedTypeString')}</MenuItem>
+                <MenuItem value="number">{t('sharedTypeNumber')}</MenuItem>
+                <MenuItem value="boolean">{t('sharedTypeBoolean')}</MenuItem>
               </Select>
             </FormControl>
           </AccordionDetails>
         </Accordion>
-      }
+        )}
     </EditItemView>
-  )
-}
+  );
+};
 
 export default ComputedAttributePage;