From a4c2f0477dcda2662a3fd268f77a7549dead6e67 Mon Sep 17 00:00:00 2001
From: Anton Tananaev <anton.tananaev@gmail.com>
Date: Sat, 5 Dec 2020 17:23:44 -0800
Subject: Fix default and empty values (fix #802)

---
 modern/src/DevicePage.js                    | 15 ++++++++-------
 modern/src/UserPage.js                      |  4 ++--
 modern/src/admin/ServerPage.js              |  2 +-
 modern/src/attributes/EditAttributesView.js |  2 +-
 modern/src/form/SelectField.js              |  9 +++++----
 modern/src/settings/GroupPage.js            |  4 ++--
 modern/src/settings/NotificationPage.js     |  9 +++++----
 7 files changed, 24 insertions(+), 21 deletions(-)

diff --git a/modern/src/DevicePage.js b/modern/src/DevicePage.js
index a8a3de6..145ecc9 100644
--- a/modern/src/DevicePage.js
+++ b/modern/src/DevicePage.js
@@ -36,13 +36,13 @@ const DevicePage = () => {
             <AccordionDetails className={classes.details}>
               <TextField
                 margin="normal"
-                defaultValue={item.name}
+                value={item.name || ''}
                 onChange={event => setItem({...item, name: event.target.value})}
                 label={t('sharedName')}
                 variant="filled" />
               <TextField
                 margin="normal"
-                defaultValue={item.uniqueId}
+                value={item.uniqueId || ''}
                 onChange={event => setItem({...item, uniqueId: event.target.value})}
                 label={t('deviceIdentifier')}
                 variant="filled" />
@@ -57,32 +57,33 @@ const DevicePage = () => {
             <AccordionDetails className={classes.details}>
               <SelectField
                 margin="normal"
-                defaultValue={item.groupId}
+                value={item.groupId || 0}
                 onChange={event => setItem({...item, groupId: Number(event.target.value)})}
                 endpoint="/api/groups"
                 label={t('groupParent')}
                 variant="filled" />
               <TextField
                 margin="normal"
-                defaultValue={item.phone}
+                value={item.phone || ''}
                 onChange={event => setItem({...item, phone: event.target.value})}
                 label={t('sharedPhone')}
                 variant="filled" />
               <TextField
                 margin="normal"
-                defaultValue={item.model}
+                value={item.model || ''}
                 onChange={event => setItem({...item, model: event.target.value})}
                 label={t('deviceModel')}
                 variant="filled" />
               <TextField
                 margin="normal"
-                defaultValue={item.contact}
+                value={item.contact || ''}
                 onChange={event => setItem({...item, contact: event.target.value})}
                 label={t('deviceContact')}
                 variant="filled" />
               <SelectField
                 margin="normal"
-                defaultValue={item.category}
+                value={item.category || 'default'}
+                emptyValue={null}
                 onChange={event => setItem({...item, category: event.target.value})}
                 data={deviceCategories.map(category => ({
                   id: category,
diff --git a/modern/src/UserPage.js b/modern/src/UserPage.js
index 0fa0918..dfe8b98 100644
--- a/modern/src/UserPage.js
+++ b/modern/src/UserPage.js
@@ -33,13 +33,13 @@ const UserPage = () => {
             <AccordionDetails className={classes.details}>
               <TextField
                 margin="normal"
-                defaultValue={item.name}
+                value={item.name || ''}
                 onChange={event => setItem({...item, name: event.target.value})}
                 label={t('sharedName')}
                 variant="filled" />
               <TextField
                 margin="normal"
-                defaultValue={item.email}
+                value={item.email || ''}
                 onChange={event => setItem({...item, email: event.target.value})}
                 label={t('userEmail')}
                 variant="filled" />
diff --git a/modern/src/admin/ServerPage.js b/modern/src/admin/ServerPage.js
index d896104..43664e5 100644
--- a/modern/src/admin/ServerPage.js
+++ b/modern/src/admin/ServerPage.js
@@ -63,7 +63,7 @@ const ServerPage = () => {
               <AccordionDetails className={classes.details}>
                 <TextField
                   margin="normal"
-                  defaultValue={item.announcement}
+                  value={item.announcement || ''}
                   onChange={event => setItem({...item, announcement: event.target.value})}
                   label={t('serverAnnouncement')}
                   variant="filled" />
diff --git a/modern/src/attributes/EditAttributesView.js b/modern/src/attributes/EditAttributesView.js
index 9491acc..619d857 100644
--- a/modern/src/attributes/EditAttributesView.js
+++ b/modern/src/attributes/EditAttributesView.js
@@ -106,7 +106,7 @@ const EditAttributesView = ({ attributes, setAttributes, definitions }) => {
               <InputLabel>{getAttributeName(key)}</InputLabel>
               <FilledInput
                 type={type === 'number' ? 'number' : 'text'}
-                defaultValue={value}
+                value={value || ''}
                 onChange={e => updateAttribute(key, e.target.value)}
                 endAdornment={
                   <InputAdornment position="end">
diff --git a/modern/src/form/SelectField.js b/modern/src/form/SelectField.js
index fa51a36..b179c58 100644
--- a/modern/src/form/SelectField.js
+++ b/modern/src/form/SelectField.js
@@ -7,7 +7,8 @@ const SelectField = ({
   variant,
   label,
   multiple,
-  defaultValue,
+  value,
+  emptyValue = 0,
   onChange,
   endpoint,
   data,
@@ -31,10 +32,10 @@ const SelectField = ({
         <InputLabel>{label}</InputLabel>
         <Select
           multiple={multiple}
-          defaultValue={defaultValue}
+          value={value}
           onChange={onChange}>
-          {!multiple &&
-            <MenuItem value={0}>&nbsp;</MenuItem>
+          {!multiple && emptyValue !== null &&
+            <MenuItem value={emptyValue}>&nbsp;</MenuItem>
           }
           {items.map(item => (
             <MenuItem key={keyGetter(item)} value={keyGetter(item)}>{titleGetter(item)}</MenuItem>
diff --git a/modern/src/settings/GroupPage.js b/modern/src/settings/GroupPage.js
index b6a2859..b9fa871 100644
--- a/modern/src/settings/GroupPage.js
+++ b/modern/src/settings/GroupPage.js
@@ -33,7 +33,7 @@ const GroupPage = () => {
             <AccordionDetails className={classes.details}>
               <TextField
                 margin="normal"
-                defaultValue={item.name}
+                value={item.name || ''}
                 onChange={event => setItem({...item, name: event.target.value})}
                 label={t('sharedName')}
                 variant="filled" />
@@ -48,7 +48,7 @@ const GroupPage = () => {
             <AccordionDetails className={classes.details}>
               <SelectField
                 margin="normal"
-                defaultValue={item.groupId}
+                value={item.groupId || 0}
                 onChange={event => setItem({...item, groupId: Number(event.target.value)})}
                 endpoint="/api/groups"
                 label={t('groupParent')}
diff --git a/modern/src/settings/NotificationPage.js b/modern/src/settings/NotificationPage.js
index 2cf8a62..33904e7 100644
--- a/modern/src/settings/NotificationPage.js
+++ b/modern/src/settings/NotificationPage.js
@@ -36,7 +36,8 @@ const NotificationPage = () => {
             <AccordionDetails className={classes.details}>
               <SelectField
                 margin="normal"
-                defaultValue={item.type}
+                value={item.type || 'alarm'}
+                emptyValue={null}
                 onChange={e => setItem({...item, type: e.target.value})}
                 endpoint="/api/notifications/types"
                 keyGetter={it => it.type}
@@ -46,18 +47,18 @@ const NotificationPage = () => {
               <SelectField
                 multiple
                 margin="normal"
-                defaultValue={item.notificators ? item.notificators.split(/[, ]+/) : []}
+                value={item.notificators ? item.notificators.split(/[, ]+/) : []}
                 onChange={e => setItem({...item, notificators: e.target.value.join()})}
                 endpoint="/api/notifications/notificators"
                 keyGetter={it => it.type}
                 titleGetter={it => t(prefixString('notificator', it.type))}
                 label={t('notificationNotificators')}
                 variant="filled" />
-              {item.type === 'alarm' &&
+              {(!item.type || item.type === 'alarm') &&
                 <SelectField
                   multiple
                   margin="normal"
-                  defaultValue={item.attributes && item.attributes.alarms ? item.attributes.alarms.split(/[, ]+/) : []}
+                  value={item.attributes && item.attributes.alarms ? item.attributes.alarms.split(/[, ]+/) : []}
                   onChange={e => setItem({...item, attributes: {...item.attributes, alarms: e.target.value.join()}})}
                   data={alarms}
                   keyGetter={it => it.key}
-- 
cgit v1.2.3