[Application configuration support] [Fix component unmount leak]

src/components/MountItem/MountItem.js

@@ -4,21 +4,34 @@ import styles from './MountItem.css';
 import DropDown from '../UI/DropDown/DropDown';
 import Button from '../UI/Button/Button';
 import Loader from 'react-loader-spinner';
+import configureImage from '../../assets/images/configure.png';
 
 export default CSSModules((props) => {
+  let configButton = null;
+  if (props.allowConfig) {
+    configButton = (
+      <img alt=''
+        height={'16px'}
+        onClick={props.configClicked}
+        src={configureImage}
+        style={{padding: 0, border: 0, margin: 0, cursor: 'pointer'}}
+        width={'16px'}/>
+    );
+  }
+
   let inputControl = null;
   let mountWidth = '70%';
   if (props.platform === 'win32') {
-    inputControl = <DropDown disabled={!props.allowMount || props.mounted}
+    inputControl = <DropDown changed={props.changed}
+                             disabled={!props.allowMount || props.mounted}
                              items={props.items}
-                             selected={props.items.indexOf(props.location)}
-                             changed={props.changed}/>;
+                             selected={props.items.indexOf(props.location)}/>;
     mountWidth = '18%';
   } else {
     inputControl = <input disabled={!props.allowMount || props.mounted}
+                          onChange={props.changed}
                           type={'text'}
-                          value={props.location}
-                          onChange={props.changed}/>;
+                          value={props.location}/>;
   }
 
   let actionDisplay = null;
@@ -28,21 +41,29 @@ export default CSSModules((props) => {
   } else {
     actionDisplay = <Loader color={'var(--heading_text_color)'}
                             height='24px'
-                            width='24px'
-                            type='Circles'/>;
+                            type='Circles'
+                            width='24px'/>;
   }
+
   return (
     <div styleName='MountItem'>
-      <h2>{props.title}</h2>
-      <table width='100%' cellPadding='2'>
+      <table><tbody><tr><td>{configButton}</td><td><h2>{props.title}</h2></td></tr></tbody></table>
+      <table cellPadding='2'
+             width='100%'>
         <tbody>
           <tr>
-            <td width={mountWidth} height='30px'>{inputControl}</td>
-            <td width='25%' align='center' valign='middle'>
+            <td height='30px'
+                width={mountWidth}>{inputControl}
+            </td>
+            <td align='center'
+                valign='middle'
+                width='25%'>
               {actionDisplay}
             </td>
             <td>
-              <input type='checkbox' checked={props.autoMount} onChange={props.autoMountChanged}/>Auto-mount
+              <input checked={props.autoMount}
+                     onChange={props.autoMountChanged}
+                     type='checkbox'/>Auto-mount
             </td>
           </tr>
         </tbody>