Do not get template if not in edit mode.

Author: Yaacov Zamir

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

@@ -28,7 +28,7 @@ import {
   prefixedId,
 } from '../../../utils';
 import { VirtualMachineModel } from '../../../models';
-import { CUSTOM_FLAVOR, DASHES, MISSING_STR, PENDING_STR } from '../../../constants';
+import { CUSTOM_FLAVOR, DASHES } from '../../../constants';
 import { settingsValue, selectVm } from '../../../k8s/selectors';
 import { Flavor } from '../Flavor';
 import { Description } from '../Description';
@@ -45,7 +45,6 @@ export class VmDetails extends React.Component {
       updating: false,
       k8sError: null,
       form: {},
-      templateError: PENDING_STR,
     };
   }
 
@@ -54,11 +53,6 @@ export class VmDetails extends React.Component {
       editing,
     });
 
-  setTemplateError = error =>
-    this.setState({
-      templateError: error,
-    });
-
   onFormChange = (formKey, newValue, key, valid) =>
     this.setState(state => ({
       form: {
@@ -129,17 +123,10 @@ export class VmDetails extends React.Component {
   isFormValid = () => Object.keys(this.state.form).every(key => this.state.form[key].valid);
 
   componentDidUpdate() {
-    const { launcherPod, importerPods, migration, k8sGet, vm } = this.props;
+    const { launcherPod, importerPods, migration, vm } = this.props;
     if (this.state.editing && !this.isVmOff(vm, launcherPod, importerPods, migration)) {
       this.setEditing(false);
     }
-
-    // Check template, if template is missing, update view.
-    if (getVmTemplate(vm) != null && this.state.templateError === PENDING_STR) {
-      retrieveVmTemplate(k8sGet, vm)
-        .then(() => this.setTemplateError(''))
-        .catch(() => this.setTemplateError(MISSING_STR));
-    }
   }
 
   isVmOff = (vm, launcherPod, importerPods, migration) => {
@@ -168,8 +155,6 @@ export class VmDetails extends React.Component {
     const hostName = getHostName(launcherPod);
     const fqdn = vmIsOff || !hostName ? DASHES : hostName;
     const template = getVmTemplate(vm);
-    const templateIsMissing = this.state.templateError === MISSING_STR ? ` ${MISSING_STR}` : '';
-    const templateLabel = template ? `${template.namespace}/${template.name}${templateIsMissing}` : DASHES;
     const id = getId(vm);
     const sortedBootableDevices = getBootableDevicesInOrder(vm);
     const editButton = (
@@ -253,7 +238,7 @@ export class VmDetails extends React.Component {
               <dd id={prefixedId(id, 'workload-profile')}>{getWorkloadProfile(vm) || DASHES}</dd>
 
               <dt>Template</dt>
-              <dd id={prefixedId(id, 'template')}>{templateLabel}</dd>
+              <dd id={prefixedId(id, 'template')}>{template ? `${template.namespace}/${template.name}` : DASHES}</dd>
             </dl>
             <div className="kubevirt-vm-details__other-details">
               <dl className="kubevirt-vm-details__details-list">

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

@@ -15,8 +15,6 @@ import { getId } from '../../../../selectors';
 
 const testVmDetails = (vm, otherProps) => <VmDetails {...VmDetailsFixture[0].props} vm={vm} {...otherProps} />;
 
-const flushAllPromises = () => new Promise(resolve => setImmediate(resolve));
-
 describe('<VmDetails />', () => {
   it('renders correctly', () => {
     const component = render(testVmDetails(vmFixtures.downVm));
@@ -62,6 +60,11 @@ describe('<VmDetails />', () => {
     const component = render(testVmDetails(vmFixtures.runningVm, { overview: true }));
     expect(component).toMatchSnapshot();
   });
+
+  it('renders deleted template correctly', async () => {
+    const component = render(testVmDetails(vmFixtures.vmWithDeletedTemplate));
+    expect(component).toMatchSnapshot();
+  });
 });
 
 describe('<VmDetails /> enzyme', () => {
@@ -75,19 +78,6 @@ describe('<VmDetails /> enzyme', () => {
     return disablesEditOnCancel(component);
   });
 
-  it('renders deleted template correctly', async () => {
-    const component = mount(testVmDetails(vmFixtures.vmWithDeletedTemplate));
-
-    // Wait for all promisses to terminate.
-    //
-    // Testing for deleted template is done using a promise
-    // we need to wait for.
-    await flushAllPromises();
-    component.update();
-
-    expect(component.render()).toMatchSnapshot();
-  });
-
   it('updates VM description after clicking save button', () => {
     const k8sPatchMock = jest.fn().mockReturnValue(
       new Promise(resolve => {

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

@@ -272,7 +272,7 @@ Array [
         <dd
           id="my-namespace-my-vm-template"
         >
-          default/deleted-template (Missing)
+          default/deleted-template
         </dd>
       </dl>
       <div

src/constants/index.js

@@ -60,8 +60,6 @@ export const OS_WINDOWS_PREFIX = 'win';
 
 export const DEFAULT_RDP_PORT = 3389;
 export const DASHES = '---';
-export const MISSING_STR = '(Missing)';
-export const PENDING_STR = '(Pending)';
 
 export const CDI_KUBEVIRT_IO = 'cdi.kubevirt.io';
 export const STORAGE_IMPORT_PVC_NAME = 'storage.import.importPvcName';