- Collects network_date from target_env

- Gets networks from VM info

src/actions/ConnectionsActions/ConnectionsActions.js

@@ -25,6 +25,8 @@ let ConnectionsActions = Reflux.createActions({
   loadConnectionDetail: { children: ['completed', 'failed'] },
   loadProviders: { children: ['completed', 'failed'] },
   loadInstances: { children: ['completed', 'failed'] },
+  loadInstanceDetail: { children: ['completed', 'failed'] },
+  loadNetworks: { children: ['completed', 'failed'] },
   newEndpoint: { children: ['success', 'failed'] },
   saveEndpoint: { children: ['success', 'failed'] },
   editEndpoint: { children: ['success', 'failed'] },

src/actions/MigrationActions/MigrationActions.js

@@ -230,7 +230,7 @@ MigrationActions.addMigration.listen((migration) => {
 
   let network_map = {}
   migration.networks.forEach(network => {
-    network_map[network.name] = network.migrateNetwork
+    network_map[network.network_name] = network.migrateNetwork
   })
 
   let destinationEnv = {}

src/components/WizardNetworks/WizardNetworks.js

@@ -19,7 +19,10 @@ import React, { Component, PropTypes } from 'react';
 import withStyles from 'isomorphic-style-loader/lib/withStyles';
 import s from './WizardNetworks.scss';
 import Dropdown from '../NewDropdown';
-import {targetNetworkMock} from '../../config';
+import LoadingIcon from '../LoadingIcon';
+import ConnectionsActions from '../../actions/ConnectionsActions';
+import { targetNetworkMock } from '../../config';
+
 
 const title = 'Network mapping';
 
@@ -36,87 +39,139 @@ class WizardNetworks extends Component {
 
   constructor(props) {
     super(props)
-    console.log("PROPS", props)
-    let networks = this.props.data.networks
-    networks.forEach(network => {network.selected = false})
-    /*this.props.data.vms.forEach((vm) => {
-      if (vm.selected) {
-        networks.forEach((network) => {
-          if (vm.networks.indexOf(network.id) != -1) {
-            network.selected = true
-            if (network.migrateNetwork == null) {
-              network.migrateNetwork = "Create new"
-            }
-          }
+
+    this.networkOptions = [] // [{ label: "Create new", value: null }]
+    if (this.props.data.targetNetworks && this.props.data.targetNetworks.length) {
+      this.props.data.targetNetworks.forEach((network) => {
+        this.networkOptions.push({
+          label: network.name,
+          value: network.name
         })
-      }
-    })*/
+      }, this)
+    } else {
+      targetNetworkMock.forEach(network => {
+        this.networkOptions.push({
+          label: network,
+          value: network
+        })
+      })
+    }
 
     this.state = {
-      networks: networks,
+      networks: null,
       nextStep: "WizardOptions",
-      valid: true
+      valid: false
     }
-
-    this.networkOptions = ["Create new"]
-    //this.props.data.targetNetworks.forEach((network) => {
-    targetNetworkMock.forEach((network) => {
-      this.networkOptions.push(network)
-    }, this)
   }
 
   componentWillMount() {
     this.props.setWizardState(this.state)
     this.context.onSetTitle(title);
+    this.props.data.selectedInstances.forEach((vm) => {
+      ConnectionsActions.loadInstanceDetail({ id: this.props.data.sourceCloud.credential.id }, vm)
+    })
+  }
+
+  componentWillReceiveProps(props) {
+    this.processProps(props)
+  }
+
+  processProps(props) {
+    let networks = []
+
+    props.data.selectedInstances.forEach((vm) => {
+      if (vm.devices && vm.devices.nics) {
+        vm.devices.nics.forEach((item) => {
+          let exists = false
+          networks.forEach(network => {
+            if (network.network_name == item.network_name) {
+              exists = true
+            }
+          })
+          if (!exists) {
+            if (!item.migrateNetwork) {
+              item.migrateNetwork = null
+            }
+            networks.push(item)
+          }
+        })
+      }
+    })
+
+    if (networks.length == 0) {
+      networks = null
+    }
+    this.setState({ networks: networks })
   }
 
   handleChangeNetwork(event, network) {
     let index = this.state.networks.indexOf(network)
+    let valid = true
     let networks = this.state.networks
     networks[index].migrateNetwork = event.value
-    this.setState({ networks: networks }, () => {
+    networks.forEach(item => {
+      if (item.migrateNetwork === null) {
+        valid = false
+      }
+    })
+    
+    this.setState({
+      networks: networks,
+      valid: valid
+    }, () => {
       this.props.setWizardState(this.state)
     })
   }
 
   render() {
-    let _this = this
-    let networks = this.state.networks.map((network, index) => {
-      if (network.selected || true) {
-        return (
-          <div className="item" key={"networks_" + index}>
-            <div className="cell cell-icon">
-              <div className="icon network"></div>
-              <span className="details">
-                {network.name}
-              </span>
-            </div>
-            <div className="cell">
-              <div className="arrow"></div>
+    if (this.state.networks != null) {
+      let networks = this.state.networks.map((network, index) => {
+        if (network.selected || true) {
+          return (
+            <div className="item" key={"networks_" + index}>
+              <div className="cell cell-icon">
+                <div className="icon network"></div>
+                <span className="details">
+                  {network.network_name}
+                </span>
+              </div>
+              <div className="cell">
+                <div className="arrow"></div>
+              </div>
+              <div className="cell">
+                <Dropdown
+                  options={this.networkOptions}
+                  onChange={(e) => this.handleChangeNetwork(e, network)}
+                  value={network.migrateNetwork}
+                />
+              </div>
             </div>
-            <div className="cell">
-              <Dropdown
-                options={_this.networkOptions}
-                onChange={(e) => _this.handleChangeNetwork(e, network)}
-                value={network.migrateNetwork}
-              />
+          )
+        } else {
+          return null
+        }
+      }, this)
+
+      return (
+        <div className={s.root}>
+          <div className={s.container}>
+            <div className="items-list">
+              {networks}
             </div>
           </div>
-        )
-      } else {
-        return null
-      }
-    })
-
-    return (
-      <div className={s.root}>
-        <div className={s.container}>
-          <div className="items-list">
-            {networks}
+        </div>
+      );
+    } else {
+      return (
+        <div className={s.root}>
+          <div className={s.container}>
+            <div className="items-list">
+              <LoadingIcon text="Loading networks..." />
+            </div>
           </div>
         </div>
-      </div>
-    );
+      );
+    }
   }
 
 }

src/components/WizardSummary/WizardSummary.js

@@ -102,7 +102,7 @@ class WizardSummary extends Component {
         return (
           <div className="item" key={"Network_" + index}>
             <span className="cell">
-              <TextTruncate line={1} text={network.name} truncateText="..." />
+              <TextTruncate line={1} text={network.network_name} truncateText="..." />
             </span>
             <span className="cell">
               <div className="arrow"></div>

src/components/WizardTarget/WizardTarget.js

@@ -96,6 +96,7 @@ class WizardTarget extends Component {
           targetCloud: Object.assign({}, cloudData),
           selected: selected,
           valid: true,
+          nextCallback: (e) => this.nextCallback(e),
           nextStep: "WizardVms",
           networks: networkMock // TODO: Change mock here
         })
@@ -103,6 +104,19 @@ class WizardTarget extends Component {
     }
   }
 
+  nextCallback(callback) {
+    let connection = this.props.cloud.credential
+    // TODO: change this, shitty callback, go through stores
+    if (this.props.cloud.credential && this.props.cloud.credential.id === this.props.cloud.credential.name) {
+      connection = this.state.connections.filter(item => item.name === connection.name)[0]
+    }
+
+    ConnectionsActions.loadNetworks(connection)
+    if (callback) {
+      callback()
+    }
+  }
+
   addCredentialsCallback(data) {
     let targetCloud = null
 

src/stores/ConnectionsStore/ConnectionsStore.js

@@ -136,13 +136,13 @@ class ConnectionsStore extends Reflux.Store
   }
 
   onUpdateProvider(provider) {
-    let allCLouds = this.state.allClouds
+    let allClouds = this.state.allClouds
     for (var i in allClouds) {
       if (allClouds[i].name == provider.name) {
         allClouds[i] = provider
       }
     }
-    this.setState({ allClouds: allCLouds })
+    this.setState({ allClouds: allClouds })
   }
 
   onAssignConnectionProvider() {

src/stores/MigrationStore/MigrationStore.js

@@ -164,9 +164,9 @@ class MigrationStore extends Reflux.Store
         execIndex = i
       }
     })
-    console.log(replicas[index].executions)
+
     replicas[index].executions.splice(execIndex, 1)
-    console.log(replicas[index].executions)
+
     if (replicas[index].executions[replicas[index].executions]) {
       replicas[index].tasks = replicas[index].executions[replicas[index].executions.length - 1].tasks
       replicas[index].status = replicas[index].executions[replicas[index].executions.length - 1].status
@@ -174,7 +174,7 @@ class MigrationStore extends Reflux.Store
       replicas[index].tasks = []
       replicas[index].status = null
     }
-    console.log(replicas[index])
+
 
     this.setState({ replicas: replicas })
   }
