Add two file firmware update

Adds the ability to upload separate Host and BMC firmware images through
the GUI. By default, the two file firmware update page will be shown.
Changes to the .env configurations will enable the single file upload
page. The IBM env is configured to allow single file firmware update.

Two file upload features:
 - File upload through local workstation or tftp server
 - Reboot from backup BMC image
 - Does not have ability to reboot from backup host image
 - Does not implement checks in GUI for host status, which is the
   same as what we have in phosphor-webui

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: Ibf2a2d9ffc3952dd5a5454c723350c61d9f91c3e

9 files changed, 267 insertions, 196 deletions

diff --git a/src/env/components/FirmwareSingleImage/FirmwareSingleImage.vue b/src/env/components/FirmwareSingleImage/FirmwareSingleImage.vue
index f719631a..3ad717e5 100644
--- a/src/env/components/FirmwareSingleImage/FirmwareSingleImage.vue
+++ b/src/env/components/FirmwareSingleImage/FirmwareSingleImage.vue
@@ -1,6 +1,6 @@
 <template>
   <b-container fluid="xl">
-    <page-title :description="$t('pageFirmware.pageDescription')" />
+    <page-title :description="$t('pageFirmware.pageDescriptionSingleImage')" />
     <!-- Operation in progress alert -->
     <alert v-if="isOperationInProgress" variant="info" class="mb-5">
       <p>
@@ -183,7 +183,7 @@
               <p class="font-weight-bold mb-1">
                 {{ $t('pageFirmware.alert.updateProcess') }}
               </p>
-              <p>{{ $t('pageFirmware.alert.updateProcessInfo') }}</p>
+              <p>{{ $t('pageFirmware.alert.updateProcessInfoSingleImage') }}</p>
             </alert>
             <b-form-group>
               <b-btn type="submit" variant="primary" :disabled="isPageDisabled">
