Pre-fill selections in Advanced Options step

app/javascript/react/screens/App/Overview/screens/PlanWizard/components/PlanWizardAdvancedOptionsStep/PlanWizardAdvancedOptionsStep.js

@@ -5,13 +5,18 @@ import { Form, Spinner } from 'patternfly-react';
 
 import PlanWizardAdvancedOptionsStepTable from './components/PlanWizardAdvancedOptionsStepTable/PlanWizardAdvancedOptionsStepTable';
 import { BootstrapSelect } from '../../../../../common/forms/BootstrapSelect';
+import { preselectPlaybooksForVms } from './helpers';
 
 class PlanWizardAdvancedOptionsStep extends Component {
   constructor(props) {
     super(props);
 
     if (props.vms.length === 0) {
-      props.setVmsAction(props.vmStepSelectedVms);
+      if (!props.editingPlan) {
+        props.setVmsAction(props.vmStepSelectedVms);
+      } else {
+        props.setVmsAction(preselectPlaybooksForVms(props.editingPlan, props.vmStepSelectedVms));
+      }
     }
   }
 
@@ -90,7 +95,8 @@ PlanWizardAdvancedOptionsStep.propTypes = {
   vms: PropTypes.array,
   setVmsAction: PropTypes.func,
   vmStepSelectedVms: PropTypes.array,
-  change: PropTypes.func
+  change: PropTypes.func,
+  editingPlan: PropTypes.object
 };
 
 PlanWizardAdvancedOptionsStep.defaultProps = {
@@ -99,13 +105,6 @@ PlanWizardAdvancedOptionsStep.defaultProps = {
 
 export default reduxForm({
   form: 'planWizardAdvancedOptionsStep',
-  initialValues: {
-    playbookVms: {
-      preMigration: [],
-      postMigration: []
-    },
-    preMigrationPlaybook: '',
-    postMigrationPlaybook: ''
-  },
   destroyOnUnmount: false
+  // initialValues prop is passed in via ./index
 })(PlanWizardAdvancedOptionsStep);

app/javascript/react/screens/App/Overview/screens/PlanWizard/components/PlanWizardAdvancedOptionsStep/helpers.js

@@ -0,0 +1,20 @@
+export const getVMStepSelectedVms = (allVms, selectedVms) => allVms.filter(vm => selectedVms.includes(vm.id));
+
+// Property can be 'pre_service' or 'post_service'.
+// Returns an array of vm ids which have a truthy value for that property in the plan being edited.
+export const getVmIdsWithProperty = (editingPlan, property) => {
+  const actions = editingPlan && editingPlan.options && editingPlan.options.config_info && editingPlan.options.config_info.actions;
+  if (!actions) return [];
+  const actionsWithProperty = actions.filter(action => action[property]);
+  return actionsWithProperty.map(action => action.vm_id);
+};
+
+export const preselectPlaybooksForVms = (editingPlan, vms) => {
+  const vmIdsWithPreService = getVmIdsWithProperty(editingPlan, 'pre_service');
+  const vmIdsWithPostService = getVmIdsWithProperty(editingPlan, 'post_service');
+  return vms.map(vm => ({
+    ...vm,
+    preMigration: vmIdsWithPreService.some(id => id === vm.id),
+    postMigration: vmIdsWithPostService.some(id => id === vm.id)
+  }));
+};

app/javascript/react/screens/App/Overview/screens/PlanWizard/components/PlanWizardAdvancedOptionsStep/index.js

@@ -2,15 +2,17 @@ import { connect } from 'react-redux';
 
 import PlanWizardAdvancedOptionsStep from './PlanWizardAdvancedOptionsStep';
 import * as PlanWizardAdvancedOptionsStepActions from './PlanWizardAdvancedOptionsStepActions';
-import { getVMStepSelectedVms } from './PlanWizardAdvancedOptionsStepSelectors';
+import { getVMStepSelectedVms, getVmIdsWithProperty } from './helpers';
 import reducer from './PlanWizardAdvancedOptionsStepReducer';
+import { findEditingPlan } from '../../PlanWizardSelectors';
 
 export const reducers = { planWizardAdvancedOptionsStep: reducer };
 
 const mapStateToProps = (
   {
     planWizardAdvancedOptionsStep,
     planWizardVMStep,
+    overview: { transformationPlans, editingPlanId },
     form: {
       planWizardGeneralStep: {
         values: { vm_choice_radio }
@@ -28,11 +30,24 @@ const mapStateToProps = (
       ? [...planWizardVMStep.valid_vms, ...planWizardVMStep.invalid_vms, ...planWizardVMStep.conflict_vms]
       : [...planWizardVMStep.preselected_vms, ...planWizardVMStep.valid_vms];
 
+  const editingPlan = findEditingPlan(transformationPlans, editingPlanId);
+  const configInfo = editingPlan && editingPlan.options && editingPlan.options.config_info;
+
   return {
     ...planWizardAdvancedOptionsStep,
     ...ownProps.data,
     advancedOptionsStepForm,
-    vmStepSelectedVms: getVMStepSelectedVms(allVms, selectedVms)
+    vmStepSelectedVms: getVMStepSelectedVms(allVms, selectedVms),
+    initialValues: {
+      playbookVms: {
+        preMigration: editingPlan ? getVmIdsWithProperty(editingPlan, 'pre_service') : [],
+        postMigration: editingPlan ? getVmIdsWithProperty(editingPlan, 'post_service') : []
+      },
+      preMigrationPlaybook: editingPlan ? configInfo.pre_service_id : '',
+      postMigrationPlaybook: editingPlan ? configInfo.post_service_id : ''
+    },
+    enableReinitialize: true, // Tells redux-form to use new initialValues when they change
+    editingPlan
   };
 };
 

app/javascript/react/screens/App/Overview/screens/PlanWizard/components/PlanWizardInstancePropertiesStep/index.js

@@ -3,7 +3,7 @@ import { connect } from 'react-redux';
 import PlanWizardInstancePropertiesStep from './PlanWizardInstancePropertiesStep';
 import * as PlanWizardInstancePropertiesStepActions from './PlanWizardInstancePropertiesStepActions';
 import reducer from './PlanWizardInstancePropertiesStepReducer';
-import { getVMStepSelectedVms } from '../PlanWizardAdvancedOptionsStep/PlanWizardAdvancedOptionsStepSelectors';
+import { getVMStepSelectedVms } from '../PlanWizardAdvancedOptionsStep/helpers';
 
 export const reducers = { planWizardInstancePropertiesStep: reducer };
 

app/javascript/react/screens/App/Overview/screens/PlanWizard/components/PlanWizardVMStep/helpers.js

@@ -98,8 +98,8 @@ export const _formatPreselectedVms = vmsQueryResults =>
   vmsQueryResults.map(result => ({
     id: result.id,
     name: result.name,
-    cluster: result.ems_cluster.name,
-    path: '', // TODO [mturley] how can we fetch the path?
+    cluster: result.ems_cluster ? result.ems_cluster.name : '',
+    path: '', // TODO [mturley] we need to fetch the path from a new API attribute on this query
     allocated_size: numeral(result.allocated_disk_storage).format('0.00b'),
     selected: true,
     valid: true,