@@ -221,6 +221,13 @@ class MigrationStore extends Reflux.Store
     this.setState({migrations: migrations})
   }
 
+  onDeleteReplicaCompleted(migration) {
+    let replicas = this.state.replicas
+    let index = replicas.indexOf(migration)
+    replicas.splice(index, 1)
+    this.setState({replicas: replicas})
+  }
+
   onExecuteReplicaCompleted(replica, response) {
     let replicas = this.state.replicas
     replicas.forEach((item, index) => {

src/stores/WizardStore/WizardStore.js

@@ -44,7 +44,7 @@ class UsersStore extends Reflux.Store
     vms: null,
     destination_environment: {},
     networks: networkMock, // TODO: Change mock here
-    targetNetworks: targetNetworkMock, // TODO: Change mock here
+    targetNetworks: null, // TODO: Change mock here
     selected: false,
     wizardStarted: false
   }
@@ -108,6 +108,55 @@ class UsersStore extends Reflux.Store
     this.setState({ instances: [] })
   }
 
+  onLoadInstanceDetail(endpoint, instance) {
+    let projectId = Reflux.GlobalState.userStore.currentUser.project.id
+    let instanceNameBase64 = btoa(instance.name)
+    let url = `${servicesUrl.coriolis}/${projectId}/endpoints/${endpoint.id}/instances/${instanceNameBase64}`
+
+    Api.sendAjaxRequest({
+      url: url,
+      method: "GET"
+    }).then(response => {
+      ConnectionsActions.loadInstanceDetail.completed(response)
+    }, ConnectionsActions.loadInstanceDetail.failed)
+      .catch(ConnectionsActions.loadInstanceDetail.failed);
+  }
+
+  onLoadInstanceDetailCompleted(response) {
+    let selectedInstances = this.state.selectedInstances
+    selectedInstances.forEach((item, index) => {
+      if (item.id === response.data.instance.id) {
+        selectedInstances[index] = response.data.instance
+      }
+    })
+    console.log("selectedInstances", selectedInstances)
+    this.setState({ selectedInstances: selectedInstances })
+  }
+
+  onLoadNetworks(endpoint) {
+    this.setState({
+      targetNetworks: null
+    })
+    let projectId = Reflux.GlobalState.userStore.currentUser.project.id
+
+    let url = `${servicesUrl.coriolis}/${projectId}/endpoints/${endpoint.id}/networks`
+
+    Api.sendAjaxRequest({
+      url: url,
+      method: "GET"
+    }).then(ConnectionsActions.loadNetworks.completed, ConnectionsActions.loadNetworks.failed)
+      .catch(ConnectionsActions.loadNetworks.failed);
+  }
+
+  onLoadNetworksCompleted(response) {
+    console.log(response.data.networks)
+    if (response.data.networks) {
+      this.setState({
+        targetNetworks: response.data.networks
+      })
+    }
+  }
+
   onNewState() {
     this.setState(this.blankState)
   }