Do not get template if not in edit mode.

Author: Yaacov Zamir

src/components/Details/Flavor/Flavor.js

@@ -32,6 +32,16 @@ export class Flavor extends React.Component {
   };
 
   componentDidMount() {
+    // If not in edit mode, just init state and exit.
+    if (!this.props.editing) {
+      this.setState({
+        loadingTemplate: false,
+        template: null,
+      });
+
+      return;
+    }
+
     this.setState({
       loadingTemplate: true,
     });

src/components/Details/Flavor/tests/Flavor.test.js

@@ -6,10 +6,15 @@ import { Flavor } from '..';
 import { default as FlavorFixture } from '../fixtures/Flavor.fixture';
 
 const testFlavor = () => <Flavor {...FlavorFixture[0].props} id="myflavor" />;
+const testFlavorEdit = () => <Flavor {...FlavorFixture[1].props} id="myflavor" />;
 
 describe('<Flavor />', () => {
   it('renders correctly', () => {
     const component = shallow(testFlavor());
     expect(component).toMatchSnapshot();
   });
+  it('renders correctly in edit mode', () => {
+    const component = shallow(testFlavorEdit());
+    expect(component).toMatchSnapshot();
+  });
 });

src/components/Details/Flavor/tests/__snapshots__/Flavor.test.js.snap

@@ -45,3 +45,61 @@ exports[`<Flavor /> renders correctly 1`] = `
   </div>
 </InlineEdit>
 `;
+
+exports[`<Flavor /> renders correctly in edit mode 1`] = `
+<InlineEdit
+  LoadingComponent={[Function]}
+  editing={true}
+  fieldsValues={
+    Object {
+      "cpu": Object {
+        "value": "2",
+      },
+      "flavor": Object {
+        "value": "Custom",
+      },
+      "memory": Object {
+        "value": "2",
+      },
+    }
+  }
+  formFields={
+    Object {
+      "cpu": Object {
+        "id": "myflavor-flavor-cpu",
+        "isVisible": [Function],
+        "required": true,
+        "title": "CPU",
+        "type": "positive-number",
+      },
+      "flavor": Object {
+        "choices": Array [
+          "Custom",
+        ],
+        "id": "myflavor-flavor-dropdown",
+        "type": "dropdown",
+      },
+      "memory": Object {
+        "id": "myflavor-flavor-memory",
+        "isVisible": [Function],
+        "required": true,
+        "title": "Memory (GB)",
+        "type": "positive-number",
+      },
+    }
+  }
+  onFormChange={[Function]}
+  updating={true}
+>
+  <div
+    id="myflavor-flavor"
+  >
+    small
+  </div>
+  <div
+    id="myflavor-flavor-description"
+  >
+    2 CPU, 2G Memory
+  </div>
+</InlineEdit>
+`;

src/components/Details/VmDetails/VmDetails.js

@@ -41,7 +41,7 @@ export class VmDetails extends React.Component {
   constructor(props) {
     super(props);
     this.state = {
-      editing: false,
+      editing: !!props.editing,
       updating: false,
       k8sError: null,
       form: {},
@@ -298,6 +298,7 @@ VmDetails.propTypes = {
   k8sGet: PropTypes.func.isRequired,
   LoadingComponent: PropTypes.func,
   overview: PropTypes.bool,
+  editing: PropTypes.bool,
 };
 
 VmDetails.defaultProps = {
@@ -310,4 +311,5 @@ VmDetails.defaultProps = {
   LoadingComponent: Loading,
   NodeLink: undefined,
   overview: false,
+  editing: false,
 };

src/components/Details/VmDetails/fixtures/VmDetails.fixture.js

@@ -87,6 +87,65 @@ export const vmFixtures = {
       running: false,
     },
   },
+  vmWithLabelsEditMode: {
+    metadata: {
+      ...metadata,
+      labels: {
+        'flavor.template.cnv.io/small': 'true',
+        'os.template.cnv.io/fedora29': 'true',
+        [LABEL_USED_TEMPLATE_NAME]: 'fedora-generic',
+        [LABEL_USED_TEMPLATE_NAMESPACE]: 'default',
+        'workload.template.cnv.io/generic': 'true',
+      },
+    },
+    spec: {
+      template: {
+        spec: {
+          domain: {
+            cpu: {
+              cores: 2,
+            },
+            resources: {
+              requests: {
+                memory: '2G',
+              },
+            },
+          },
+        },
+      },
+      running: false,
+    },
+    editing: true,
+  },
+  vmWithDeletedTemplate: {
+    metadata: {
+      ...metadata,
+      labels: {
+        'flavor.template.cnv.io/small': 'true',
+        'os.template.cnv.io/fedora29': 'true',
+        [LABEL_USED_TEMPLATE_NAME]: 'deleted-template',
+        [LABEL_USED_TEMPLATE_NAMESPACE]: 'default',
+        'workload.template.cnv.io/generic': 'true',
+      },
+    },
+    spec: {
+      template: {
+        spec: {
+          domain: {
+            cpu: {
+              cores: 2,
+            },
+            resources: {
+              requests: {
+                memory: '2G',
+              },
+            },
+          },
+        },
+      },
+      running: false,
+    },
+  },
   customVm: {
     metadata: {
       ...metadata,
@@ -204,4 +263,14 @@ export default [
       overview: true,
     },
   },
+  {
+    component: VmDetails,
+    name: 'VM detail with deleted template',
+    props: {
+      vm: vmFixtures.vmWithDeletedTemplate,
+      k8sPatch,
+      k8sGet,
+      NodeLink: () => true,
+    },
+  },
 ];

src/components/Details/VmDetails/tests/VmDetails.test.js

@@ -41,6 +41,11 @@ describe('<VmDetails />', () => {
     expect(component).toMatchSnapshot();
   });
 
+  it('renders values from labels correctly in edit mode', () => {
+    const component = render(testVmDetails(vmFixtures.vmWithLabelsEditMode));
+    expect(component).toMatchSnapshot();
+  });
+
   it('renders CPU and Memory settings for VM with custom flavor', () => {
     const component = render(testVmDetails(vmFixtures.customVm));
     expect(component).toMatchSnapshot();
@@ -60,6 +65,11 @@ describe('<VmDetails />', () => {
     const component = render(testVmDetails(vmFixtures.runningVm, { overview: true }));
     expect(component).toMatchSnapshot();
   });
+
+  it('renders deleted template correctly', () => {
+    const component = render(testVmDetails(vmFixtures.vmWithDeletedTemplate));
+    expect(component).toMatchSnapshot();
+  });
 });
 
 describe('<VmDetails /> enzyme', () => {