#40: Support for remote Windows mounts - partial

src/App.js

@@ -141,7 +141,7 @@ class App extends IPCContainer {
       let key = 0;
       mainContent.push((
         <div key={'rvd_' + key++}
-             style={{'paddingBottom': '8px'}}>
+             style={{'paddingBottom': '4px'}}>
           <ReleaseVersionDisplay downloadDisabled={!downloadEnabled}
                                  version={selectedVersion}/>
         </div>
@@ -152,7 +152,8 @@ class App extends IPCContainer {
             <MountItems allowConfig={allowConfig}
                         allowSiaPrime={allowSiaPrime}
                         key={'md_' + key++}
-                        noConsoleSupported={noConsoleSupported}/>
+                        noConsoleSupported={noConsoleSupported}
+                        remoteSupported={remoteSupported}/>
         ));
       }
     }

src/assets/settings.json

@@ -6,6 +6,12 @@
     "HostNameOrIp": "IP address or host name of Sia/ScPrime daemon.",
     "TimeoutMs": "Number of milliseconds to wait for Sia/ScPrime API responses before timing out."
   },
+  "RemoteMount": {
+    "EnableRemoteMount": "Allow mounting this location over TCP.",
+    "RemoteHostNameOrIp": "Host name or IP of host to connect to for remote mounting.",
+    "RemotePort": "TCP port used for remote mounting.",
+    "RemoteToken": "Encryption token used for remote mounts. This value must be the same on local and remote systems."
+  },
   "Settings": {
     "ApiAuth": "Password used to communicate with Repertory's API. Auto-generated by default.",
     "ApiPort": "Repertory API port to use for JSON-RPC requests.",

src/components/AddRemoteMount/AddRemoteMount.css

@@ -0,0 +1,4 @@
+.AddRemoteMount {
+  margin: 0;
+  padding: 0;
+}

src/components/AddRemoteMount/AddRemoteMount.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import './AddRemoteMount.css';
+import {connect} from 'react-redux';
+import Button from '../UI/Button/Button';
+
+const mapDispatchToProps = dispatch => {
+  return {
+  }
+};
+
+export default connect(null, mapDispatchToProps)(props => {
+  return (
+    <div className={'AddRemoteMount'}>
+      <Button>Add Remote Mount</Button>
+    </div>
+  );
+});

src/components/MountItem/MountItem.css

@@ -1,3 +1,10 @@
+.MountItem {
+  padding: 0;
+  margin: 0;
+  height: 56px;
+  overflow: visible;
+}
+
 input.MountItemInput {
   margin: 0;
   padding: 4px;

src/components/MountItem/MountItem.js

@@ -140,17 +140,19 @@ export default connect(mapStateToProps, mapDispatchToProps)(props => {
   );
 
   return (
-    <Grid>
-      {configButton}
-      <Text
-        col={configButton ? 6 : 0}
-        rowSpan={5}
-        text={props.provider}
-        type={'Heading1'}/>
-      {inputControls}
-      {actionsDisplay}
-      {autoMountControl}
-      {autoRestartControl}
-    </Grid>
+    <div className={'MountItem'}>
+      <Grid noScroll>
+        {configButton}
+        <Text
+          col={configButton ? 6 : 0}
+          rowSpan={5}
+          text={props.provider}
+          type={'Heading1'}/>
+        {inputControls}
+        {actionsDisplay}
+        {autoMountControl}
+        {autoRestartControl}
+      </Grid>
+    </div>
   );
 });

src/containers/Configuration/Configuration.js

@@ -88,7 +88,9 @@ class Configuration extends IPCContainer {
           advanced: template[key] ? template[key].advanced : false,
           label: key,
           remote: template[key] ? template[key].remote : false,
-          value: config[key],
+          value: (template[key] && (template[key].type === 'object')) ?
+            config[key] :
+            config[key].toString(),
         };
       })
       .filter(i=> {
@@ -99,7 +101,6 @@ class Configuration extends IPCContainer {
         }
         return ret;
       });
-
     return {
       ObjectList: objectList,
       ItemList: itemList,

src/containers/MountItems/MountItems.css

@@ -1,6 +1,8 @@
 .MountItems {
   padding: 0;
   margin: 0;
+  height: 161px;
   width: 100%;
   box-sizing: border-box;
+  overflow-x: scroll;
 }

src/containers/MountItems/MountItems.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import AddRemoteMount from '../../components/AddRemoteMount/AddRemoteMount';
 import Box from '../../components/UI/Box/Box';
 import Button from '../../components/UI/Button/Button';
 import {connect} from 'react-redux';
@@ -298,16 +299,35 @@ class MountItems extends IPCContainer {
     for (const provider of Constants.PROVIDER_LIST) {
       items.push((
         <MountItem allowConfig={this.props.allowConfig}
+                   allowRemove={false}
                    browseClicked={this.handleBrowseLocation}
                    changed={e => this.handleMountLocationChanged(provider, e.target.value)}
                    clicked={this.handleMountUnMount}
                    key={'mi_' + items.length}
                    provider={provider}/>
       ));
-      if (items.length !== this.state.length) {
+      items.push(<div key={'di_' + items.length}
+                      style={{paddingTop: '4px'}} />)
+    }
+
+    if (this.props.remoteSupported) {
+      for (const provider of this.props.RemoteMounts) {
+        items.push((
+          <MountItem allowConfig={this.props.allowConfig}
+                     allowRemove={true}
+                     browseClicked={this.handleBrowseLocation}
+                     changed={e => this.handleMountLocationChanged(provider, e.target.value)}
+                     clicked={this.handleMountUnMount}
+                     key={'mi_' + items.length}
+                     provider={provider}/>
+        ));
         items.push(<div key={'di_' + items.length}
-                        style={{paddingTop: '12px'}} />)
+                        style={{paddingTop: '4px'}}/>)
       }
+
+      items.push(<AddRemoteMount key={'mia_' + items.length + 1}/>);
+    } else {
+      items.splice(items.length - 1, 1)
     }
     
     return (
@@ -326,6 +346,7 @@ const mapStateToProps = state => {
     MountsBusy: state.mounts.MountsBusy,
     Platform: state.common.Platform,
     ProviderState: state.mounts.ProviderState,
+    RemoteMounts: state.mounts.RemoteMounts,
   }
 };
 

src/redux/reducers/mount_reducer.js

@@ -47,6 +47,7 @@ export const mountReducer = createReducer({
   MountsBusy: false,
   MountState: mountState,
   ProviderState: providerState,
+  RemoteMounts: [],
 }, {
   [displayConfiguration]: (state, action) => {
     return {