diff --git a/frontend/packages/kubevirt-plugin/src/components/flavor-text.tsx b/frontend/packages/kubevirt-plugin/src/components/flavor-text.tsx
index a27149fedb..2d5c97e56b 100644
--- a/frontend/packages/kubevirt-plugin/src/components/flavor-text.tsx
+++ b/frontend/packages/kubevirt-plugin/src/components/flavor-text.tsx
@@ -1,11 +1,9 @@
-import * as React from 'react';
 import * as _ from 'lodash';
 import { convertToBaseValue, humanizeDecimalBytes } from '@console/internal/components/utils';
 import { getFlavor, vCPUCount, getCPU, getMemory, asVM } from '../selectors/vm';
 import { VMLikeEntityKind } from '../types';
 
-export const FlavorText: React.FC<FlavorTextProps> = (props) => {
-  const { vmLike } = props;
+export const getFlavorText = (vmLike: VMLikeEntityKind) => {
   const vm = asVM(vmLike);
 
   const flavor = _.capitalize(getFlavor(vmLike));
@@ -16,9 +14,5 @@ export const FlavorText: React.FC<FlavorTextProps> = (props) => {
   const memoryBase = convertToBaseValue(getMemory(vm));
   const memoryText = humanizeDecimalBytes(memoryBase).string;
 
-  return <>{`${flavor || ''}${flavor ? ': ' : ''}${vcpusText}, ${memoryText} Memory`}</>;
-};
-
-type FlavorTextProps = {
-  vmLike: VMLikeEntityKind;
+  return `${flavor || ''}${flavor ? ': ' : ''}${vcpusText}, ${memoryText} Memory`;
 };
diff --git a/frontend/packages/kubevirt-plugin/src/components/vm-templates/vm-template-resource.tsx b/frontend/packages/kubevirt-plugin/src/components/vm-templates/vm-template-resource.tsx
index 057f435c81..f5bd0b9cc1 100644
--- a/frontend/packages/kubevirt-plugin/src/components/vm-templates/vm-template-resource.tsx
+++ b/frontend/packages/kubevirt-plugin/src/components/vm-templates/vm-template-resource.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import * as _ from 'lodash';
 import {
   getOperatingSystemName,
   getOperatingSystem,
@@ -7,16 +8,17 @@ import {
   BootOrder,
   getBootableDevicesInOrder,
   TemplateSource,
+  getTemplateProvisionSource,
 } from 'kubevirt-web-ui-components';
 import { ResourceSummary } from '@console/internal/components/utils';
-import { DASH } from '@console/shared';
 import { TemplateKind, K8sResourceKind } from '@console/internal/module/k8s';
 import { getBasicID, prefixedID } from '../../utils';
 import { vmDescriptionModal } from '../modals/vm-description-modal';
 import { getDescription } from '../../selectors/selectors';
 import { vmFlavorModal } from '../modals';
-import { FlavorText } from '../flavor-text';
+import { getFlavorText } from '../flavor-text';
 import { EditButton } from '../edit-button';
+import { VMDetailsItem } from '../vms/vm-resource';
 import { VMTemplateLink } from './vm-template-link';
 
 import './_vm-template-resource.scss';
@@ -28,29 +30,45 @@ export const VMTemplateResourceSummary: React.FC<VMTemplateResourceSummaryProps>
   const id = getBasicID(template);
   const base = getVmTemplate(template);
 
-  const description = getDescription(template) || DASH;
+  const description = getDescription(template);
+  const os = getOperatingSystemName(template) || getOperatingSystem(template);
+  const workloadProfile = getWorkloadProfile(template);
 
   return (
     <ResourceSummary resource={template}>
-      <dt>Description</dt>
-      <dd id={prefixedID(id, 'description')} className="kubevirt-vm-resource-summary__description">
+      <VMDetailsItem
+        title="Description"
+        idValue={prefixedID(id, 'description')}
+        valueClassName="kubevirt-vm-resource-summary__description"
+        isNotAvail={!description}
+      >
         <EditButton
           canEdit={canUpdateTemplate}
           onClick={() => vmDescriptionModal({ vmLikeEntity: template })}
         >
           {description}
         </EditButton>
-      </dd>
-      <dt>Operating System</dt>
-      <dd id={prefixedID(id, 'os')}>
-        {getOperatingSystemName(template) || getOperatingSystem(template) || DASH}
-      </dd>
-      <dt>Workload Profile</dt>
-      <dd id={prefixedID(id, 'workload-profile')}>{getWorkloadProfile(template) || DASH}</dd>
-      <dt>Base Template</dt>
-      <dd id={prefixedID(id, 'base-template')}>
-        {base ? <VMTemplateLink template={base} /> : DASH}
-      </dd>
+      </VMDetailsItem>
+
+      <VMDetailsItem title="Operating System" idValue={prefixedID(id, 'os')} isNotAvail={!os}>
+        {os}
+      </VMDetailsItem>
+
+      <VMDetailsItem
+        title="Workload Profile"
+        idValue={prefixedID(id, 'workload-profile')}
+        isNotAvail={!workloadProfile}
+      >
+        {workloadProfile}
+      </VMDetailsItem>
+
+      <VMDetailsItem
+        title="Base Template"
+        idValue={prefixedID(id, 'base-template')}
+        isNotAvail={!base}
+      >
+        {base && <VMTemplateLink template={base} />}
+      </VMDetailsItem>
     </ResourceSummary>
   );
 };
@@ -62,31 +80,33 @@ export const VMTemplateDetailsList: React.FC<VMTemplateResourceListProps> = ({
 }) => {
   const id = getBasicID(template);
   const sortedBootableDevices = getBootableDevicesInOrder(template);
+  const flavorText = getFlavorText(template);
+  const isProvisionSource =
+    dataVolumes && !!_.get(getTemplateProvisionSource(template, dataVolumes), 'type');
 
   return (
     <dl className="co-m-pane__details">
-      <dt>Boot Order</dt>
-      <dd id={prefixedID(id, 'boot-order')}>
-        {sortedBootableDevices.length > 0 ? (
-          <BootOrder bootableDevices={sortedBootableDevices} />
-        ) : (
-          DASH
-        )}
-      </dd>
-      <dt>Flavor</dt>
-      <dd id={prefixedID(id, 'flavor')}>
+      <VMDetailsItem
+        title="Boot Order"
+        idValue={prefixedID(id, 'boot-order')}
+        isNotAvail={sortedBootableDevices.length === 0}
+      >
+        <BootOrder bootableDevices={sortedBootableDevices} />
+      </VMDetailsItem>
+
+      <VMDetailsItem title="Flavor" idValue={prefixedID(id, 'flavor')} isNotAvail={!flavorText}>
         <EditButton canEdit={canUpdateTemplate} onClick={() => vmFlavorModal({ vmLike: template })}>
-          <FlavorText vmLike={template} />
+          {flavorText}
         </EditButton>
-      </dd>
-      <dt>Provision Source</dt>
-      <dd id={prefixedID(id, 'provisioning-source')}>
-        {dataVolumes ? (
-          <TemplateSource template={template} dataVolumes={dataVolumes} detailed />
-        ) : (
-          DASH
-        )}
-      </dd>
+      </VMDetailsItem>
+
+      <VMDetailsItem
+        title="Provision Source"
+        idValue={prefixedID(id, 'provisioning-source')}
+        isNotAvail={!isProvisionSource}
+      >
+        {dataVolumes && <TemplateSource template={template} dataVolumes={dataVolumes} detailed />}
+      </VMDetailsItem>
     </dl>
   );
 };
diff --git a/frontend/packages/kubevirt-plugin/src/components/vms/vm-resource.tsx b/frontend/packages/kubevirt-plugin/src/components/vms/vm-resource.tsx
index 0acf54eb61..1640e6036f 100644
--- a/frontend/packages/kubevirt-plugin/src/components/vms/vm-resource.tsx
+++ b/frontend/packages/kubevirt-plugin/src/components/vms/vm-resource.tsx
@@ -11,7 +11,7 @@ import {
 } from 'kubevirt-web-ui-components';
 import { ResourceSummary, NodeLink, ResourceLink } from '@console/internal/components/utils';
 import { PodKind } from '@console/internal/module/k8s';
-import { getName, getNamespace, DASH } from '@console/shared';
+import { getName, getNamespace } from '@console/shared';
 import { PodModel } from '@console/internal/models';
 import { VMKind, VMIKind } from '../../types';
 import { VMTemplateLink } from '../vm-templates/vm-template-link';
@@ -19,34 +19,56 @@ import { getBasicID, prefixedID } from '../../utils';
 import { vmDescriptionModal, vmFlavorModal } from '../modals';
 import { getDescription } from '../../selectors/selectors';
 import { getVMStatus } from '../../statuses/vm/vm';
-import { FlavorText } from '../flavor-text';
+import { getFlavorText } from '../flavor-text';
 import { EditButton } from '../edit-button';
 import { getVmiIpAddressesString } from '../ip-addresses';
 
 import './_vm-resource.scss';
 
+export const VMDetailsItem: React.FC<VMDetailsItemProps> = ({
+  title,
+  idValue,
+  isNotAvail = false,
+  valueClassName,
+  children,
+}) => {
+  return (
+    <>
+      <dt>{title}</dt>
+      <dd id={idValue} className={valueClassName}>
+        {isNotAvail ? <span className="text-secondary">Not available</span> : children}
+      </dd>
+    </>
+  );
+};
+
 export const VMResourceSummary: React.FC<VMResourceSummaryProps> = ({ vm, canUpdateVM }) => {
   const template = getVmTemplate(vm);
 
   const id = getBasicID(vm);
-  const description = getDescription(vm) || DASH;
+  const description = getDescription(vm);
+  const os = getOperatingSystemName(vm) || getOperatingSystem(vm);
 
   return (
     <ResourceSummary resource={vm}>
-      <dt>Description</dt>
-      <dd id={prefixedID(id, 'description')} className="kubevirt-vm-resource-summary__description">
+      <VMDetailsItem
+        title="Description"
+        idValue={prefixedID(id, 'description')}
+        valueClassName="kubevirt-vm-resource-summary__description"
+        isNotAvail={!description}
+      >
         <EditButton canEdit={canUpdateVM} onClick={() => vmDescriptionModal({ vmLikeEntity: vm })}>
           {description}
         </EditButton>
-      </dd>
-      <dt>Operating System</dt>
-      <dd id={prefixedID(id, 'os')}>
-        {getOperatingSystemName(vm) || getOperatingSystem(vm) || DASH}
-      </dd>
-      <dt>Template</dt>
-      <dd id={prefixedID(id, 'template')}>
-        {template ? <VMTemplateLink template={template} /> : DASH}
-      </dd>
+      </VMDetailsItem>
+
+      <VMDetailsItem title="Operating System" idValue={prefixedID(id, 'os')} isNotAvail={!os}>
+        {os}
+      </VMDetailsItem>
+
+      <VMDetailsItem title="Template" idValue={prefixedID(id, 'template')} isNotAvail={!template}>
+        {template && <VMTemplateLink template={template} />}
+      </VMDetailsItem>
     </ResourceSummary>
   );
 };
@@ -63,49 +85,71 @@ export const VMDetailsList: React.FC<VMResourceListProps> = ({
   const { launcherPod } = vmStatus;
   const sortedBootableDevices = getBootableDevicesInOrder(vm);
   const nodeName = getNodeName(launcherPod);
+  const ipAddrs = getVmiIpAddressesString(vmi, vmStatus);
+  const workloadProfile = getWorkloadProfile(vm);
+  const flavorText = getFlavorText(vm);
 
   return (
     <dl className="co-m-pane__details">
-      <dt>Status</dt>
-      <dd id={prefixedID(id, 'vm-statuses')}>
+      <VMDetailsItem title="Status" idValue={prefixedID(id, 'vm-statuses')}>
         <VmStatuses vm={vm} pods={pods} migrations={migrations} />
-      </dd>
-      <dt>Pod</dt>
-      <dd id={prefixedID(id, 'pod')}>
-        {launcherPod ? (
+      </VMDetailsItem>
+
+      <VMDetailsItem title="Pod" idValue={prefixedID(id, 'pod')} isNotAvail={!launcherPod}>
+        {launcherPod && (
           <ResourceLink
             kind={PodModel.kind}
             name={getName(launcherPod)}
             namespace={getNamespace(launcherPod)}
           />
-        ) : (
-          DASH
-        )}
-      </dd>
-      <dt>Boot Order</dt>
-      <dd id={prefixedID(id, 'boot-order')}>
-        {sortedBootableDevices.length > 0 ? (
-          <BootOrder bootableDevices={sortedBootableDevices} />
-        ) : (
-          DASH
         )}
-      </dd>
-      <dt>IP Address</dt>
-      <dd id={prefixedID(id, 'ip-addresses')}>{getVmiIpAddressesString(vmi, vmStatus) || DASH}</dd>
-      <dt>Node</dt>
-      <dd id={prefixedID(id, 'node')}>{<NodeLink name={nodeName} />}</dd>
-      <dt>Flavor</dt>
-      <dd id={prefixedID(id, 'flavor')}>
+      </VMDetailsItem>
+
+      <VMDetailsItem
+        title="Boot Order"
+        idValue={prefixedID(id, 'boot-order')}
+        isNotAvail={sortedBootableDevices.length === 0}
+      >
+        <BootOrder bootableDevices={sortedBootableDevices} />
+      </VMDetailsItem>
+
+      <VMDetailsItem
+        title="IP Address"
+        idValue={prefixedID(id, 'ip-addresses')}
+        isNotAvail={!ipAddrs}
+      >
+        {ipAddrs}
+      </VMDetailsItem>
+
+      <VMDetailsItem title="Node" idValue={prefixedID(id, 'node')} isNotAvail={!nodeName}>
+        {nodeName && <NodeLink name={nodeName} />}
+      </VMDetailsItem>
+
+      <VMDetailsItem title="Flavor" idValue={prefixedID(id, 'flavor')} isNotAvail={!flavorText}>
         <EditButton canEdit={canUpdateVM} onClick={() => vmFlavorModal({ vmLike: vm })}>
-          <FlavorText vmLike={vm} />
+          {flavorText}
         </EditButton>
-      </dd>
-      <dt>Workload Profile</dt>
-      <dd id={prefixedID(id, 'workload-profile')}>{getWorkloadProfile(vm) || DASH}</dd>
+      </VMDetailsItem>
+
+      <VMDetailsItem
+        title="Workload Profile"
+        idValue={prefixedID(id, 'workload-profile')}
+        isNotAvail={!workloadProfile}
+      >
+        {workloadProfile}
+      </VMDetailsItem>
     </dl>
   );
 };
 
+type VMDetailsItemProps = {
+  title: string;
+  idValue?: string;
+  isNotAvail?: boolean;
+  valueClassName?: string;
+  children: React.ReactNode;
+};
+
 type VMResourceSummaryProps = {
   vm: VMKind;
   canUpdateVM: boolean;