@@ -271,7 +271,7 @@ export default {
     this.$store.dispatch('firmwareSingleImage/getUpdateServiceApplyTime');
     Promise.all([
       this.$store.dispatch('global/getHostStatus'),
-      this.$store.dispatch('firmwareSingleImage/getSystemFirwareVersion')
+      this.$store.dispatch('firmwareSingleImage/getFirmwareInformation')
     ]).finally(() => this.endLoader());
   },
   beforeRouteLeave(to, from, next) {
diff --git a/src/env/components/FirmwareSingleImage/FirmwareSingleImageModalUpload.vue b/src/env/components/FirmwareSingleImage/FirmwareSingleImageModalUpload.vue
index d092becd..5b6dfa2f 100644
--- a/src/env/components/FirmwareSingleImage/FirmwareSingleImageModalUpload.vue
+++ b/src/env/components/FirmwareSingleImage/FirmwareSingleImageModalUpload.vue
@@ -1,18 +1,20 @@
 <template>
   <b-modal
     id="modal-upload"
-    :title="$t('pageFirmware.modal.uploadAndReboot.title')"
-    :ok-title="$t('pageFirmware.modal.uploadAndReboot.primaryAction')"
+    :title="$t('pageFirmware.modal.uploadAndRebootSingleImage.title')"
+    :ok-title="
+      $t('pageFirmware.modal.uploadAndRebootSingleImage.primaryAction')
+    "
     @ok="$emit('ok')"
   >
     <p>
-      {{ $t('pageFirmware.modal.uploadAndReboot.message1') }}
+      {{ $t('pageFirmware.modal.uploadAndRebootSingleImage.message1') }}
     </p>
     <p>
-      {{ $t('pageFirmware.modal.uploadAndReboot.message2') }}
+      {{ $t('pageFirmware.modal.uploadAndRebootSingleImage.message2') }}
     </p>
     <p class="font-weight-bold">
-      {{ $t('pageFirmware.modal.uploadAndReboot.message3') }}
+      {{ $t('pageFirmware.modal.uploadAndRebootSingleImage.message3') }}
     </p>
   </b-modal>
 </template>
diff --git a/src/env/store/FirmwareSingleImage/FirmwareSingleImageStore.js b/src/env/store/FirmwareSingleImage/FirmwareSingleImageStore.js
index d00c5f71..98f86fd5 100644
--- a/src/env/store/FirmwareSingleImage/FirmwareSingleImageStore.js
+++ b/src/env/store/FirmwareSingleImage/FirmwareSingleImageStore.js
@@ -22,7 +22,8 @@ const FirmwareSingleImageStore = {
     backupFirmwareVersion: state => state.backupFirmware.version,
     backupFirmwareStatus: state => state.backupFirmware.status,
     isRebootFromBackupAvailable: state =>
-      state.backupFirmware.id ? true : false
+      state.backupFirmware.id ? true : false,
+    bmcFirmwareCurrentVersion: state => state.activeFirmware.version //this getter is needed for the Overview page
   },
   mutations: {
     setActiveFirmware: (state, { version, id, location }) => {
@@ -39,7 +40,7 @@ const FirmwareSingleImageStore = {
     setApplyTime: (state, applyTime) => (state.applyTime = applyTime)
   },
   actions: {
-    async getSystemFirwareVersion({ commit }) {
+    async getFirmwareInformation({ commit }) {
       return await api
         .get('/redfish/v1/Managers/bmc')
         .then(({ data: { Links } }) => {
diff --git a/src/locales/en-US.json b/src/locales/en-US.json
index 7a4672d6..ea88e5ad 100644
--- a/src/locales/en-US.json
+++ b/src/locales/en-US.json
@@ -199,9 +199,13 @@
     "changeAndRebootBmc": "Change image and reboot BMC",
     "changeToBackupImage": "Change to backup image",
     "current": "Current:",
+    "firmwareOnBmc": "Firmware on BMC",
+    "firmwareOnHost": "Firmware on host",
     "firmwareOnSystem": "Firmware on system",
     "hostStatus": "Host status",
-    "pageDescription": "Update firmware by uploading a system image file from your workstation or TFTP server",
+    "makeCurrentVersion": "Make current version",
+    "pageDescription": "Update firmware by uploading a BMC or Host image file from your workstation or TFTP server",
+    "pageDescriptionSingleImage": "Update firmware by uploading a system image file from your workstation or TFTP server",
     "running": "Running",
     "state": "State",
     "updateCode": "Update code",
@@ -211,7 +215,8 @@
       "serverShutdownRequiredInfo": "Shutdown will be orderly - OS will shutdown before the server shuts down.",
       "shutDownServer": "Shut down server",
       "updateProcess": "Update process",
-      "updateProcessInfo": "The new image will be uploaded and activated. After that, the BMC will reboot automatically to run from the new image."
+      "updateProcessInfo": "The new image will be uploaded and activated. After that, the BMC or host will reboot automatically to run from the new image.",
+      "updateProcessInfoSingleImage": "The new image will be uploaded and activated. After that, the BMC will reboot automatically to run from the new image."
     },
     "form": {
       "imageFile": "Image file",
@@ -221,6 +226,7 @@
       "tftpServerAddress": "TFTP server address",
       "tftpServerAddressHelper": "IP address or FQDN",
       "uploadAndRebootBmc": "Upload and reboot BMC",
+      "uploadAndRebootBmcOrHost": "Upload and reboot BMC or host",
       "uploadLocation": "Upload location",
       "workstation": "Workstation"
     },
@@ -236,12 +242,19 @@
         "primaryAction": "Reboot BMC from backup image",
         "title": "@:pageFirmware.modal.connectionToBmcWillBeLost"
       },
-      "uploadAndReboot": {
+      "uploadAndRebootSingleImage": {
         "message1": "A BMC reboot is required before the system can run the new firmware image. The reboot will cause a disconnection, and may require logging in again.",
         "message2": "During the reboot, the server cannot be powered back on. The backup image will be permanently deleted.",
         "message3": "Are you sure you want to upload the new firmware image and reboot the BMC?",
         "primaryAction": "Upload and reboot BMC",
         "title": "@:pageFirmware.modal.connectionToBmcWillBeLost"
+      },
+      "uploadAndRebootBmcOrHost": {
+        "message1": "A BMC or host reboot is required before the system can run the new firmware image. The reboot will cause a disconnection, and may require logging in again.",
+        "message2": "The backup image will be permanently deleted.",
+        "message3": "Are you sure you want to upload the new firmware image and reboot the BMC or host?",
+        "primaryAction": "Upload and reboot BMC or host",
+        "title": "Connection to BMC or host will be lost"
       }
     },
     "toast": {
diff --git a/src/store/modules/Configuration/FirmwareStore.js b/src/store/modules/Configuration/FirmwareStore.js
index d9d3cfb8..c99e7eb8 100644
--- a/src/store/modules/Configuration/FirmwareStore.js
+++ b/src/store/modules/Configuration/FirmwareStore.js
@@ -1,57 +1,126 @@
 import api from '@/store/api';
 import i18n from '@/i18n';
 
+/**
+ * Get backup firmware image from SoftwareImages
+ * The backup is whichever image is not the current
+ * or "ActiveSoftwareImage"
+ * @param {Array} list
+ * @param {String} currentLocation
+ */
+function getBackupFirmwareLocation(list, currentLocation) {
+  return list
+    .map(item => item['@odata.id'])
+    .find(location => {
+      const id = location.split('/').pop();
+      const currentId = currentLocation.split('/').pop();
+      return id !== currentId;
+    });
+}
+
 const FirmwareStore = {
   namespaced: true,
   state: {
-    activeFirmware: {
-      version: '--',
-      id: null,
-      location: null
+    bmcFirmware: {
+      currentVersion: null,
+      currentState: null,
+      currentLocation: null,
+      backupVersion: null,
+      backupState: null,
+      backupLocation: null
     },
-    backupFirmware: {
-      version: '--',
-      id: null,
-      location: null,
-      status: '--'
+    hostFirmware: {
+      currentVersion: null,
+      currentState: null,
+      currentLocation: null,
+      backupVersion: null,
+      backupState: null,
+      backupLocation: null
     },
     applyTime: null
   },
   getters: {
-    systemFirmwareVersion: state => state.activeFirmware.version,
-    backupFirmwareVersion: state => state.backupFirmware.version,
-    backupFirmwareStatus: state => state.backupFirmware.status,
-    isRebootFromBackupAvailable: state =>
-      state.backupFirmware.id ? true : false
+    bmcFirmwareCurrentVersion: state => state.bmcFirmware.currentVersion,
+    bmcFirmwareCurrentState: state => state.bmcFirmware.currentState,
+    bmcFirmwareBackupVersion: state => state.bmcFirmware.backupVersion,
+    bmcFirmwareBackupState: state => state.bmcFirmware.backupState,
+    hostFirmwareCurrentVersion: state => state.hostFirmware.currentVersion,
+    hostFirmwareCurrentState: state => state.hostFirmware.currentState,
+    hostFirmwareBackupVersion: state => state.hostFirmware.backupVersion,
+    hostFirmwareBackupState: state => state.hostFirmware.backupState
   },
   mutations: {
-    setActiveFirmware: (state, { version, id, location }) => {
-      state.activeFirmware.version = version;
-      state.activeFirmware.id = id;
-      state.activeFirmware.location = location;
+    setBmcFirmwareCurrent: (state, { version, location, status }) => {
+      state.bmcFirmware.currentVersion = version;
+      state.bmcFirmware.currentState = status;
+      state.bmcFirmware.currentLocation = location;
+    },
+    setBmcFirmwareBackup: (state, { version, location, status }) => {
+      state.bmcFirmware.backupVersion = version;
+      state.bmcFirmware.backupState = status;
+      state.bmcFirmware.backupLocation = location;
     },
-    setBackupFirmware: (state, { version, id, location, status }) => {
-      state.backupFirmware.version = version;
-      state.backupFirmware.id = id;
-      state.backupFirmware.location = location;
-      state.backupFirmware.status = status;
+    setHostFirmwareCurrent: (state, { version, location, status }) => {
+      state.hostFirmware.currentVersion = version;
+      state.hostFirmware.currentState = status;
+      state.hostFirmware.currentLocation = location;
+    },
+    setHostFirmwareBackup: (state, { version, location, status }) => {
+      state.hostFirmware.backupVersion = version;
+      state.hostFirmware.backupState = status;
+      state.hostFirmware.backupLocation = location;
     },
     setApplyTime: (state, applyTime) => (state.applyTime = applyTime)
   },
   actions: {
-    async getSystemFirwareVersion({ commit }) {
+    async getFirmwareInformation({ dispatch }) {
+      return await api.all([
+        dispatch('getBmcFirmware'),
+        dispatch('getHostFirmware')
+      ]);
+    },
+    async getBmcFirmware({ commit }) {
       return await api
         .get('/redfish/v1/Managers/bmc')
         .then(({ data: { Links } }) => {
           const currentLocation = Links.ActiveSoftwareImage['@odata.id'];
           // Check SoftwareImages list for not ActiveSoftwareImage id
-          const backupLocation = Links.SoftwareImages.map(
-            item => item['@odata.id']
-          ).find(location => {
-            const id = location.split('/').pop();
-            const currentId = currentLocation.split('/').pop();
-            return id !== currentId;
+          const backupLocation = getBackupFirmwareLocation(
+            Links.SoftwareImages,
+            currentLocation
+          );
+          return { currentLocation, backupLocation };
+        })
+        .then(async ({ currentLocation, backupLocation }) => {
+          const currentData = await api.get(currentLocation);
+          let backupData = {};
+
+          if (backupLocation) {
+            backupData = await api.get(backupLocation);
+          }
+
+          commit('setBmcFirmwareCurrent', {
+            version: currentData?.data?.Version,
+            location: currentData?.data?.['@odata.id'],
+            status: currentData?.data?.Status?.State
+          });
+          commit('setBmcFirmwareBackup', {
+            version: backupData.data?.Version,
+            location: backupData.data?.['@odata.id'],
+            status: backupData.data?.Status?.State
           });
+        })
+        .catch(error => console.log(error));
+    },
+    async getHostFirmware({ commit }) {
+      return await api
+        .get('/redfish/v1/Systems/system/Bios')
+        .then(({ data: { Links } }) => {
+          const currentLocation = Links.ActiveSoftwareImage['@odata.id'];
+          const backupLocation = getBackupFirmwareLocation(
+            Links.SoftwareImages,
+            currentLocation
+          );
           return { currentLocation, backupLocation };
         })
         .then(async ({ currentLocation, backupLocation }) => {
@@ -62,14 +131,13 @@ const FirmwareStore = {
             backupData = await api.get(backupLocation);
           }
 
-          commit('setActiveFirmware', {
+          commit('setHostFirmwareCurrent', {
             version: currentData?.data?.Version,
-            id: currentData?.data?.Id,
-            location: currentData?.data?.['@odata.id']
+            location: currentData?.data?.['@odata.id'],
+            status: currentData?.data?.Status?.State
           });
-          commit('setBackupFirmware', {
+          commit('setHostFirmwareBackup', {
             version: backupData.data?.Version,
-            id: backupData.data?.Id,
             location: backupData.data?.['@odata.id'],
             status: backupData.data?.Status?.State
           });
@@ -138,8 +206,8 @@ const FirmwareStore = {
           throw new Error(i18n.t('pageFirmware.toast.errorUploadAndReboot'));
         });
     },
-    async switchFirmwareAndReboot({ state }) {
-      const backupLoaction = state.backupFirmware.location;
+    async swtichBmcFirmware({ state }) {
+      const backupLoaction = state.bmcFirmware.backupLoaction;
       const data = {
         Links: {
           ActiveSoftwareImage: {
diff --git a/src/views/Configuration/Firmware/Firmware.vue b/src/views/Configuration/Firmware/Firmware.vue
index e63db518..e1f97c4e 100644
--- a/src/views/Configuration/Firmware/Firmware.vue
+++ b/src/views/Configuration/Firmware/Firmware.vue
@@ -1,97 +1,86 @@
 <template>
   <b-container fluid="xl">
     <page-title :description="$t('pageFirmware.pageDescription')" />
-    <!-- Operation in progress alert -->
-    <alert v-if="isOperationInProgress" variant="info" class="mb-5">
-      <p>
-        {{ $t('pageFirmware.alert.operationInProgress') }}
-      </p>
-    </alert>
-    <!-- Shutdown server warning alert -->
-    <alert v-else-if="!isHostOff" variant="warning" class="mb-5">
-      <p class="font-weight-bold mb-1">
-        {{ $t('pageFirmware.alert.serverShutdownRequiredBeforeUpdate') }}
-      </p>
-      {{ $t('pageFirmware.alert.serverShutdownRequiredInfo') }}
-      <template v-slot:action>
-        <b-btn variant="link" class="text-nowrap" @click="onClickShutDown">
-          {{ $t('pageFirmware.alert.shutDownServer') }}
-        </b-btn>
-      </template>
-    </alert>
     <b-row class="mb-4">
-      <!-- Firmware on system -->
       <b-col md="10" lg="12" xl="8" class="pr-xl-4">
-        <page-section :section-title="$t('pageFirmware.firmwareOnSystem')">
+        <!-- Firmware on BMC -->
+        <page-section :section-title="$t('pageFirmware.firmwareOnBmc')">
           <b-card-group deck>
             <!-- Current FW -->
             <b-card header-bg-variant="success">
               <template v-slot:header>
                 <dl class="mb-0">
                   <dt>{{ $t('pageFirmware.current') }}</dt>
-                  <dd class="mb-0">{{ systemFirmwareVersion }}</dd>
+                  <dd class="mb-0">{{ bmcFirmwareCurrentVersion }}</dd>
                 </dl>
               </template>
-              <b-row>
-                <b-col xs="6">
-                  <dl class="my-0">
-                    <dt>{{ $t('pageFirmware.bmcStatus') }}</dt>
-                    <dd>{{ $t('pageFirmware.running') }}</dd>
-                  </dl>
-                </b-col>
-                <b-col xs="6">
-                  <dl class="my-0">
-                    <dt>{{ $t('pageFirmware.hostStatus') }}</dt>
-                    <dd v-if="hostStatus === 'on'">
-                      {{ $t('global.status.on') }}
-                    </dd>
-                    <dd v-else-if="hostStatus === 'off'">
-                      {{ $t('global.status.off') }}
-                    </dd>
-                    <dd v-else>
-                      {{ $t('global.status.notAvailable') }}
-                    </dd>
-                  </dl>
-                </b-col>
-              </b-row>
+              <dl class="my-0">
+                <dt>{{ $t('pageFirmware.state') }}:</dt>
+                <dd>{{ bmcFirmwareCurrentState }}</dd>
+              </dl>
+              <template v-slot:footer></template>
             </b-card>
 
             <!-- Backup FW -->
-            <b-card>
+            <b-card footer-class="p-0">
               <template v-slot:header>
                 <dl class="mb-0">
                   <dt>{{ $t('pageFirmware.backup') }}</dt>
-                  <dd class="mb-0">{{ backupFirmwareVersion }}</dd>
+                  <dd class="mb-0">{{ bmcFirmwareBackupVersion }}</dd>
                 </dl>
               </template>
-              <b-row>
-                <b-col xs="6">
-                  <dl class="my-0">
-                    <dt>{{ $t('pageFirmware.state') }}</dt>
-                    <dd>{{ backupFirmwareStatus }}</dd>
-                  </dl>
-                </b-col>
-              </b-row>
+              <dl class="my-0">
+                <dt>{{ $t('pageFirmware.state') }}:</dt>
+                <dd>{{ bmcFirmwareBackupState }}</dd>
+              </dl>
+              <template v-slot:footer>
+                <b-btn
+                  v-b-modal.modal-reboot-backup-bmc
+                  :disabled="!bmcFirmwareBackupVersion"
+                  variant="link"
+                  size="sm"
+                >
+                  <icon-switch class="d-none d-sm-inline-block" />
+                  {{ $t('pageFirmware.makeCurrentVersion') }}</b-btn
+                >
+              </template>
             </b-card>
           </b-card-group>
         </page-section>
 
-        <!-- Change to backup image -->
-        <page-section :section-title="$t('pageFirmware.changeToBackupImage')">
-          <dl class="mb-5">
-            <dt>
-              {{ $t('pageFirmware.backupImage') }}
-            </dt>
-            <dd>{{ backupFirmwareVersion }}</dd>
-          </dl>
-          <b-btn
-            v-b-modal.modal-reboot-backup
-            type="button"
-            variant="primary"
-            :disabled="isPageDisabled || !isRebootFromBackupAvailable"
-          >
-            {{ $t('pageFirmware.changeAndRebootBmc') }}
-          </b-btn>
+        <!-- Firmware on Host -->
+        <page-section :section-title="$t('pageFirmware.firmwareOnHost')">
+          <b-card-group deck>
+            <!-- Current FW -->
+            <b-card header-bg-variant="success">
+              <template v-slot:header>
+                <dl class="mb-0">
+                  <dt>{{ $t('pageFirmware.current') }}</dt>
+                  <dd class="mb-0">{{ hostFirmwareCurrentVersion }}</dd>
+                </dl>
+              </template>
+              <!-- State -->
+              <dl class="my-0">
+                <dt>{{ $t('pageFirmware.state') }}:</dt>
+                <dd>{{ hostFirmwareCurrentState }}</dd>
+              </dl>
+            </b-card>
+
+            <!-- Backup FW -->
+            <b-card>
+              <template v-slot:header>
+                <dl class="mb-0">
+                  <dt>{{ $t('pageFirmware.backup') }}</dt>
+                  <dd class="mb-0">{{ hostFirmwareBackupVersion }}</dd>
+                </dl>
+              </template>
+              <!-- State -->
+              <dl class="my-0">
+                <dt>{{ $t('pageFirmware.state') }}:</dt>
+                <dd>{{ hostFirmwareBackupState }}</dd>
+              </dl>
+            </b-card>
+          </b-card-group>
         </page-section>
       </b-col>
 
@@ -99,10 +88,7 @@
       <b-col sm="8" xl="4" class="update-code pl-xl-4">
         <page-section :section-title="$t('pageFirmware.updateCode')">
           <b-form @submit.prevent="onSubmitUpload">
-            <b-form-group
-              :label="$t('pageFirmware.form.uploadLocation')"
-              :disabled="isPageDisabled"
-            >
+            <b-form-group :label="$t('pageFirmware.form.uploadLocation')">
               <b-form-radio v-model="isWorkstationSelected" :value="true">
                 {{ $t('pageFirmware.form.workstation') }}
               </b-form-radio>
@@ -128,7 +114,6 @@
                   :browse-text="$t('global.fileUpload.browseText')"
                   :drop-placeholder="$t('global.fileUpload.dropPlaceholder')"
                   :placeholder="$t('global.fileUpload.placeholder')"
-                  :disabled="isPageDisabled"
                   :state="getValidationState($v.file)"
                   @input="$v.file.$touch()"
                 />
@@ -169,7 +154,6 @@
                   v-model="tftpFileName"
                   type="text"
                   :state="getValidationState($v.tftpFileName)"
-                  :disabled="isPageDisabled"
                   @input="$v.tftpFileName.$touch()"
                 />
                 <b-form-invalid-feedback role="alert">
@@ -186,8 +170,8 @@
               <p>{{ $t('pageFirmware.alert.updateProcessInfo') }}</p>
             </alert>
             <b-form-group>
-              <b-btn type="submit" variant="primary" :disabled="isPageDisabled">
-                {{ $t('pageFirmware.form.uploadAndRebootBmc') }}
+              <b-btn type="submit" variant="primary">
+                {{ $t('pageFirmware.form.uploadAndRebootBmcOrHost') }}
               </b-btn>
             </b-form-group>
           </b-form>
@@ -197,10 +181,10 @@
 
     <!-- Modals -->
     <modal-upload @ok="uploadFirmware" />
-    <modal-reboot-backup
-      :current="systemFirmwareVersion"
-      :backup="backupFirmwareVersion"
-      @ok="rebootFromBackup"
+    <modal-reboot-backup-bmc
+      :current="bmcFirmwareCurrentVersion || '--'"
+      :backup="bmcFirmwareBackupVersion || '--'"
+      @ok="switchBmcFirmware"
     />
   </b-container>
 </template>
@@ -208,12 +192,13 @@
 <script>
 import { requiredIf } from 'vuelidate/lib/validators';
 import { mapGetters } from 'vuex';
+import IconSwitch from '@carbon/icons-vue/es/arrows--horizontal/20';
 
 import PageSection from '@/components/Global/PageSection';
 import PageTitle from '@/components/Global/PageTitle';
 import Alert from '@/components/Global/Alert';
 import ModalUpload from './FirmwareModalUpload';
-import ModalRebootBackup from './FirmwareModalRebootBackup';
+import ModalRebootBackupBmc from './FirmwareModalRebootBackupBmc';
 
 import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
 import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
@@ -223,7 +208,8 @@ export default {
   name: 'Firmware',
   components: {
     Alert,
-    ModalRebootBackup,
+    IconSwitch,
+    ModalRebootBackupBmc,
     ModalUpload,
     PageSection,
     PageTitle
@@ -239,24 +225,16 @@ export default {
     };
   },
   computed: {
-    hostStatus() {
-      return this.$store.getters['global/hostStatus'];
-    },
-    isHostOff() {
-      return this.hostStatus === 'off' ? true : false;
-    },
-    isOperationInProgress() {
-      return this.$store.getters['controls/isOperationInProgress'];
-    },
     ...mapGetters('firmware', [
-      'backupFirmwareStatus',
-      'backupFirmwareVersion',
-      'isRebootFromBackupAvailable',
-      'systemFirmwareVersion'
-    ]),
-    isPageDisabled() {
-      return !this.isHostOff || this.loading || this.isOperationInProgress;
-    }
+      'bmcFirmwareCurrentVersion',
+      'bmcFirmwareCurrentState',
+      'bmcFirmwareBackupVersion',
+      'bmcFirmwareBackupState',
+      'hostFirmwareCurrentVersion',
+      'hostFirmwareCurrentState',
+      'hostFirmwareBackupVersion',
+      'hostFirmwareBackupState'
+    ])
   },
   watch: {
     isWorkstationSelected: function() {
@@ -269,10 +247,9 @@ export default {
   created() {
     this.startLoader();
     this.$store.dispatch('firmware/getUpdateServiceApplyTime');
-    Promise.all([
-      this.$store.dispatch('global/getHostStatus'),
-      this.$store.dispatch('firmware/getSystemFirwareVersion')
-    ]).finally(() => this.endLoader());
+    this.$store
+      .dispatch('firmware/getFirmwareInformation')
+      .finally(() => this.endLoader());
   },
   beforeRouteLeave(to, from, next) {
     this.hideLoader();
@@ -344,10 +321,10 @@ export default {
           this.clearRebootTimeout();
         });
     },
-    rebootFromBackup() {
+    switchBmcFirmware() {
       this.setRebootTimeout();
       this.$store
-        .dispatch('firmware/switchFirmwareAndReboot')
+        .dispatch('firmware/switchBmcFirmware')
         .then(success =>
           this.infoToast(success, this.$t('global.status.success'))
         )
@@ -378,18 +355,6 @@ export default {
       this.$v.$touch();
       if (this.$v.$invalid) return;
       this.$bvModal.show('modal-upload');
-    },
-    onClickShutDown() {
-      this.$bvModal
-        .msgBoxConfirm(this.$t('pageFirmware.modal.serverShutdownMessage'), {
-          title: this.$t('pageFirmware.modal.serverShutdownWillCauseOutage'),
-          okTitle: this.$t('pageFirmware.modal.shutDownServer'),
-          okVariant: 'danger'
-        })
-        .then(shutdownConfirmed => {
-          if (shutdownConfirmed)
-            this.$store.dispatch('controls/hostSoftPowerOff');
-        });
     }
   }
 };
@@ -402,4 +367,10 @@ export default {
     border-left: 1px solid gray('300');
   }
 }
+.card-footer {
+  height: 41px;
+}
+.card-body {
+  padding: 0.75rem 1.25rem;
+}
 </style>
diff --git a/src/views/Configuration/Firmware/FirmwareModalRebootBackup.vue b/src/views/Configuration/Firmware/FirmwareModalRebootBackupBmc.vue
index a8fb3ad5..06ab65d9 100644
--- a/src/views/Configuration/Firmware/FirmwareModalRebootBackup.vue
+++ b/src/views/Configuration/Firmware/FirmwareModalRebootBackupBmc.vue
@@ -1,6 +1,6 @@
 <template>
   <b-modal
-    id="modal-reboot-backup"
+    id="modal-reboot-backup-bmc"
     :ok-title="$t('pageFirmware.modal.rebootFromBackup.primaryAction')"
     :title="$t('pageFirmware.modal.rebootFromBackup.title')"
     @ok="$emit('ok')"
diff --git a/src/views/Configuration/Firmware/FirmwareModalUpload.vue b/src/views/Configuration/Firmware/FirmwareModalUpload.vue
index d092becd..d7ff05b5 100644
--- a/src/views/Configuration/Firmware/FirmwareModalUpload.vue
+++ b/src/views/Configuration/Firmware/FirmwareModalUpload.vue
@@ -1,18 +1,19 @@
 <template>
   <b-modal
     id="modal-upload"
-    :title="$t('pageFirmware.modal.uploadAndReboot.title')"
-    :ok-title="$t('pageFirmware.modal.uploadAndReboot.primaryAction')"
+    ok-variant="danger"
+    :title="$t('pageFirmware.modal.uploadAndRebootBmcOrHost.title')"
+    :ok-title="$t('pageFirmware.modal.uploadAndRebootBmcOrHost.primaryAction')"
     @ok="$emit('ok')"
   >
     <p>
-      {{ $t('pageFirmware.modal.uploadAndReboot.message1') }}
+      {{ $t('pageFirmware.modal.uploadAndRebootBmcOrHost.message1') }}
     </p>
     <p>
-      {{ $t('pageFirmware.modal.uploadAndReboot.message2') }}
+      {{ $t('pageFirmware.modal.uploadAndRebootBmcOrHost.message2') }}
     </p>
     <p class="font-weight-bold">
-      {{ $t('pageFirmware.modal.uploadAndReboot.message3') }}
+      {{ $t('pageFirmware.modal.uploadAndRebootBmcOrHost.message3') }}
     </p>
   </b-modal>
 </template>
diff --git a/src/views/Overview/Overview.vue b/src/views/Overview/Overview.vue
index 13998297..27a599b9 100644
--- a/src/views/Overview/Overview.vue
+++ b/src/views/Overview/Overview.vue
@@ -104,28 +104,41 @@ export default {
     PageSection
   },
   mixins: [LoadingBarMixin],
-  computed: mapState({
-    server: state => state.system.systems[0],
-    bmcFirmwareVersion: state => state.firmware?.activeFirmware.version,
-    powerCapValue: state => state.powerControl.powerCapValue,
-    powerConsumptionValue: state => state.powerControl.powerConsumptionValue,
-    serverManufacturer() {
-      if (this.server) return this.server.manufacturer || '--';
-      return '--';
-    },
-    serverModel() {
-      if (this.server) return this.server.model || '--';
-      return '--';
-    },
-    serverSerialNumber() {
-      if (this.server) return this.server.serialNumber || '--';
-      return '--';
-    },
-    hostFirmwareVersion() {
-      if (this.server) return this.server.firmwareVersion || '--';
-      return '--';
+  data() {
+    return {
+      firmwareStoreModuleName: this.$store.hasModule('firmwareSingleImage')
+        ? 'firmwareSingleImage'
+        : 'firmware'
+    };
+  },
+  computed: {
+    ...mapState({
+      server: state => state.system.systems[0],
+      powerCapValue: state => state.powerControl.powerCapValue,
+      powerConsumptionValue: state => state.powerControl.powerConsumptionValue,
+      serverManufacturer() {
+        if (this.server) return this.server.manufacturer || '--';
+        return '--';
+      },
+      serverModel() {
+        if (this.server) return this.server.model || '--';
+        return '--';
+      },
+      serverSerialNumber() {
+        if (this.server) return this.server.serialNumber || '--';
+        return '--';
+      },
+      hostFirmwareVersion() {
+        if (this.server) return this.server.firmwareVersion || '--';
+        return '--';
+      }
+    }),
+    bmcFirmwareVersion() {
+      return this.$store.getters[
+        `${this.firmwareStoreModuleName}/bmcFirmwareCurrentVersion`
+      ];
     }
-  }),
+  },
   created() {
     this.startLoader();
     const quicklinksPromise = new Promise(resolve => {
@@ -139,7 +152,9 @@ export default {
     });
     Promise.all([
       this.$store.dispatch('system/getSystem'),
-      this.$store.dispatch('firmware/getSystemFirwareVersion'),
+      this.$store.dispatch(
+        `${this.firmwareStoreModuleName}/getFirmwareInformation`
+      ),
       this.$store.dispatch('powerControl/getPowerControl'),
       quicklinksPromise,
       networkPromise,