Refactoring

src/containers/Configuration/Configuration.js

@@ -246,9 +246,8 @@ class Configuration extends IPCContainer {
         Saving: true,
       },
       () => {
-        const changedItems = [];
-        for (const item of this.state.ChangedItems) {
-          changedItems.push({
+        let changedItems = this.state.ChangedItems.map((item) => {
+          return {
             Name: item.label,
             Value:
               item.type === 'string_array'
@@ -256,22 +255,24 @@ class Configuration extends IPCContainer {
                 : item.type === 'host_list'
                 ? JSON.stringify(item.value)
                 : item.value,
-          });
-        }
+          };
+        });
 
         if (this.state.ChangedObjectLookup) {
           for (const key of Object.keys(this.state.ChangedObjectLookup)) {
-            for (const item of this.state.ChangedObjectLookup[key]) {
-              changedItems.push({
-                Name: key + '.' + item.label,
-                Value:
-                  item.type === 'string_array'
-                    ? item.value.join(';')
-                    : item.type === 'host_list'
-                    ? JSON.stringify(item.value)
-                    : item.value,
-              });
-            }
+            changedItems = changedItems.concat(
+              this.state.ChangedObjectLookup[key].map((item) => {
+                return {
+                  Name: key + '.' + item.label,
+                  Value:
+                    item.type === 'string_array'
+                      ? item.value.join(';')
+                      : item.type === 'host_list'
+                      ? JSON.stringify(item.value)
+                      : item.value,
+                };
+              })
+            );
           }
         }
 
@@ -346,39 +347,40 @@ class Configuration extends IPCContainer {
       autoFocus = value;
     };
 
-    let objectItems = [];
-    for (const key of Object.keys(this.state.ObjectLookup)) {
-      objectItems.push(
+    const objectItems = Object.keys(this.state.ObjectLookup).map((key) => {
+      return (
         <div key={key}>
           <h2>{key}</h2>
           <div>
-            {this.state.ObjectLookup[key].map((k, i) => {
-              const shouldFocus = getAutoFocus();
-              setAutoFocus(false);
-              return !k.advanced ||
-                (this.state.ShowAdvanced && k.advanced && !k.remote) ||
-                this.showRemoteConfigItem(k, this.state.ObjectLookup[key]) ? (
-                <ConfigurationItem
-                  advanced={k.advanced}
-                  autoFocus={shouldFocus}
-                  changed={(e) => this.handleObjectItemChanged(e, key, i)}
-                  grouping={key}
-                  items={this.state.Template[key].template[k.label].items}
-                  key={i}
-                  label={k.label}
-                  readOnly={
-                    this.state.IsRemoteMount &&
-                    (k.label === 'RemoteHostNameOrIp' || k.label === 'RemotePort')
-                  }
-                  template={this.state.Template[key].template[k.label]}
-                  value={k.value}
-                />
-              ) : null;
-            })}
+            {this.state.ObjectLookup[key]
+              .map((k, i) => {
+                const shouldFocus = getAutoFocus();
+                setAutoFocus(false);
+                return !k.advanced ||
+                  (this.state.ShowAdvanced && k.advanced && !k.remote) ||
+                  this.showRemoteConfigItem(k, this.state.ObjectLookup[key]) ? (
+                  <ConfigurationItem
+                    advanced={k.advanced}
+                    autoFocus={shouldFocus}
+                    changed={(e) => this.handleObjectItemChanged(e, key, i)}
+                    grouping={key}
+                    items={this.state.Template[key].template[k.label].items}
+                    key={i}
+                    label={k.label}
+                    readOnly={
+                      this.state.IsRemoteMount &&
+                      (k.label === 'RemoteHostNameOrIp' || k.label === 'RemotePort')
+                    }
+                    template={this.state.Template[key].template[k.label]}
+                    value={k.value}
+                  />
+                ) : null;
+              })
+              .filter((i) => i !== null)}
           </div>
         </div>
       );
-    }
+    });
 
     const configurationItems = this.state.ItemList.map((k, i) => {
       const shouldFocus = autoFocus;
@@ -397,7 +399,7 @@ class Configuration extends IPCContainer {
           value={k.value}
         />
       ) : null;
-    });
+    }).filter((i) => i !== null);
 
     return (
       <div className={'Configuration'}>