Fix bug with change in 1.8.0 remote volumes API

Signed-off-by: Jeffrey Morgan <jmorganca@gmail.com>

src/components/ContainerHome.react.js

@@ -41,7 +41,7 @@ var ContainerHome = React.createClass({
   },
 
   showFolders: function () {
-    return this.props.container.Volumes && _.keys(this.props.container.Volumes).length > 0 && this.props.container.State.Running;
+    return this.props.container.Mounts && this.props.container.Mounts.length > 0 && this.props.container.State.Running;
   },
 
   render: function () {

src/components/ContainerHomeFolders.react.js

@@ -14,30 +14,36 @@ var ContainerHomeFolder = React.createClass({
   contextTypes: {
     router: React.PropTypes.func
   },
-  handleClickFolder: function (hostVolume, containerVolume) {
+  handleClickFolder: function (source, destination) {
     metrics.track('Opened Volume Directory', {
       from: 'home'
     });
 
-    if (hostVolume.indexOf(util.windowsToLinuxPath(util.home())) === -1) {
+    if (source.indexOf(util.windowsToLinuxPath(util.home())) === -1) {
       dialog.showMessageBox({
         message: `Enable all volumes to edit files? This may not work with all database containers.`,
         buttons: ['Enable Volumes', 'Cancel']
       }, (index) => {
         if (index === 0) {
-          var volumes = _.clone(this.props.container.Volumes);
+          var mounts = _.clone(this.props.container.Mounts);
-          var newHostVolume = util.escapePath(path.join(util.home(), util.documents(), 'Kitematic', this.props.container.Name, containerVolume));
+          var newSource = util.escapePath(path.join(util.home(), util.documents(), 'Kitematic', this.props.container.Name, destination));
-          volumes[containerVolume] = newHostVolume;
+          var binds = mounts.map(function (m) {
-          var binds = _.pairs(volumes).map(function (pair) {
+            let source = m.Source;
-            if(util.isWindows()) {
+            if (m.Destination === destination) {
-              return util.windowsToLinuxPath(pair[1]) + ':' + pair[0];
+              source = newSource;
             }
-            return pair[1] + ':' + pair[0];
+
+            if(util.isWindows()) {
+              return util.windowsToLinuxPath(source) + ':' + m.Destination;
+            }
+
+            return source + ':' + m.Destination;
           });
-          mkdirp(newHostVolume, function (err) {
+
+          mkdirp(newSource, function (err) {
             console.log(err);
             if (!err) {
-              shell.showItemInFolder(newHostVolume);
+              shell.showItemInFolder(newSource);
             }
           });
 
@@ -45,7 +51,7 @@ var ContainerHomeFolder = React.createClass({
         }
       });
     } else {
-      let path = util.isWindows() ? util.linuxToWindowsPath(hostVolume) : hostVolume;
+      let path = util.isWindows() ? util.linuxToWindowsPath(source) : source;
       shell.showItemInFolder(path);
     }
   },
@@ -60,12 +66,13 @@ var ContainerHomeFolder = React.createClass({
       return false;
     }
 
-    var folders = _.map(_.omit(this.props.container.Volumes, (v, k) => k.indexOf('/Users/') !== -1), (val, key) => {
+    var folders = _.map(this.props.container.Mounts, (m, i) => {
-      var firstFolder = key;
+      let destination = m.Destination;
+      let source = m.Source;
       return (
-        <div key={key} className="folder" onClick={this.handleClickFolder.bind(this, val, key)}>
+        <div key={i} className="folder" onClick={this.handleClickFolder.bind(this, source, destination)}>
           <RetinaImage src="folder.png" />
-          <div className="text">{firstFolder}</div>
+          <div className="text">{destination}</div>
         </div>
       );
     });

src/components/ContainerSettingsVolumes.react.js

@@ -26,16 +26,23 @@ var ContainerSettingsVolumes = React.createClass({
       }
 
       metrics.track('Choose Directory for Volume');
+
       if(util.isWindows()) {
         directory = util.escapePath(util.windowsToLinuxPath(directory));
       }
-      var volumes = _.clone(this.props.container.Volumes);
+
-      volumes[dockerVol] = directory;
+      var mounts = _.clone(this.props.container.Mounts);
-      var binds = _.pairs(volumes).map(function (pair) {
+      _.each(mounts, m => {
-        return pair[1] + ':' + pair[0];
+        if (m.Destination === dockerVol) {
+          m.Source = directory;
+        }
       });
 
-      containerActions.update(this.props.container.Name, {Binds: binds, Volumes: volumes});
+      var binds = mounts.map(m => {
+        return m.Source + ':' + m.Destination;
+      });
+
+      containerActions.update(this.props.container.Name, {Binds: binds, Mounts: mounts});
     });
   },
   handleRemoveVolumeClick: function (dockerVol) {
@@ -45,13 +52,17 @@ var ContainerSettingsVolumes = React.createClass({
 
     var hostConfig = _.clone(this.props.container.HostConfig);
     var binds = hostConfig.Binds;
-    var volumes = _.clone(this.props.container.Volumes);
+    var mounts = _.clone(this.props.container.Mounts);
-    volumes[dockerVol] = null;
+    _.each(mounts, m => {
+      if (m.Destination === dockerVol) {
+        m.Source = null;
+      }
+    });
     var index = _.findIndex(binds, bind => bind.indexOf(`:${dockerVol}`) !== -1);
     if (index >= 0) {
       binds.splice(index, 1);
     }
-    containerActions.update(this.props.container.Name, {HostConfig: hostConfig, Binds: binds, Volumes: volumes});
+    containerActions.update(this.props.container.Name, {HostConfig: hostConfig, Binds: binds, Mounts: mounts});
   },
   handleOpenVolumeClick: function (path) {
     metrics.track('Opened Volume Directory', {
@@ -69,24 +80,25 @@ var ContainerSettingsVolumes = React.createClass({
     }
 
     var homeDir = util.isWindows() ? util.windowsToLinuxPath(util.home()) : util.home();
-    var volumes = _.map(this.props.container.Volumes, (val, key) => {
+    var mounts= _.map(this.props.container.Mounts, (m, i) => {
-      if (!val || val.indexOf(homeDir) === -1) {
+      let source = m.Source, destination = m.Destination;
-        val = (
+      if (!m.Source || m.Source.indexOf(homeDir) === -1) {
+        source = (
           <span className="value-right">No Folder</span>
         );
       } else {
-        let local = util.isWindows() ? util.linuxToWindowsPath(val) : val;
+        let local = util.isWindows() ? util.linuxToWindowsPath(source) : source;
-        val = (
+        source = (
-          <a className="value-right" onClick={this.handleOpenVolumeClick.bind(this, val)}>{local.replace(process.env.HOME, '~')}</a>
+          <a className="value-right" onClick={this.handleOpenVolumeClick.bind(this, source)}>{local.replace(process.env.HOME, '~')}</a>
         );
       }
       return (
         <tr>
-          <td>{key}</td>
+          <td>{destination}</td>
-          <td>{val}</td>
+          <td>{source}</td>
           <td>
-            <a className="btn btn-action small" disabled={this.props.container.State.Updating} onClick={this.handleChooseVolumeClick.bind(this, key)}>Change</a>
+            <a className="btn btn-action small" disabled={this.props.container.State.Updating} onClick={this.handleChooseVolumeClick.bind(this, destination)}>Change</a>
-            <a className="btn btn-action small" disabled={this.props.container.State.Updating} onClick={this.handleRemoveVolumeClick.bind(this, key)}>Remove</a>
+            <a className="btn btn-action small" disabled={this.props.container.State.Updating} onClick={this.handleRemoveVolumeClick.bind(this, destination)}>Remove</a>
           </td>
         </tr>
       );
@@ -104,7 +116,7 @@ var ContainerSettingsVolumes = React.createClass({
               </tr>
             </thead>
             <tbody>
-              {volumes}
+              {mounts}
             </tbody>
           </table>
         </div>