diff --git a/src/App.vue b/src/App.vue
index b57a91d..f6991c4 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -4,20 +4,20 @@
   </div>
 </template>
 
-<style lang="scss">
-@import '@/assets/styles/_obmc-custom';
-</style>
-
 <script>
 export default {
   name: 'App',
   watch: {
-    $route: function(to) {
+    $route: function (to) {
       document.title = to.meta.title || 'Page is missing title';
-    }
+    },
   },
   created() {
     document.title = this.$route.meta.title || 'Page is missing title';
-  }
+  },
 };
 </script>
+
+<style lang="scss">
+@import '@/assets/styles/_obmc-custom';
+</style>
diff --git a/src/components/AppHeader/AppHeader.vue b/src/components/AppHeader/AppHeader.vue
index b155412..01ebf5a 100644
--- a/src/components/AppHeader/AppHeader.vue
+++ b/src/components/AppHeader/AppHeader.vue
@@ -69,7 +69,7 @@
               right
               data-test-id="appHeader-container-user"
             >
-              <template v-slot:button-content>
+              <template #button-content>
                 <icon-avatar :title="$t('appHeader.titleProfile')" />
                 <span class="responsive-text">{{ username }}</span>
               </template>
@@ -110,13 +110,13 @@
     IconMenu,
     IconRenew,
     StatusIcon,
-    LoadingBar
+    LoadingBar,
   },
   mixins: [BVToastMixin],
   data() {
     return {
       isNavigationOpen: false,
-      altLogo: `${process.env.VUE_APP_COMPANY_NAME} logo`
+      altLogo: `${process.env.VUE_APP_COMPANY_NAME} logo`,
     };
   },
   computed: {
@@ -156,7 +156,7 @@
     },
     username() {
       return this.$store.getters['global/username'];
-    }
+    },
   },
   watch: {
     isAuthorized(value) {
@@ -166,7 +166,7 @@
           this.$t('global.toast.unAuthTitle')
         );
       }
-    }
+    },
   },
   created() {
     // Reset auth state to check if user is authenticated based
@@ -178,7 +178,7 @@
   mounted() {
     this.$root.$on(
       'change:isNavigationOpen',
-      isNavigationOpen => (this.isNavigationOpen = isNavigationOpen)
+      (isNavigationOpen) => (this.isNavigationOpen = isNavigationOpen)
     );
   },
   methods: {
@@ -196,8 +196,8 @@
     },
     toggleNavigation() {
       this.$root.$emit('toggle:navigation');
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/components/AppNavigation/AppNavigation.vue b/src/components/AppNavigation/AppNavigation.vue
index 5d8a17f..18b8000 100644
--- a/src/components/AppNavigation/AppNavigation.vue
+++ b/src/components/AppNavigation/AppNavigation.vue
@@ -63,16 +63,16 @@
   mixins: [AppNavigationMixin],
   data() {
     return {
-      isNavigationOpen: false
+      isNavigationOpen: false,
     };
   },
   watch: {
-    $route: function() {
+    $route: function () {
       this.isNavigationOpen = false;
     },
-    isNavigationOpen: function(isNavigationOpen) {
+    isNavigationOpen: function (isNavigationOpen) {
       this.$root.$emit('change:isNavigationOpen', isNavigationOpen);
-    }
+    },
   },
   mounted() {
     this.$root.$on('toggle:navigation', () => this.toggleIsOpen());
@@ -80,8 +80,8 @@
   methods: {
     toggleIsOpen() {
       this.isNavigationOpen = !this.isNavigationOpen;
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/components/AppNavigation/AppNavigationMixin.js b/src/components/AppNavigation/AppNavigationMixin.js
index 498d6ca..cf34b91 100644
--- a/src/components/AppNavigation/AppNavigationMixin.js
+++ b/src/components/AppNavigation/AppNavigationMixin.js
@@ -12,7 +12,7 @@
     iconControl: IconSettingsAdjust,
     iconConfiguration: IconSettings,
     iconAccessControl: IconPassword,
-    iconExpand: IconChevronUp
+    iconExpand: IconChevronUp,
   },
   data() {
     return {
@@ -21,7 +21,7 @@
           id: 'overview',
           label: this.$t('appNavigation.overview'),
           route: '/',
-          icon: 'iconOverview'
+          icon: 'iconOverview',
         },
         {
           id: 'health',
@@ -31,19 +31,19 @@
             {
               id: 'event-logs',
               label: this.$t('appNavigation.eventLogs'),
-              route: '/health/event-logs'
+              route: '/health/event-logs',
             },
             {
               id: 'hardware-status',
               label: this.$t('appNavigation.hardwareStatus'),
-              route: '/health/hardware-status'
+              route: '/health/hardware-status',
             },
             {
               id: 'sensors',
               label: this.$t('appNavigation.sensors'),
-              route: '/health/sensors'
-            }
-          ]
+              route: '/health/sensors',
+            },
+          ],
         },
         {
           id: 'control',
@@ -53,39 +53,39 @@
             {
               id: 'kvm',
               label: this.$t('appNavigation.kvm'),
-              route: '/control/kvm'
+              route: '/control/kvm',
             },
             {
               id: 'manage-power-usage',
               label: this.$t('appNavigation.managePowerUsage'),
-              route: '/control/manage-power-usage'
+              route: '/control/manage-power-usage',
             },
             {
               id: 'reboot-bmc',
               label: this.$t('appNavigation.rebootBmc'),
-              route: '/control/reboot-bmc'
+              route: '/control/reboot-bmc',
             },
             {
               id: 'serial-over-lan',
               label: this.$t('appNavigation.serialOverLan'),
-              route: '/control/serial-over-lan'
+              route: '/control/serial-over-lan',
             },
             {
               id: 'server-led',
               label: this.$t('appNavigation.serverLed'),
-              route: '/control/server-led'
+              route: '/control/server-led',
             },
             {
               id: 'server-power-operations',
               label: this.$t('appNavigation.serverPowerOperations'),
-              route: '/control/server-power-operations'
+              route: '/control/server-power-operations',
             },
             {
               id: 'virtual-media',
               label: this.$t('appNavigation.virtualMedia'),
-              route: '/control/virtual-media'
-            }
-          ]
+              route: '/control/virtual-media',
+            },
+          ],
         },
         {
           id: 'configuration',
@@ -95,24 +95,24 @@
             {
               id: 'date-time-settings',
               label: this.$t('appNavigation.dateTimeSettings'),
-              route: '/configuration/date-time-settings'
+              route: '/configuration/date-time-settings',
             },
             {
               id: 'firmware',
               label: this.$t('appNavigation.firmware'),
-              route: '/configuration/firmware'
+              route: '/configuration/firmware',
             },
             {
               id: 'network-settings',
               label: this.$t('appNavigation.networkSettings'),
-              route: '/configuration/network-settings'
+              route: '/configuration/network-settings',
             },
             {
               id: 'snmp-settings',
               label: this.$t('appNavigation.snmpSettings'),
-              route: ''
-            }
-          ]
+              route: '',
+            },
+          ],
         },
         {
           id: 'access-control',
@@ -122,23 +122,23 @@
             {
               id: 'ldap',
               label: this.$t('appNavigation.ldap'),
-              route: '/access-control/ldap'
+              route: '/access-control/ldap',
             },
             {
               id: 'local-user-management',
               label: this.$t('appNavigation.localUserManagement'),
-              route: '/access-control/local-user-management'
+              route: '/access-control/local-user-management',
             },
             {
               id: 'ssl-certificates',
               label: this.$t('appNavigation.sslCertificates'),
-              route: '/access-control/ssl-certificates'
-            }
-          ]
-        }
-      ]
+              route: '/access-control/ssl-certificates',
+            },
+          ],
+        },
+      ],
     };
-  }
+  },
 };
 
 export default AppNavigationMixin;
diff --git a/src/components/Global/Alert.vue b/src/components/Global/Alert.vue
index 88a4ae3..e8de9e2 100644
--- a/src/components/Global/Alert.vue
+++ b/src/components/Global/Alert.vue
@@ -3,9 +3,9 @@
     <div
       v-if="
         variant == 'info' ||
-          variant == 'success' ||
-          variant == 'warning' ||
-          variant == 'danger'
+        variant == 'success' ||
+        variant == 'warning' ||
+        variant == 'danger'
       "
       class="alert-icon"
     >
@@ -30,18 +30,18 @@
   name: 'Alert',
   components: {
     BAlert: BAlert,
-    StatusIcon: StatusIcon
+    StatusIcon: StatusIcon,
   },
   props: {
     show: {
       type: Boolean,
-      default: true
+      default: true,
     },
     variant: {
       type: String,
-      default: ''
+      default: '',
     },
-    small: Boolean
-  }
+    small: Boolean,
+  },
 };
 </script>
diff --git a/src/components/Global/InfoTooltip.vue b/src/components/Global/InfoTooltip.vue
index 1514166..f3cb7f1 100644
--- a/src/components/Global/InfoTooltip.vue
+++ b/src/components/Global/InfoTooltip.vue
@@ -13,9 +13,9 @@
   props: {
     title: {
       type: String,
-      default: ''
-    }
-  }
+      default: '',
+    },
+  },
 };
 </script>
 
diff --git a/src/components/Global/InputPasswordToggle.vue b/src/components/Global/InputPasswordToggle.vue
index 228746c..bf3e4ca 100644
--- a/src/components/Global/InputPasswordToggle.vue
+++ b/src/components/Global/InputPasswordToggle.vue
@@ -31,7 +31,7 @@
   components: { IconView, IconViewOff },
   data() {
     return {
-      isVisible: false
+      isVisible: false,
     };
   },
   methods: {
@@ -44,8 +44,8 @@
       if (inputEl.nodeName === 'INPUT') {
         inputEl.type = this.isVisible ? 'text' : 'password';
       }
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/components/Global/LoadingBar.vue b/src/components/Global/LoadingBar.vue
index 3f503c8..d62ef1e 100644
--- a/src/components/Global/LoadingBar.vue
+++ b/src/components/Global/LoadingBar.vue
@@ -18,7 +18,7 @@
       loadingIndicatorValue: 0,
       isLoadingComplete: false,
       loadingIntervalId: null,
-      timeoutId: null
+      timeoutId: null,
     };
   },
   created() {
@@ -66,8 +66,8 @@
     clearTimeout() {
       if (this.timeoutId) clearTimeout(this.timeoutId);
       this.timeoutId = null;
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/components/Global/PageContainer.vue b/src/components/Global/PageContainer.vue
index 8396bd5..e766d38 100644
--- a/src/components/Global/PageContainer.vue
+++ b/src/components/Global/PageContainer.vue
@@ -6,7 +6,7 @@
 
 <script>
 export default {
-  name: 'PageContainer'
+  name: 'PageContainer',
 };
 </script>
 
diff --git a/src/components/Global/PageSection.vue b/src/components/Global/PageSection.vue
index 303b6e1..dd39ddd 100644
--- a/src/components/Global/PageSection.vue
+++ b/src/components/Global/PageSection.vue
@@ -11,9 +11,9 @@
   props: {
     sectionTitle: {
       type: String,
-      default: ''
-    }
-  }
+      default: '',
+    },
+  },
 };
 </script>
 
diff --git a/src/components/Global/PageTitle.vue b/src/components/Global/PageTitle.vue
index e3dc8d0..45c75ed 100644
--- a/src/components/Global/PageTitle.vue
+++ b/src/components/Global/PageTitle.vue
@@ -11,14 +11,14 @@
   props: {
     description: {
       type: String,
-      default: ''
-    }
+      default: '',
+    },
   },
   data() {
     return {
-      title: this.$route.meta.title
+      title: this.$route.meta.title,
     };
-  }
+  },
 };
 </script>
 
diff --git a/src/components/Global/Search.vue b/src/components/Global/Search.vue
index eeb909a..778965e 100644
--- a/src/components/Global/Search.vue
+++ b/src/components/Global/Search.vue
@@ -43,14 +43,14 @@
   props: {
     placeholder: {
       type: String,
-      default: function() {
+      default: function () {
         return this.$t('global.form.search');
-      }
-    }
+      },
+    },
   },
   data() {
     return {
-      filter: null
+      filter: null,
     };
   },
   methods: {
@@ -61,8 +61,8 @@
       this.filter = '';
       this.$emit('clearSearch');
       this.$refs.searchInput.focus();
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/components/Global/StatusIcon.vue b/src/components/Global/StatusIcon.vue
index 4b2b47d..4552633 100644
--- a/src/components/Global/StatusIcon.vue
+++ b/src/components/Global/StatusIcon.vue
@@ -22,14 +22,14 @@
     iconSuccess: IconCheckmark,
     iconDanger: IconMisuse,
     iconSecondary: IconError,
-    iconWarning: IconWarning
+    iconWarning: IconWarning,
   },
   props: {
     status: {
       type: String,
-      default: ''
-    }
-  }
+      default: '',
+    },
+  },
 };
 </script>
 
diff --git a/src/components/Global/TableCellCount.vue b/src/components/Global/TableCellCount.vue
index 4f44ec2..7561709 100644
--- a/src/components/Global/TableCellCount.vue
+++ b/src/components/Global/TableCellCount.vue
@@ -7,7 +7,7 @@
       {{
         $t('global.table.selectedItems', {
           count: totalNumberOfCells,
-          filterCount: filteredItemsCount
+          filterCount: filteredItemsCount,
         })
       }}
     </p>
@@ -19,17 +19,17 @@
   props: {
     filteredItemsCount: {
       type: Number,
-      required: true
+      required: true,
     },
     totalNumberOfCells: {
       type: Number,
-      required: true
-    }
+      required: true,
+    },
   },
   computed: {
     filterActive() {
       return this.filteredItemsCount !== this.totalNumberOfCells;
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/components/Global/TableDateFilter.vue b/src/components/Global/TableDateFilter.vue
index c0008de..73b2b83 100644
--- a/src/components/Global/TableDateFilter.vue
+++ b/src/components/Global/TableDateFilter.vue
@@ -23,7 +23,7 @@
               {{ $t('global.form.dateMustBeBefore', { date: toDate }) }}
             </template>
           </b-form-invalid-feedback>
-          <template slot:append>
+          <template #append>
             <b-form-datepicker
               v-model="fromDate"
               class="input-action"
@@ -38,7 +38,7 @@
               button-variant="link"
               aria-controls="input-from-date"
             >
-              <template v-slot:button-content>
+              <template #button-content>
                 <icon-calendar
                   :title="$t('global.calendar.openDatePicker')"
                   aria-hidden="true"
@@ -73,7 +73,7 @@
               {{ $t('global.form.dateMustBeAfter', { date: fromDate }) }}
             </template>
           </b-form-invalid-feedback>
-          <template slot:append>
+          <template #append>
             <b-form-datepicker
               v-model="toDate"
               class="input-action"
@@ -88,7 +88,7 @@
               button-variant="link"
               aria-controls="input-to-date"
             >
-              <template v-slot:button-content>
+              <template #button-content>
                 <icon-calendar
                   :title="$t('global.calendar.openDatePicker')"
                   aria-hidden="true"
@@ -121,31 +121,31 @@
       fromDate: '',
       toDate: '',
       offsetToDate: '',
-      locale: this.$store.getters['global/languagePreference']
+      locale: this.$store.getters['global/languagePreference'],
     };
   },
   validations() {
     return {
       fromDate: {
         pattern: helpers.regex('pattern', isoDateRegex),
-        maxDate: value => {
+        maxDate: (value) => {
           if (!this.toDate) return true;
           const date = new Date(value);
           const maxDate = new Date(this.toDate);
           if (date.getTime() > maxDate.getTime()) return false;
           return true;
-        }
+        },
       },
       toDate: {
         pattern: helpers.regex('pattern', isoDateRegex),
-        minDate: value => {
+        minDate: (value) => {
           if (!this.fromDate) return true;
           const date = new Date(value);
           const minDate = new Date(this.fromDate);
           if (date.getTime() < minDate.getTime()) return false;
           return true;
-        }
-      }
+        },
+      },
     };
   },
   watch: {
@@ -157,7 +157,7 @@
       // entries from selected end date are included in filter
       this.offsetToDate = new Date(newVal).setUTCHours(23, 59, 59, 999);
       this.emitChange();
-    }
+    },
   },
   methods: {
     emitChange() {
@@ -165,9 +165,9 @@
       this.$v.$reset(); //reset to re-validate on blur
       this.$emit('change', {
         fromDate: this.fromDate ? new Date(this.fromDate) : null,
-        toDate: this.toDate ? new Date(this.offsetToDate) : null
+        toDate: this.toDate ? new Date(this.offsetToDate) : null,
       });
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/components/Global/TableFilter.vue b/src/components/Global/TableFilter.vue
index d6a954b..c9fb106 100644
--- a/src/components/Global/TableFilter.vue
+++ b/src/components/Global/TableFilter.vue
@@ -18,7 +18,7 @@
       @hide="dropdownVisible = false"
       @show="dropdownVisible = true"
     >
-      <template v-slot:button-content>
+      <template #button-content>
         <icon-filter />
         {{ $t('global.action.filter') }}
       </template>
@@ -62,12 +62,12 @@
     filters: {
       type: Array,
       default: () => [],
-      validator: prop => {
+      validator: (prop) => {
         return prop.every(
-          filter => 'label' in filter && 'values' in filter && 'key' in filter
+          (filter) => 'label' in filter && 'values' in filter && 'key' in filter
         );
-      }
-    }
+      },
+    },
   },
   data() {
     return {
@@ -75,9 +75,9 @@
       activeFilters: this.filters.map(({ key }) => {
         return {
           key,
-          values: []
+          values: [],
         };
-      })
+      }),
     };
   },
   computed: {
@@ -89,44 +89,38 @@
       },
       set(value) {
         return value;
-      }
-    }
+      },
+    },
   },
   methods: {
     removeTag(tag) {
-      this.activeFilters.forEach(filter => {
-        filter.values = filter.values.filter(val => val !== tag);
+      this.activeFilters.forEach((filter) => {
+        filter.values = filter.values.filter((val) => val !== tag);
       });
       this.emitChange();
     },
     clearAllTags() {
-      this.activeFilters.forEach(filter => {
+      this.activeFilters.forEach((filter) => {
         filter.values = [];
       });
       this.emitChange();
     },
     emitChange() {
       this.$emit('filterChange', {
-        activeFilters: this.activeFilters
+        activeFilters: this.activeFilters,
       });
     },
-    onChange(
-      checked,
-      {
-        filter: { key },
-        value
-      }
-    ) {
-      this.activeFilters.forEach(filter => {
+    onChange(checked, { filter: { key }, value }) {
+      this.activeFilters.forEach((filter) => {
         if (filter.key === key) {
           checked
             ? filter.values.push(value)
-            : (filter.values = filter.values.filter(val => val !== value));
+            : (filter.values = filter.values.filter((val) => val !== value));
         }
       });
       this.emitChange();
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/components/Global/TableRowAction.vue b/src/components/Global/TableRowAction.vue
index f86bce2..7e4af49 100644
--- a/src/components/Global/TableRowAction.vue
+++ b/src/components/Global/TableRowAction.vue
@@ -36,24 +36,24 @@
   props: {
     value: {
       type: String,
-      required: true
+      required: true,
     },
     enabled: {
       type: Boolean,
-      default: true
+      default: true,
     },
     title: {
       type: String,
-      default: null
+      default: null,
     },
     rowData: {
       type: Object,
-      default: () => {}
+      default: () => {},
     },
     exportName: {
       type: String,
-      default: 'export'
-    }
+      default: 'export',
+    },
   },
   computed: {
     dataForExport() {
@@ -64,7 +64,7 @@
     },
     href() {
       return `data:text/json;charset=utf-8,${this.dataForExport}`;
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/components/Global/TableToolbar.vue b/src/components/Global/TableToolbar.vue
index 97d8f64..6a856b4 100644
--- a/src/components/Global/TableToolbar.vue
+++ b/src/components/Global/TableToolbar.vue
@@ -36,34 +36,34 @@
   props: {
     selectedItemsCount: {
       type: Number,
-      required: true
+      required: true,
     },
     actions: {
       type: Array,
       default: () => [],
-      validator: prop => {
-        return prop.every(action => {
+      validator: (prop) => {
+        return prop.every((action) => {
           return (
             action.hasOwnProperty('value') && action.hasOwnProperty('label')
           );
         });
-      }
-    }
+      },
+    },
   },
   data() {
     return {
-      isToolbarActive: false
+      isToolbarActive: false,
     };
   },
   watch: {
-    selectedItemsCount: function(selectedItemsCount) {
+    selectedItemsCount: function (selectedItemsCount) {
       if (selectedItemsCount > 0) {
         this.isToolbarActive = true;
       } else {
         this.isToolbarActive = false;
       }
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/components/Global/TableToolbarExport.vue b/src/components/Global/TableToolbarExport.vue
index 59642f5..69646ea 100644
--- a/src/components/Global/TableToolbarExport.vue
+++ b/src/components/Global/TableToolbarExport.vue
@@ -14,12 +14,12 @@
   props: {
     data: {
       type: Array,
-      default: () => []
+      default: () => [],
     },
     fileName: {
       type: String,
-      default: 'data'
-    }
+      default: 'data',
+    },
   },
   computed: {
     dataForExport() {
@@ -30,7 +30,7 @@
     },
     href() {
       return `data:text/json;charset=utf-8,${this.dataForExport}`;
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/components/Mixins/BVPaginationMixin.js b/src/components/Mixins/BVPaginationMixin.js
index 84c46aa..8b52f8b 100644
--- a/src/components/Mixins/BVPaginationMixin.js
+++ b/src/components/Mixins/BVPaginationMixin.js
@@ -6,32 +6,32 @@
       itemsPerPageOptions: [
         {
           value: 10,
-          text: '10'
+          text: '10',
         },
         {
           value: 20,
-          text: '20'
+          text: '20',
         },
         {
           value: 30,
-          text: '30'
+          text: '30',
         },
         {
           value: 40,
-          text: '40'
+          text: '40',
         },
         {
           value: 0,
-          text: this.$t('global.table.viewAll')
-        }
-      ]
+          text: this.$t('global.table.viewAll'),
+        },
+      ],
     };
   },
   methods: {
     getTotalRowCount(count) {
       return this.perPage === 0 ? 0 : count;
-    }
-  }
+    },
+  },
 };
 
 export default BVPaginationMixin;
diff --git a/src/components/Mixins/BVTableSelectableMixin.js b/src/components/Mixins/BVTableSelectableMixin.js
index fba2f2b..cee7d0c 100644
--- a/src/components/Mixins/BVTableSelectableMixin.js
+++ b/src/components/Mixins/BVTableSelectableMixin.js
@@ -3,7 +3,7 @@
     return {
       tableHeaderCheckboxModel: false,
       tableHeaderCheckboxIndeterminate: false,
-      selectedRows: []
+      selectedRows: [],
     };
   },
   methods: {
@@ -37,8 +37,8 @@
         if (this.tableHeaderCheckboxModel) tableRef.clearSelected();
         else tableRef.selectAllRows();
       }
-    }
-  }
+    },
+  },
 };
 
 export default BVTableSelectableMixin;
diff --git a/src/components/Mixins/BVToastMixin.js b/src/components/Mixins/BVToastMixin.js
index 95ac531..5e8ec00 100644
--- a/src/components/Mixins/BVToastMixin.js
+++ b/src/components/Mixins/BVToastMixin.js
@@ -2,7 +2,7 @@
 import StatusIcon from '../Global/StatusIcon';
 const BVToastMixin = {
   components: {
-    StatusIcon
+    StatusIcon,
   },
   methods: {
     toastTitle(title, status) {
@@ -12,7 +12,7 @@
         { class: 'toast-icon' },
         [
           this.$createElement('StatusIcon', { props: { status: status } }),
-          title
+          title,
         ]
       );
       return titleWithIcon;
@@ -23,7 +23,7 @@
         variant: 'success',
         autoHideDelay: 10000, //auto hide in milliseconds
         isStatus: true,
-        solid: true
+        solid: true,
       });
     },
     errorToast(message, title = i18n.t('global.status.error')) {
@@ -32,7 +32,7 @@
         variant: 'danger',
         noAutoHide: true,
         isStatus: true,
-        solid: true
+        solid: true,
       });
     },
     warningToast(message, title = i18n.t('global.status.warning')) {
@@ -41,7 +41,7 @@
         variant: 'warning',
         noAutoHide: true,
         isStatus: true,
-        solid: true
+        solid: true,
       });
     },
     infoToast(message, title = i18n.t('global.status.informational')) {
@@ -50,10 +50,10 @@
         variant: 'info',
         noAutoHide: true,
         isStatus: true,
-        solid: true
+        solid: true,
       });
-    }
-  }
+    },
+  },
 };
 
 export default BVToastMixin;
diff --git a/src/components/Mixins/LoadingBarMixin.js b/src/components/Mixins/LoadingBarMixin.js
index fffb1ca..9b6b195 100644
--- a/src/components/Mixins/LoadingBarMixin.js
+++ b/src/components/Mixins/LoadingBarMixin.js
@@ -1,7 +1,7 @@
 const LoadingBarMixin = {
   data() {
     return {
-      loading: true
+      loading: true,
     };
   },
   methods: {
@@ -15,8 +15,8 @@
     },
     hideLoader() {
       this.$root.$emit('loader::hide');
-    }
-  }
+    },
+  },
 };
 
 export default LoadingBarMixin;
diff --git a/src/components/Mixins/LocalTimezoneLabelMixin.js b/src/components/Mixins/LocalTimezoneLabelMixin.js
index 0f96a45..6b4141c 100644
--- a/src/components/Mixins/LocalTimezoneLabelMixin.js
+++ b/src/components/Mixins/LocalTimezoneLabelMixin.js
@@ -7,8 +7,8 @@
       const shortTz = this.$options.filters.shortTimeZone(new Date());
       const pattern = `'${shortTz}' O`;
       return format(new Date(), pattern, { timezone }).replace('GMT', 'UTC');
-    }
-  }
+    },
+  },
 };
 
 export default LocalTimezoneLabelMixin;
diff --git a/src/components/Mixins/SearchFilterMixin.js b/src/components/Mixins/SearchFilterMixin.js
index 856975d..41f93b1 100644
--- a/src/components/Mixins/SearchFilterMixin.js
+++ b/src/components/Mixins/SearchFilterMixin.js
@@ -1,7 +1,7 @@
 const SearchFilterMixin = {
   data() {
     return {
-      searchFilter: null
+      searchFilter: null,
     };
   },
   methods: {
@@ -10,8 +10,8 @@
     },
     onClearSearchInput() {
       this.searchFilter = null;
-    }
-  }
+    },
+  },
 };
 
 export default SearchFilterMixin;
diff --git a/src/components/Mixins/TableDataFormatterMixin.js b/src/components/Mixins/TableDataFormatterMixin.js
index 3e15926..026f874 100644
--- a/src/components/Mixins/TableDataFormatterMixin.js
+++ b/src/components/Mixins/TableDataFormatterMixin.js
@@ -23,8 +23,8 @@
     },
     tableFormatterArray(value) {
       return value.join(', ');
-    }
-  }
+    },
+  },
 };
 
 export default TableDataFormatterMixin;
diff --git a/src/components/Mixins/TableFilterMixin.js b/src/components/Mixins/TableFilterMixin.js
index 1a5425f..7a2cc54 100644
--- a/src/components/Mixins/TableFilterMixin.js
+++ b/src/components/Mixins/TableFilterMixin.js
@@ -11,7 +11,7 @@
 
       // Check if row property value is included in list of
       // active filters
-      return tableData.filter(row => {
+      return tableData.filter((row) => {
         let returnRow = false;
         for (const { key, values } of filters) {
           const rowProperty = row[key];
@@ -45,14 +45,14 @@
           : Number.POSITIVE_INFINITY;
       }
 
-      return tableData.filter(row => {
+      return tableData.filter((row) => {
         const date = row[propertyKey];
         if (!(date instanceof Date)) return;
         const dateInMs = date.getTime();
         if (dateInMs >= startDateInMs && dateInMs <= endDateInMs) return row;
       });
-    }
-  }
+    },
+  },
 };
 
 export default TableFilterMixin;
diff --git a/src/components/Mixins/TableRowExpandMixin.js b/src/components/Mixins/TableRowExpandMixin.js
index fad63c6..d5246cd 100644
--- a/src/components/Mixins/TableRowExpandMixin.js
+++ b/src/components/Mixins/TableRowExpandMixin.js
@@ -1,7 +1,7 @@
 const TableRowExpandMixin = {
   data() {
     return {
-      expandRowLabel: this.$t('global.table.expandTableRow')
+      expandRowLabel: this.$t('global.table.expandTableRow'),
     };
   },
   methods: {
@@ -10,8 +10,8 @@
       row.detailsShowing
         ? (this.expandRowLabel = this.$t('global.table.expandTableRow'))
         : (this.expandRowLabel = this.$t('global.table.collapseTableRow'));
-    }
-  }
+    },
+  },
 };
 
 export default TableRowExpandMixin;
diff --git a/src/components/Mixins/TableSortMixin.js b/src/components/Mixins/TableSortMixin.js
index 7e98850..c099735 100644
--- a/src/components/Mixins/TableSortMixin.js
+++ b/src/components/Mixins/TableSortMixin.js
@@ -4,8 +4,8 @@
   methods: {
     sortStatus(a, b, key) {
       return STATUS.indexOf(a[key]) - STATUS.indexOf(b[key]);
-    }
-  }
+    },
+  },
 };
 
 export default TableSortMixin;
diff --git a/src/components/Mixins/VuelidateMixin.js b/src/components/Mixins/VuelidateMixin.js
index 8c61779..fec8525 100644
--- a/src/components/Mixins/VuelidateMixin.js
+++ b/src/components/Mixins/VuelidateMixin.js
@@ -3,8 +3,8 @@
     getValidationState(model) {
       const { $dirty, $error } = model;
       return $dirty ? !$error : null;
-    }
-  }
+    },
+  },
 };
 
 export default VuelidateMixin;
diff --git a/src/env/components/AppNavigation/ibm.js b/src/env/components/AppNavigation/ibm.js
index 1f25230..a9870d3 100644
--- a/src/env/components/AppNavigation/ibm.js
+++ b/src/env/components/AppNavigation/ibm.js
@@ -12,7 +12,7 @@
     iconControl: IconSettingsAdjust,
     iconConfiguration: IconSettings,
     iconAccessControl: IconPassword,
-    iconExpand: IconChevronUp
+    iconExpand: IconChevronUp,
   },
   data() {
     return {
@@ -21,7 +21,7 @@
           id: 'overview',
           label: this.$t('appNavigation.overview'),
           route: '/',
-          icon: 'iconOverview'
+          icon: 'iconOverview',
         },
         {
           id: 'health',
@@ -31,19 +31,19 @@
             {
               id: 'event-logs',
               label: this.$t('appNavigation.eventLogs'),
-              route: '/health/event-logs'
+              route: '/health/event-logs',
             },
             {
               id: 'hardware-status',
               label: this.$t('appNavigation.hardwareStatus'),
-              route: '/health/hardware-status'
+              route: '/health/hardware-status',
             },
             {
               id: 'sensors',
               label: this.$t('appNavigation.sensors'),
-              route: '/health/sensors'
-            }
-          ]
+              route: '/health/sensors',
+            },
+          ],
         },
         {
           id: 'control',
@@ -53,29 +53,29 @@
             {
               id: 'manage-power-usage',
               label: this.$t('appNavigation.managePowerUsage'),
-              route: '/control/manage-power-usage'
+              route: '/control/manage-power-usage',
             },
             {
               id: 'reboot-bmc',
               label: this.$t('appNavigation.rebootBmc'),
-              route: '/control/reboot-bmc'
+              route: '/control/reboot-bmc',
             },
             {
               id: 'serial-over-lan',
               label: this.$t('appNavigation.serialOverLan'),
-              route: '/control/serial-over-lan'
+              route: '/control/serial-over-lan',
             },
             {
               id: 'server-led',
               label: this.$t('appNavigation.serverLed'),
-              route: '/control/server-led'
+              route: '/control/server-led',
             },
             {
               id: 'server-power-operations',
               label: this.$t('appNavigation.serverPowerOperations'),
-              route: '/control/server-power-operations'
-            }
-          ]
+              route: '/control/server-power-operations',
+            },
+          ],
         },
         {
           id: 'configuration',
@@ -85,24 +85,24 @@
             {
               id: 'date-time-settings',
               label: this.$t('appNavigation.dateTimeSettings'),
-              route: '/configuration/date-time-settings'
+              route: '/configuration/date-time-settings',
             },
             {
               id: 'firmware',
               label: this.$t('appNavigation.firmware'),
-              route: '/configuration/firmware'
+              route: '/configuration/firmware',
             },
             {
               id: 'network-settings',
               label: this.$t('appNavigation.networkSettings'),
-              route: '/configuration/network-settings'
+              route: '/configuration/network-settings',
             },
             {
               id: 'snmp-settings',
               label: this.$t('appNavigation.snmpSettings'),
-              route: ''
-            }
-          ]
+              route: '',
+            },
+          ],
         },
         {
           id: 'access-control',
@@ -112,23 +112,23 @@
             {
               id: 'ldap',
               label: this.$t('appNavigation.ldap'),
-              route: '/access-control/ldap'
+              route: '/access-control/ldap',
             },
             {
               id: 'local-user-management',
               label: this.$t('appNavigation.localUserManagement'),
-              route: '/access-control/local-user-management'
+              route: '/access-control/local-user-management',
             },
             {
               id: 'ssl-certificates',
               label: this.$t('appNavigation.sslCertificates'),
-              route: '/access-control/ssl-certificates'
-            }
-          ]
-        }
-      ]
+              route: '/access-control/ssl-certificates',
+            },
+          ],
+        },
+      ],
     };
-  }
+  },
 };
 
 export default AppNavigationMixin;
diff --git a/src/env/components/FirmwareSingleImage/FirmwareSingleImage.vue b/src/env/components/FirmwareSingleImage/FirmwareSingleImage.vue
index 3ad717e..03f5af4 100644
--- a/src/env/components/FirmwareSingleImage/FirmwareSingleImage.vue
+++ b/src/env/components/FirmwareSingleImage/FirmwareSingleImage.vue
@@ -13,7 +13,7 @@
         {{ $t('pageFirmware.alert.serverShutdownRequiredBeforeUpdate') }}
       </p>
       {{ $t('pageFirmware.alert.serverShutdownRequiredInfo') }}
-      <template v-slot:action>
+      <template #action>
         <b-btn variant="link" class="text-nowrap" @click="onClickShutDown">
           {{ $t('pageFirmware.alert.shutDownServer') }}
         </b-btn>
@@ -26,7 +26,7 @@
           <b-card-group deck>
             <!-- Current FW -->
             <b-card header-bg-variant="success">
-              <template v-slot:header>
+              <template #header>
                 <dl class="mb-0">
                   <dt>{{ $t('pageFirmware.current') }}</dt>
                   <dd class="mb-0">{{ systemFirmwareVersion }}</dd>
@@ -58,7 +58,7 @@
 
             <!-- Backup FW -->
             <b-card>
-              <template v-slot:header>
+              <template #header>
                 <dl class="mb-0">
                   <dt>{{ $t('pageFirmware.backup') }}</dt>
                   <dd class="mb-0">{{ backupFirmwareVersion }}</dd>
@@ -226,7 +226,7 @@
     ModalRebootBackup,
     ModalUpload,
     PageSection,
-    PageTitle
+    PageTitle,
   },
   mixins: [BVToastMixin, LoadingBarMixin, VuelidateMixin],
   data() {
@@ -235,7 +235,7 @@
       file: null,
       tftpIpAddress: null,
       tftpFileName: null,
-      timeoutId: null
+      timeoutId: null,
     };
   },
   computed: {
@@ -252,26 +252,26 @@
       'backupFirmwareStatus',
       'backupFirmwareVersion',
       'isRebootFromBackupAvailable',
-      'systemFirmwareVersion'
+      'systemFirmwareVersion',
     ]),
     isPageDisabled() {
       return !this.isHostOff || this.loading || this.isOperationInProgress;
-    }
+    },
   },
   watch: {
-    isWorkstationSelected: function() {
+    isWorkstationSelected: function () {
       this.$v.$reset();
       this.file = null;
       this.tftpIpAddress = null;
       this.tftpFileName = null;
-    }
+    },
   },
   created() {
     this.startLoader();
     this.$store.dispatch('firmwareSingleImage/getUpdateServiceApplyTime');
     Promise.all([
       this.$store.dispatch('global/getHostStatus'),
-      this.$store.dispatch('firmwareSingleImage/getFirmwareInformation')
+      this.$store.dispatch('firmwareSingleImage/getFirmwareInformation'),
     ]).finally(() => this.endLoader());
   },
   beforeRouteLeave(to, from, next) {
@@ -282,20 +282,20 @@
   validations() {
     return {
       file: {
-        required: requiredIf(function() {
+        required: requiredIf(function () {
           return this.isWorkstationSelected;
-        })
+        }),
       },
       tftpIpAddress: {
-        required: requiredIf(function() {
+        required: requiredIf(function () {
           return !this.isWorkstationSelected;
-        })
+        }),
       },
       tftpFileName: {
-        required: requiredIf(function() {
+        required: requiredIf(function () {
           return !this.isWorkstationSelected;
-        })
-      }
+        }),
+      },
     };
   },
   methods: {
@@ -315,7 +315,7 @@
     dispatchWorkstationUpload() {
       this.$store
         .dispatch('firmwareSingleImage/uploadFirmware', this.file)
-        .then(success =>
+        .then((success) =>
           this.infoToast(
             success,
             this.$t('pageFirmware.toast.successUploadTitle')
@@ -329,11 +329,11 @@
     dispatchTftpUpload() {
       const data = {
         address: this.tftpIpAddress,
-        filename: this.tftpFileName
+        filename: this.tftpFileName,
       };
       this.$store
         .dispatch('firmwareSingleImage/uploadFirmwareTFTP', data)
-        .then(success =>
+        .then((success) =>
           this.infoToast(
             success,
             this.$t('pageFirmware.toast.successUploadTitle')
@@ -348,7 +348,7 @@
       this.setRebootTimeout();
       this.$store
         .dispatch('firmwareSingleImage/switchFirmwareAndReboot')
-        .then(success =>
+        .then((success) =>
           this.infoToast(success, this.$t('global.status.success'))
         )
         .catch(({ message }) => {
@@ -384,14 +384,14 @@
         .msgBoxConfirm(this.$t('pageFirmware.modal.serverShutdownMessage'), {
           title: this.$t('pageFirmware.modal.serverShutdownWillCauseOutage'),
           okTitle: this.$t('pageFirmware.modal.shutDownServer'),
-          okVariant: 'danger'
+          okVariant: 'danger',
         })
-        .then(shutdownConfirmed => {
+        .then((shutdownConfirmed) => {
           if (shutdownConfirmed)
             this.$store.dispatch('controls/hostSoftPowerOff');
         });
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/env/components/FirmwareSingleImage/FirmwareSingleImageModalRebootBackup.vue b/src/env/components/FirmwareSingleImage/FirmwareSingleImageModalRebootBackup.vue
index a8fb3ad..5b700f2 100644
--- a/src/env/components/FirmwareSingleImage/FirmwareSingleImageModalRebootBackup.vue
+++ b/src/env/components/FirmwareSingleImage/FirmwareSingleImageModalRebootBackup.vue
@@ -22,12 +22,12 @@
   props: {
     current: {
       type: String,
-      required: true
+      required: true,
     },
     backup: {
       type: String,
-      required: true
-    }
-  }
+      required: true,
+    },
+  },
 };
 </script>
diff --git a/src/env/router/ibm.js b/src/env/router/ibm.js
index 5b69475..a647372 100644
--- a/src/env/router/ibm.js
+++ b/src/env/router/ibm.js
@@ -35,8 +35,8 @@
         name: 'login',
         component: Login,
         meta: {
-          title: i18n.t('appPageTitle.login')
-        }
+          title: i18n.t('appPageTitle.login'),
+        },
       },
       {
         path: '/change-password',
@@ -44,16 +44,16 @@
         component: ChangePassword,
         meta: {
           title: i18n.t('appPageTitle.changePassword'),
-          requiresAuth: true
-        }
-      }
-    ]
+          requiresAuth: true,
+        },
+      },
+    ],
   },
   {
     path: '/console',
     component: ConsoleLayout,
     meta: {
-      requiresAuth: true
+      requiresAuth: true,
     },
     children: [
       {
@@ -61,15 +61,15 @@
         name: 'serial-over-lan-console',
         component: SerialOverLanConsole,
         meta: {
-          title: i18n.t('appPageTitle.serialOverLan')
-        }
-      }
-    ]
+          title: i18n.t('appPageTitle.serialOverLan'),
+        },
+      },
+    ],
   },
   {
     path: '/',
     meta: {
-      requiresAuth: true
+      requiresAuth: true,
     },
     component: AppLayout,
     children: [
@@ -78,139 +78,139 @@
         name: 'overview',
         component: Overview,
         meta: {
-          title: i18n.t('appPageTitle.overview')
-        }
+          title: i18n.t('appPageTitle.overview'),
+        },
       },
       {
         path: '/profile-settings',
         name: 'profile-settings',
         component: ProfileSettings,
         meta: {
-          title: i18n.t('appPageTitle.profileSettings')
-        }
+          title: i18n.t('appPageTitle.profileSettings'),
+        },
       },
       {
         path: '/health/event-logs',
         name: 'event-logs',
         component: EventLogs,
         meta: {
-          title: i18n.t('appPageTitle.eventLogs')
-        }
+          title: i18n.t('appPageTitle.eventLogs'),
+        },
       },
       {
         path: '/health/hardware-status',
         name: 'hardware-status',
         component: HardwareStatus,
         meta: {
-          title: i18n.t('appPageTitle.hardwareStatus')
-        }
+          title: i18n.t('appPageTitle.hardwareStatus'),
+        },
       },
       {
         path: '/health/sensors',
         name: 'sensors',
         component: Sensors,
         meta: {
-          title: i18n.t('appPageTitle.sensors')
-        }
+          title: i18n.t('appPageTitle.sensors'),
+        },
       },
       {
         path: '/access-control/ldap',
         name: 'ldap',
         component: Ldap,
         meta: {
-          title: i18n.t('appPageTitle.ldap')
-        }
+          title: i18n.t('appPageTitle.ldap'),
+        },
       },
       {
         path: '/access-control/local-user-management',
         name: 'local-users',
         component: LocalUserManagement,
         meta: {
-          title: i18n.t('appPageTitle.localUserManagement')
-        }
+          title: i18n.t('appPageTitle.localUserManagement'),
+        },
       },
       {
         path: '/access-control/ssl-certificates',
         name: 'ssl-certificates',
         component: SslCertificates,
         meta: {
-          title: i18n.t('appPageTitle.sslCertificates')
-        }
+          title: i18n.t('appPageTitle.sslCertificates'),
+        },
       },
       {
         path: '/configuration/date-time-settings',
         name: 'date-time-settings',
         component: DateTimeSettings,
         meta: {
-          title: i18n.t('appPageTitle.dateTimeSettings')
-        }
+          title: i18n.t('appPageTitle.dateTimeSettings'),
+        },
       },
       {
         path: '/configuration/firmware',
         name: 'firmware',
         component: FirmwareSingleImage,
         meta: {
-          title: i18n.t('appPageTitle.firmware')
-        }
+          title: i18n.t('appPageTitle.firmware'),
+        },
       },
       {
         path: '/control/manage-power-usage',
         name: 'manage-power-usage',
         component: ManagePowerUsage,
         meta: {
-          title: i18n.t('appPageTitle.managePowerUsage')
-        }
+          title: i18n.t('appPageTitle.managePowerUsage'),
+        },
       },
       {
         path: '/configuration/network-settings',
         name: 'network-settings',
         component: NetworkSettings,
         meta: {
-          title: i18n.t('appPageTitle.networkSettings')
-        }
+          title: i18n.t('appPageTitle.networkSettings'),
+        },
       },
       {
         path: '/control/reboot-bmc',
         name: 'reboot-bmc',
         component: RebootBmc,
         meta: {
-          title: i18n.t('appPageTitle.rebootBmc')
-        }
+          title: i18n.t('appPageTitle.rebootBmc'),
+        },
       },
       {
         path: '/control/server-led',
         name: 'server-led',
         component: ServerLed,
         meta: {
-          title: i18n.t('appPageTitle.serverLed')
-        }
+          title: i18n.t('appPageTitle.serverLed'),
+        },
       },
       {
         path: '/control/serial-over-lan',
         name: 'serial-over-lan',
         component: SerialOverLan,
         meta: {
-          title: i18n.t('appPageTitle.serialOverLan')
-        }
+          title: i18n.t('appPageTitle.serialOverLan'),
+        },
       },
       {
         path: '/control/server-power-operations',
         name: 'server-power-operations',
         component: ServerPowerOperations,
         meta: {
-          title: i18n.t('appPageTitle.serverPowerOperations')
-        }
+          title: i18n.t('appPageTitle.serverPowerOperations'),
+        },
       },
       {
         path: '*',
         name: 'page-not-found',
         component: PageNotFound,
         meta: {
-          title: i18n.t('appPageTitle.pageNotFound')
-        }
-      }
-    ]
-  }
+          title: i18n.t('appPageTitle.pageNotFound'),
+        },
+      },
+    ],
+  },
 ];
 
 export default routes;
diff --git a/src/env/store/FirmwareSingleImage/FirmwareSingleImageStore.js b/src/env/store/FirmwareSingleImage/FirmwareSingleImageStore.js
index 98f86fd..ffc4bc4 100644
--- a/src/env/store/FirmwareSingleImage/FirmwareSingleImageStore.js
+++ b/src/env/store/FirmwareSingleImage/FirmwareSingleImageStore.js
@@ -7,23 +7,23 @@
     activeFirmware: {
       version: '--',
       id: null,
-      location: null
+      location: null,
     },
     backupFirmware: {
       version: '--',
       id: null,
       location: null,
-      status: '--'
+      status: '--',
     },
-    applyTime: null
+    applyTime: null,
   },
   getters: {
-    systemFirmwareVersion: state => state.activeFirmware.version,
-    backupFirmwareVersion: state => state.backupFirmware.version,
-    backupFirmwareStatus: state => state.backupFirmware.status,
-    isRebootFromBackupAvailable: state =>
+    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.activeFirmware.version //this getter is needed for the Overview page
+    bmcFirmwareCurrentVersion: (state) => state.activeFirmware.version, //this getter is needed for the Overview page
   },
   mutations: {
     setActiveFirmware: (state, { version, id, location }) => {
@@ -37,7 +37,7 @@
       state.backupFirmware.location = location;
       state.backupFirmware.status = status;
     },
-    setApplyTime: (state, applyTime) => (state.applyTime = applyTime)
+    setApplyTime: (state, applyTime) => (state.applyTime = applyTime),
   },
   actions: {
     async getFirmwareInformation({ commit }) {
@@ -47,8 +47,8 @@
           const currentLocation = Links.ActiveSoftwareImage['@odata.id'];
           // Check SoftwareImages list for not ActiveSoftwareImage id
           const backupLocation = Links.SoftwareImages.map(
-            item => item['@odata.id']
-          ).find(location => {
+            (item) => item['@odata.id']
+          ).find((location) => {
             const id = location.split('/').pop();
             const currentId = currentLocation.split('/').pop();
             return id !== currentId;
@@ -66,16 +66,16 @@
           commit('setActiveFirmware', {
             version: currentData?.data?.Version,
             id: currentData?.data?.Id,
-            location: currentData?.data?.['@odata.id']
+            location: currentData?.data?.['@odata.id'],
           });
           commit('setBackupFirmware', {
             version: backupData.data?.Version,
             id: backupData.data?.Id,
             location: backupData.data?.['@odata.id'],
-            status: backupData.data?.Status?.State
+            status: backupData.data?.Status?.State,
           });
         })
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     getUpdateServiceApplyTime({ commit }) {
       api
@@ -85,20 +85,20 @@
             data.HttpPushUriOptions.HttpPushUriApplyTime.ApplyTime;
           commit('setApplyTime', applyTime);
         })
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     setApplyTimeImmediate({ commit }) {
       const data = {
         HttpPushUriOptions: {
           HttpPushUriApplyTime: {
-            ApplyTime: 'Immediate'
-          }
-        }
+            ApplyTime: 'Immediate',
+          },
+        },
       };
       return api
         .patch('/redfish/v1/UpdateService', data)
         .then(() => commit('setApplyTime', 'Immediate'))
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     async uploadFirmware({ state, dispatch }, image) {
       if (state.applyTime !== 'Immediate') {
@@ -108,11 +108,11 @@
       }
       return await api
         .post('/redfish/v1/UpdateService', image, {
-          headers: { 'Content-Type': 'application/octet-stream' }
+          headers: { 'Content-Type': 'application/octet-stream' },
         })
         .then(() => dispatch('getSystemFirwareVersion'))
         .then(() => i18n.t('pageFirmware.toast.successUploadMessage'))
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(i18n.t('pageFirmware.toast.errorUploadAndReboot'));
         });
@@ -120,7 +120,7 @@
     async uploadFirmwareTFTP({ state, dispatch }, { address, filename }) {
       const data = {
         TransferProtocol: 'TFTP',
-        ImageURI: `${address}/${filename}`
+        ImageURI: `${address}/${filename}`,
       };
       if (state.applyTime !== 'Immediate') {
         // ApplyTime must be set to Immediate before making
@@ -134,7 +134,7 @@
         )
         .then(() => dispatch('getSystemFirwareVersion'))
         .then(() => i18n.t('pageFirmware.toast.successUploadMessage'))
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(i18n.t('pageFirmware.toast.errorUploadAndReboot'));
         });
@@ -144,19 +144,19 @@
       const data = {
         Links: {
           ActiveSoftwareImage: {
-            '@odata.id': backupLoaction
-          }
-        }
+            '@odata.id': backupLoaction,
+          },
+        },
       };
       return await api
         .patch('/redfish/v1/Managers/bmc', data)
         .then(() => i18n.t('pageFirmware.toast.successRebootFromBackup'))
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(i18n.t('pageFirmware.toast.errorRebootFromBackup'));
         });
-    }
-  }
+    },
+  },
 };
 
 export default FirmwareSingleImageStore;
diff --git a/src/i18n.js b/src/i18n.js
index b06f48a..919c363 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -10,7 +10,7 @@
     /[A-Za-z0-9-_,\s]+\.json$/i
   );
   const messages = {};
-  locales.keys().forEach(key => {
+  locales.keys().forEach((key) => {
     const matched = key.match(/([A-Za-z0-9-_]+)\./i);
     if (matched && matched.length > 1) {
       const locale = matched[1];
@@ -28,5 +28,5 @@
   // Falling back to fallbackLocale generates two console warnings
   // Silent fallback suppresses console warnings when using fallback
   silentFallbackWarn: true,
-  messages: loadLocaleMessages()
+  messages: loadLocaleMessages(),
 });
diff --git a/src/layouts/AppLayout.vue b/src/layouts/AppLayout.vue
index e040bef..a4f73da 100644
--- a/src/layouts/AppLayout.vue
+++ b/src/layouts/AppLayout.vue
@@ -17,17 +17,17 @@
   components: {
     AppHeader,
     AppNavigation,
-    PageContainer
+    PageContainer,
   },
   data() {
     return {
-      routerKey: 0
+      routerKey: 0,
     };
   },
   watch: {
-    $route: function() {
+    $route: function () {
       // $nextTick = DOM updated
-      this.$nextTick(function() {
+      this.$nextTick(function () {
         // Get the focusTarget DOM element
         let focusTarget = this.$refs.focusTarget.$el;
 
@@ -41,15 +41,15 @@
         // Reason: https://axesslab.com/skip-links/#update-3-a-comment-from-gov-uk
         focusTarget.removeAttribute('tabindex');
       });
-    }
+    },
   },
   methods: {
     refresh() {
       // Changing the component :key value will trigger
       // a component re-rendering and 'refresh' the view
       this.routerKey += 1;
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/layouts/ConsoleLayout.vue b/src/layouts/ConsoleLayout.vue
index 99f8d9f..9f8175b 100644
--- a/src/layouts/ConsoleLayout.vue
+++ b/src/layouts/ConsoleLayout.vue
@@ -4,6 +4,6 @@
 
 <script>
 export default {
-  name: 'Console'
+  name: 'Console',
 };
 </script>
diff --git a/src/layouts/LoginLayout.vue b/src/layouts/LoginLayout.vue
index ab6fbe2..c2b9af5 100644
--- a/src/layouts/LoginLayout.vue
+++ b/src/layouts/LoginLayout.vue
@@ -26,9 +26,9 @@
   name: 'LoginLayout',
   data() {
     return {
-      altLogo: `${process.env.VUE_APP_COMPANY_NAME} logo`
+      altLogo: `${process.env.VUE_APP_COMPANY_NAME} logo`,
     };
-  }
+  },
 };
 </script>
 
diff --git a/src/main.js b/src/main.js
index 05a7642..8c72580 100644
--- a/src/main.js
+++ b/src/main.js
@@ -35,14 +35,14 @@
   ProgressPlugin,
   TablePlugin,
   ToastPlugin,
-  TooltipPlugin
+  TooltipPlugin,
 } from 'bootstrap-vue';
 import Vuelidate from 'vuelidate';
 import i18n from './i18n';
 import { format } from 'date-fns-tz';
 
 // Filters
-Vue.filter('shortTimeZone', function(value) {
+Vue.filter('shortTimeZone', function (value) {
   const longTZ = value
     .toString()
     .match(/\((.*)\)/)
@@ -51,7 +51,7 @@
   return longTZ.replace(regexNotUpper, '');
 });
 
-Vue.filter('formatDate', function(value) {
+Vue.filter('formatDate', function (value) {
   const isUtcDisplay = store.getters['global/isUtcDisplay'];
 
   if (value instanceof Date) {
@@ -64,14 +64,14 @@
   }
 });
 
-Vue.filter('formatTime', function(value) {
+Vue.filter('formatTime', function (value) {
   const isUtcDisplay = store.getters['global/isUtcDisplay'];
 
   if (value instanceof Date) {
     if (isUtcDisplay) {
       let timeOptions = {
         timeZone: 'UTC',
-        hour12: false
+        hour12: false,
       };
       return `${value.toLocaleTimeString('default', timeOptions)} UTC`;
     }
@@ -90,15 +90,15 @@
   BFormText: { textVariant: 'secondary' },
   BTable: {
     headVariant: 'light',
-    footVariant: 'light'
+    footVariant: 'light',
   },
   BFormTags: {
     tagVariant: 'primary',
-    addButtonVariant: 'link-primary'
+    addButtonVariant: 'link-primary',
   },
   BBadge: {
-    variant: 'primary'
-  }
+    variant: 'primary',
+  },
 });
 Vue.use(CardPlugin);
 Vue.use(CollapsePlugin);
@@ -131,5 +131,5 @@
   router,
   store,
   i18n,
-  render: h => h(App)
+  render: (h) => h(App),
 }).$mount('#app');
diff --git a/src/router/index.js b/src/router/index.js
index 3f447de..3cd5226 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -12,11 +12,11 @@
 const router = new VueRouter({
   base: process.env.BASE_URL,
   routes,
-  linkExactActiveClass: 'nav-link--current'
+  linkExactActiveClass: 'nav-link--current',
 });
 
 router.beforeEach((to, from, next) => {
-  if (to.matched.some(record => record.meta.requiresAuth)) {
+  if (to.matched.some((record) => record.meta.requiresAuth)) {
     if (store.getters['authentication/isLoggedIn']) {
       next();
       return;
diff --git a/src/router/routes.js b/src/router/routes.js
index 968a5ea..3be1a1e 100644
--- a/src/router/routes.js
+++ b/src/router/routes.js
@@ -36,8 +36,8 @@
         name: 'login',
         component: Login,
         meta: {
-          title: i18n.t('appPageTitle.login')
-        }
+          title: i18n.t('appPageTitle.login'),
+        },
       },
       {
         path: '/change-password',
@@ -45,16 +45,16 @@
         component: ChangePassword,
         meta: {
           title: i18n.t('appPageTitle.changePassword'),
-          requiresAuth: true
-        }
-      }
-    ]
+          requiresAuth: true,
+        },
+      },
+    ],
   },
   {
     path: '/console',
     component: ConsoleLayout,
     meta: {
-      requiresAuth: true
+      requiresAuth: true,
     },
     children: [
       {
@@ -62,23 +62,23 @@
         name: 'serial-over-lan-console',
         component: SerialOverLanConsole,
         meta: {
-          title: i18n.t('appPageTitle.serialOverLan')
-        }
+          title: i18n.t('appPageTitle.serialOverLan'),
+        },
       },
       {
         path: 'kvm',
         name: 'kvm-console',
         component: KvmConsole,
         meta: {
-          title: i18n.t('appPageTitle.kvm')
-        }
-      }
-    ]
+          title: i18n.t('appPageTitle.kvm'),
+        },
+      },
+    ],
   },
   {
     path: '/',
     meta: {
-      requiresAuth: true
+      requiresAuth: true,
     },
     component: AppLayout,
     children: [
@@ -87,155 +87,155 @@
         name: 'overview',
         component: Overview,
         meta: {
-          title: i18n.t('appPageTitle.overview')
-        }
+          title: i18n.t('appPageTitle.overview'),
+        },
       },
       {
         path: '/profile-settings',
         name: 'profile-settings',
         component: ProfileSettings,
         meta: {
-          title: i18n.t('appPageTitle.profileSettings')
-        }
+          title: i18n.t('appPageTitle.profileSettings'),
+        },
       },
       {
         path: '/health/event-logs',
         name: 'event-logs',
         component: EventLogs,
         meta: {
-          title: i18n.t('appPageTitle.eventLogs')
-        }
+          title: i18n.t('appPageTitle.eventLogs'),
+        },
       },
       {
         path: '/health/hardware-status',
         name: 'hardware-status',
         component: HardwareStatus,
         meta: {
-          title: i18n.t('appPageTitle.hardwareStatus')
-        }
+          title: i18n.t('appPageTitle.hardwareStatus'),
+        },
       },
       {
         path: '/health/sensors',
         name: 'sensors',
         component: Sensors,
         meta: {
-          title: i18n.t('appPageTitle.sensors')
-        }
+          title: i18n.t('appPageTitle.sensors'),
+        },
       },
       {
         path: '/access-control/ldap',
         name: 'ldap',
         component: Ldap,
         meta: {
-          title: i18n.t('appPageTitle.ldap')
-        }
+          title: i18n.t('appPageTitle.ldap'),
+        },
       },
       {
         path: '/access-control/local-user-management',
         name: 'local-users',
         component: LocalUserManagement,
         meta: {
-          title: i18n.t('appPageTitle.localUserManagement')
-        }
+          title: i18n.t('appPageTitle.localUserManagement'),
+        },
       },
       {
         path: '/access-control/ssl-certificates',
         name: 'ssl-certificates',
         component: SslCertificates,
         meta: {
-          title: i18n.t('appPageTitle.sslCertificates')
-        }
+          title: i18n.t('appPageTitle.sslCertificates'),
+        },
       },
       {
         path: '/configuration/date-time-settings',
         name: 'date-time-settings',
         component: DateTimeSettings,
         meta: {
-          title: i18n.t('appPageTitle.dateTimeSettings')
-        }
+          title: i18n.t('appPageTitle.dateTimeSettings'),
+        },
       },
       {
         path: '/configuration/firmware',
         name: 'firmware',
         component: Firmware,
         meta: {
-          title: i18n.t('appPageTitle.firmware')
-        }
+          title: i18n.t('appPageTitle.firmware'),
+        },
       },
       {
         path: '/control/kvm',
         name: 'kvm',
         component: Kvm,
         meta: {
-          title: i18n.t('appPageTitle.kvm')
-        }
+          title: i18n.t('appPageTitle.kvm'),
+        },
       },
       {
         path: '/control/manage-power-usage',
         name: 'manage-power-usage',
         component: ManagePowerUsage,
         meta: {
-          title: i18n.t('appPageTitle.managePowerUsage')
-        }
+          title: i18n.t('appPageTitle.managePowerUsage'),
+        },
       },
       {
         path: '/configuration/network-settings',
         name: 'network-settings',
         component: NetworkSettings,
         meta: {
-          title: i18n.t('appPageTitle.networkSettings')
-        }
+          title: i18n.t('appPageTitle.networkSettings'),
+        },
       },
       {
         path: '/control/reboot-bmc',
         name: 'reboot-bmc',
         component: RebootBmc,
         meta: {
-          title: i18n.t('appPageTitle.rebootBmc')
-        }
+          title: i18n.t('appPageTitle.rebootBmc'),
+        },
       },
       {
         path: '/control/server-led',
         name: 'server-led',
         component: ServerLed,
         meta: {
-          title: i18n.t('appPageTitle.serverLed')
-        }
+          title: i18n.t('appPageTitle.serverLed'),
+        },
       },
       {
         path: '/control/serial-over-lan',
         name: 'serial-over-lan',
         component: SerialOverLan,
         meta: {
-          title: i18n.t('appPageTitle.serialOverLan')
-        }
+          title: i18n.t('appPageTitle.serialOverLan'),
+        },
       },
       {
         path: '/control/server-power-operations',
         name: 'server-power-operations',
         component: ServerPowerOperations,
         meta: {
-          title: i18n.t('appPageTitle.serverPowerOperations')
-        }
+          title: i18n.t('appPageTitle.serverPowerOperations'),
+        },
       },
       {
         path: '/control/virtual-media',
         name: 'virtual-media',
         component: VirtualMedia,
         meta: {
-          title: i18n.t('appPageTitle.virtualMedia')
-        }
+          title: i18n.t('appPageTitle.virtualMedia'),
+        },
       },
       {
         path: '*',
         name: 'page-not-found',
         component: PageNotFound,
         meta: {
-          title: i18n.t('appPageTitle.pageNotFound')
-        }
-      }
-    ]
-  }
+          title: i18n.t('appPageTitle.pageNotFound'),
+        },
+      },
+    ],
+  },
 ];
 
 export default routes;
diff --git a/src/store/api.js b/src/store/api.js
index 77d9432..0247288 100644
--- a/src/store/api.js
+++ b/src/store/api.js
@@ -5,10 +5,10 @@
 import store from '../store';
 
 const api = Axios.create({
-  withCredentials: true
+  withCredentials: true,
 });
 
-api.interceptors.response.use(undefined, error => {
+api.interceptors.response.use(undefined, (error) => {
   let response = error.response;
 
   // TODO: Provide user with a notification and way to keep system active
@@ -51,20 +51,20 @@
   },
   spread(callback) {
     return Axios.spread(callback);
-  }
+  },
 };
 
-export const getResponseCount = responses => {
+export const getResponseCount = (responses) => {
   let successCount = 0;
   let errorCount = 0;
 
-  responses.forEach(response => {
+  responses.forEach((response) => {
     if (response instanceof Error) errorCount++;
     else successCount++;
   });
 
   return {
     successCount,
-    errorCount
+    errorCount,
   };
 };
diff --git a/src/store/index.js b/src/store/index.js
index 3844511..e6153b1 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -54,7 +54,7 @@
     chassis: ChassisStore,
     bmc: BmcStore,
     processors: ProcessorStore,
-    virtualMedia: VirtualMediaStore
+    virtualMedia: VirtualMediaStore,
   },
-  plugins: [WebSocketPlugin]
+  plugins: [WebSocketPlugin],
 });
diff --git a/src/store/modules/AccessControl/LdapStore.js b/src/store/modules/AccessControl/LdapStore.js
index 780de38..722384c 100644
--- a/src/store/modules/AccessControl/LdapStore.js
+++ b/src/store/modules/AccessControl/LdapStore.js
@@ -13,7 +13,7 @@
       baseDn: null,
       userAttribute: null,
       groupsAttribute: null,
-      roleGroups: []
+      roleGroups: [],
     },
     activeDirectory: {
       serviceEnabled: null,
@@ -22,14 +22,14 @@
       baseDn: null,
       userAttribute: null,
       groupsAttribute: null,
-      roleGroups: []
-    }
+      roleGroups: [],
+    },
   },
   getters: {
-    isServiceEnabled: state => state.isServiceEnabled,
-    ldap: state => state.ldap,
-    activeDirectory: state => state.activeDirectory,
-    isActiveDirectoryEnabled: state => {
+    isServiceEnabled: (state) => state.isServiceEnabled,
+    ldap: (state) => state.ldap,
+    activeDirectory: (state) => state.activeDirectory,
+    isActiveDirectoryEnabled: (state) => {
       return state.activeDirectory.serviceEnabled;
     },
     enabledRoleGroups: (state, getters) => {
@@ -37,7 +37,7 @@
         ? 'activeDirectory'
         : 'ldap';
       return state[serviceType].roleGroups;
-    }
+    },
   },
   mutations: {
     setServiceEnabled: (state, serviceEnabled) =>
@@ -49,7 +49,7 @@
         ServiceAddresses,
         Authentication = {},
         LDAPService: { SearchSettings = {} } = {},
-        RemoteRoleMapping = []
+        RemoteRoleMapping = [],
       }
     ) => {
       state.ldap.serviceAddress = ServiceAddresses[0];
@@ -67,7 +67,7 @@
         ServiceAddresses,
         Authentication = {},
         LDAPService: { SearchSettings = {} } = {},
-        RemoteRoleMapping = []
+        RemoteRoleMapping = [],
       }
     ) => {
       state.activeDirectory.serviceEnabled = ServiceEnabled;
@@ -77,7 +77,7 @@
       state.activeDirectory.userAttribute = SearchSettings.UsernameAttribute;
       state.activeDirectory.groupsAttribute = SearchSettings.GroupsAttribute;
       state.activeDirectory.roleGroups = RemoteRoleMapping;
-    }
+    },
   },
   actions: {
     async getAccountSettings({ commit }) {
@@ -91,21 +91,21 @@
           commit('setLdapProperties', LDAP);
           commit('setActiveDirectoryProperties', ActiveDirectory);
         })
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     async saveLdapSettings({ state, dispatch }, properties) {
       const data = { LDAP: properties };
       if (state.activeDirectory.serviceEnabled) {
         // Disable Active Directory service if enabled
         await api.patch('/redfish/v1/AccountService', {
-          ActiveDirectory: { ServiceEnabled: false }
+          ActiveDirectory: { ServiceEnabled: false },
         });
       }
       return await api
         .patch('/redfish/v1/AccountService', data)
         .then(() => dispatch('getAccountSettings'))
         .then(() => i18n.t('pageLdap.toast.successSaveLdapSettings'))
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(i18n.t('pageLdap.toast.errorSaveLdapSettings'));
         });
@@ -115,14 +115,14 @@
       if (state.ldap.serviceEnabled) {
         // Disable LDAP service if enabled
         await api.patch('/redfish/v1/AccountService', {
-          LDAP: { ServiceEnabled: false }
+          LDAP: { ServiceEnabled: false },
         });
       }
       return await api
         .patch('/redfish/v1/AccountService', data)
         .then(() => dispatch('getAccountSettings'))
         .then(() => i18n.t('pageLdap.toast.successSaveActiveDirectorySettings'))
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(
             i18n.t('pageLdap.toast.errorSaveActiveDirectorySettings')
@@ -139,7 +139,7 @@
         bindPassword,
         baseDn,
         userIdAttribute,
-        groupIdAttribute
+        groupIdAttribute,
       }
     ) {
       const data = {
@@ -147,13 +147,13 @@
         ServiceAddresses: [serviceAddress],
         Authentication: {
           Username: bindDn,
-          Password: bindPassword
+          Password: bindPassword,
         },
         LDAPService: {
           SearchSettings: {
-            BaseDistinguishedNames: [baseDn]
-          }
-        }
+            BaseDistinguishedNames: [baseDn],
+          },
+        },
       };
       if (groupIdAttribute)
         data.LDAPService.SearchSettings.GroupsAttribute = groupIdAttribute;
@@ -177,8 +177,8 @@
         ...enabledRoleGroups,
         {
           LocalRole: groupPrivilege,
-          RemoteGroup: groupName
-        }
+          RemoteGroup: groupName,
+        },
       ];
       if (isActiveDirectoryEnabled) {
         data.ActiveDirectory = { RemoteRoleMapping };
@@ -190,10 +190,10 @@
         .then(() => dispatch('getAccountSettings'))
         .then(() =>
           i18n.t('pageLdap.toast.successAddRoleGroup', {
-            groupName
+            groupName,
           })
         )
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(i18n.t('pageLdap.toast.errorAddRoleGroup'));
         });
@@ -202,11 +202,11 @@
       const data = {};
       const enabledRoleGroups = getters['enabledRoleGroups'];
       const isActiveDirectoryEnabled = getters['isActiveDirectoryEnabled'];
-      const RemoteRoleMapping = enabledRoleGroups.map(group => {
+      const RemoteRoleMapping = enabledRoleGroups.map((group) => {
         if (group.RemoteGroup === groupName) {
           return {
             RemoteGroup: groupName,
-            LocalRole: groupPrivilege
+            LocalRole: groupPrivilege,
           };
         } else {
           return {};
@@ -223,7 +223,7 @@
         .then(() =>
           i18n.t('pageLdap.toast.successSaveRoleGroup', { groupName })
         )
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(i18n.t('pageLdap.toast.errorSaveRoleGroup'));
         });
@@ -232,7 +232,7 @@
       const data = {};
       const enabledRoleGroups = getters['enabledRoleGroups'];
       const isActiveDirectoryEnabled = getters['isActiveDirectoryEnabled'];
-      const RemoteRoleMapping = enabledRoleGroups.map(group => {
+      const RemoteRoleMapping = enabledRoleGroups.map((group) => {
         if (find(roleGroups, { groupName: group.RemoteGroup })) {
           return null;
         } else {
@@ -250,14 +250,14 @@
         .then(() =>
           i18n.tc('pageLdap.toast.successDeleteRoleGroup', roleGroups.length)
         )
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(
             i18n.tc('pageLdap.toast.errorDeleteRoleGroup', roleGroups.length)
           );
         });
-    }
-  }
+    },
+  },
 };
 
 export default LdapStore;
diff --git a/src/store/modules/AccessControl/LocalUserMangementStore.js b/src/store/modules/AccessControl/LocalUserMangementStore.js
index e9de3cc..6bc6ec5 100644
--- a/src/store/modules/AccessControl/LocalUserMangementStore.js
+++ b/src/store/modules/AccessControl/LocalUserMangementStore.js
@@ -9,7 +9,7 @@
     accountLockoutDuration: null,
     accountLockoutThreshold: null,
     accountMinPasswordLength: null,
-    accountMaxPasswordLength: null
+    accountMaxPasswordLength: null,
   },
   getters: {
     allUsers(state) {
@@ -21,15 +21,15 @@
     accountSettings(state) {
       return {
         lockoutDuration: state.accountLockoutDuration,
-        lockoutThreshold: state.accountLockoutThreshold
+        lockoutThreshold: state.accountLockoutThreshold,
       };
     },
     accountPasswordRequirements(state) {
       return {
         minLength: state.accountMinPasswordLength,
-        maxLength: state.accountMaxPasswordLength
+        maxLength: state.accountMaxPasswordLength,
       };
-    }
+    },
   },
   mutations: {
     setUsers(state, allUsers) {
@@ -49,19 +49,21 @@
     },
     setAccountMaxPasswordLength(state, maxPasswordLength) {
       state.accountMaxPasswordLength = maxPasswordLength;
-    }
+    },
   },
   actions: {
     async getUsers({ commit }) {
       return await api
         .get('/redfish/v1/AccountService/Accounts')
-        .then(response => response.data.Members.map(user => user['@odata.id']))
-        .then(userIds => api.all(userIds.map(user => api.get(user))))
-        .then(users => {
-          const userData = users.map(user => user.data);
+        .then((response) =>
+          response.data.Members.map((user) => user['@odata.id'])
+        )
+        .then((userIds) => api.all(userIds.map((user) => api.get(user))))
+        .then((users) => {
+          const userData = users.map((user) => user.data);
           commit('setUsers', userData);
         })
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           const message = i18n.t(
             'pageLocalUserManagement.toast.errorLoadUsers'
@@ -78,7 +80,7 @@
           commit('setAccountMinPasswordLength', data.MinPasswordLength);
           commit('setAccountMaxPasswordLength', data.MaxPasswordLength);
         })
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           const message = i18n.t(
             'pageLocalUserManagement.toast.errorLoadAccountSettings'
@@ -90,29 +92,29 @@
       api
         .get('/redfish/v1/AccountService/Roles')
         .then(({ data: { Members = [] } = {} }) => {
-          const roles = Members.map(role => {
+          const roles = Members.map((role) => {
             return role['@odata.id'].split('/').pop();
           });
           commit('setAccountRoles', roles);
         })
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     async createUser({ dispatch }, { username, password, privilege, status }) {
       const data = {
         UserName: username,
         Password: password,
         RoleId: privilege,
-        Enabled: status
+        Enabled: status,
       };
       return await api
         .post('/redfish/v1/AccountService/Accounts', data)
         .then(() => dispatch('getUsers'))
         .then(() =>
           i18n.t('pageLocalUserManagement.toast.successCreateUser', {
-            username
+            username,
           })
         )
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           const message = i18n.t(
             'pageLocalUserManagement.toast.errorCreateUser',
@@ -136,10 +138,10 @@
         .then(() => dispatch('getUsers'))
         .then(() =>
           i18n.t('pageLocalUserManagement.toast.successUpdateUser', {
-            username: originalUsername
+            username: originalUsername,
           })
         )
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           const message = i18n.t(
             'pageLocalUserManagement.toast.errorUpdateUser',
@@ -154,10 +156,10 @@
         .then(() => dispatch('getUsers'))
         .then(() =>
           i18n.t('pageLocalUserManagement.toast.successDeleteUser', {
-            username
+            username,
           })
         )
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           const message = i18n.t(
             'pageLocalUserManagement.toast.errorDeleteUser',
@@ -170,14 +172,14 @@
       const promises = users.map(({ username }) => {
         return api
           .delete(`/redfish/v1/AccountService/Accounts/${username}`)
-          .catch(error => {
+          .catch((error) => {
             console.log(error);
             return error;
           });
       });
       return await api
         .all(promises)
-        .then(response => {
+        .then((response) => {
           dispatch('getUsers');
           return response;
         })
@@ -208,19 +210,19 @@
     },
     async enableUsers({ dispatch }, users) {
       const data = {
-        Enabled: true
+        Enabled: true,
       };
       const promises = users.map(({ username }) => {
         return api
           .patch(`/redfish/v1/AccountService/Accounts/${username}`, data)
-          .catch(error => {
+          .catch((error) => {
             console.log(error);
             return error;
           });
       });
       return await api
         .all(promises)
-        .then(response => {
+        .then((response) => {
           dispatch('getUsers');
           return response;
         })
@@ -251,19 +253,19 @@
     },
     async disableUsers({ dispatch }, users) {
       const data = {
-        Enabled: false
+        Enabled: false,
       };
       const promises = users.map(({ username }) => {
         return api
           .patch(`/redfish/v1/AccountService/Accounts/${username}`, data)
-          .catch(error => {
+          .catch((error) => {
             console.log(error);
             return error;
           });
       });
       return await api
         .all(promises)
-        .then(response => {
+        .then((response) => {
           dispatch('getUsers');
           return response;
         })
@@ -309,15 +311,15 @@
         //GET new settings to update view
         .then(() => dispatch('getAccountSettings'))
         .then(() => i18n.t('pageLocalUserManagement.toast.successSaveSettings'))
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           const message = i18n.t(
             'pageLocalUserManagement.toast.errorSaveSettings'
           );
           throw new Error(message);
         });
-    }
-  }
+    },
+  },
 };
 
 export default LocalUserManagementStore;
diff --git a/src/store/modules/AccessControl/SslCertificatesStore.js b/src/store/modules/AccessControl/SslCertificatesStore.js
index 73a74b2..752c212 100644
--- a/src/store/modules/AccessControl/SslCertificatesStore.js
+++ b/src/store/modules/AccessControl/SslCertificatesStore.js
@@ -5,12 +5,12 @@
   {
     type: 'HTTPS Certificate',
     location: '/redfish/v1/Managers/bmc/NetworkProtocol/HTTPS/Certificates/',
-    label: i18n.t('pageSslCertificates.httpsCertificate')
+    label: i18n.t('pageSslCertificates.httpsCertificate'),
   },
   {
     type: 'LDAP Certificate',
     location: '/redfish/v1/AccountService/LDAP/Certificates/',
-    label: i18n.t('pageSslCertificates.ldapCertificate')
+    label: i18n.t('pageSslCertificates.ldapCertificate'),
   },
   {
     type: 'TrustStore Certificate',
@@ -18,13 +18,13 @@
     // Web UI will show 'CA Certificate' instead of
     // 'TrustStore Certificate' after user testing revealed
     // the term 'TrustStore Certificate' wasn't recognized/was unfamilar
-    label: i18n.t('pageSslCertificates.caCertificate')
-  }
+    label: i18n.t('pageSslCertificates.caCertificate'),
+  },
 ];
 
 const getCertificateProp = (type, prop) => {
   const certificate = CERTIFICATE_TYPES.find(
-    certificate => certificate.type === type
+    (certificate) => certificate.type === type
   );
   return certificate ? certificate[prop] : null;
 };
@@ -33,11 +33,11 @@
   namespaced: true,
   state: {
     allCertificates: [],
-    availableUploadTypes: []
+    availableUploadTypes: [],
   },
   getters: {
-    allCertificates: state => state.allCertificates,
-    availableUploadTypes: state => state.availableUploadTypes
+    allCertificates: (state) => state.allCertificates,
+    availableUploadTypes: (state) => state.availableUploadTypes,
   },
   mutations: {
     setCertificates(state, certificates) {
@@ -45,17 +45,17 @@
     },
     setAvailableUploadTypes(state, availableUploadTypes) {
       state.availableUploadTypes = availableUploadTypes;
-    }
+    },
   },
   actions: {
     async getCertificates({ commit }) {
       return await api
         .get('/redfish/v1/CertificateService/CertificateLocations')
         .then(({ data: { Links: { Certificates } } }) =>
-          Certificates.map(certificate => certificate['@odata.id'])
+          Certificates.map((certificate) => certificate['@odata.id'])
         )
-        .then(certificateLocations => {
-          const promises = certificateLocations.map(location =>
+        .then((certificateLocations) => {
+          const promises = certificateLocations.map((location) =>
             api.get(location)
           );
           api.all(promises).then(
@@ -66,7 +66,7 @@
                   ValidNotAfter,
                   ValidNotBefore,
                   Issuer = {},
-                  Subject = {}
+                  Subject = {},
                 } = data;
                 return {
                   type: Name,
@@ -75,13 +75,13 @@
                   issuedBy: Issuer.CommonName,
                   issuedTo: Subject.CommonName,
                   validFrom: new Date(ValidNotBefore),
-                  validUntil: new Date(ValidNotAfter)
+                  validUntil: new Date(ValidNotAfter),
                 };
               });
               const availableUploadTypes = CERTIFICATE_TYPES.filter(
                 ({ type }) =>
                   !certificates
-                    .map(certificate => certificate.type)
+                    .map((certificate) => certificate.type)
                     .includes(type)
               );
 
@@ -94,15 +94,15 @@
     async addNewCertificate({ dispatch }, { file, type }) {
       return await api
         .post(getCertificateProp(type, 'location'), file, {
-          headers: { 'Content-Type': 'application/x-pem-file' }
+          headers: { 'Content-Type': 'application/x-pem-file' },
         })
         .then(() => dispatch('getCertificates'))
         .then(() =>
           i18n.t('pageSslCertificates.toast.successAddCertificate', {
-            certificate: getCertificateProp(type, 'label')
+            certificate: getCertificateProp(type, 'label'),
           })
         )
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(
             i18n.t('pageSslCertificates.toast.errorAddCertificate')
@@ -126,10 +126,10 @@
         .then(() => dispatch('getCertificates'))
         .then(() =>
           i18n.t('pageSslCertificates.toast.successReplaceCertificate', {
-            certificate: getCertificateProp(type, 'label')
+            certificate: getCertificateProp(type, 'label'),
           })
         )
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(
             i18n.t('pageSslCertificates.toast.errorReplaceCertificate')
@@ -142,10 +142,10 @@
         .then(() => dispatch('getCertificates'))
         .then(() =>
           i18n.t('pageSslCertificates.toast.successDeleteCertificate', {
-            certificate: getCertificateProp(type, 'label')
+            certificate: getCertificateProp(type, 'label'),
           })
         )
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(
             i18n.t('pageSslCertificates.toast.errorDeleteCertificate')
@@ -167,12 +167,12 @@
         challengePassword,
         contactPerson,
         emailAddress,
-        alternateName
+        alternateName,
       } = userData;
       const data = {};
 
       data.CertificateCollection = {
-        '@odata.id': getCertificateProp(certificateType, 'location')
+        '@odata.id': getCertificateProp(certificateType, 'location'),
       };
       data.Country = country;
       data.State = state;
@@ -196,9 +196,9 @@
         )
         //TODO: Success response also throws error so
         // can't accurately show legitimate error in UI
-        .catch(error => console.log(error));
-    }
-  }
+        .catch((error) => console.log(error));
+    },
+  },
 };
 
 export default SslCertificatesStore;
diff --git a/src/store/modules/Authentication/AuthenticanStore.js b/src/store/modules/Authentication/AuthenticanStore.js
index c42b9da..e08f5b0 100644
--- a/src/store/modules/Authentication/AuthenticanStore.js
+++ b/src/store/modules/Authentication/AuthenticanStore.js
@@ -7,16 +7,16 @@
   state: {
     authError: false,
     xsrfCookie: Cookies.get('XSRF-TOKEN'),
-    isAuthenticatedCookie: Cookies.get('IsAuthenticated')
+    isAuthenticatedCookie: Cookies.get('IsAuthenticated'),
   },
   getters: {
-    authError: state => state.authError,
-    isLoggedIn: state => {
+    authError: (state) => state.authError,
+    isLoggedIn: (state) => {
       return (
         state.xsrfCookie !== undefined || state.isAuthenticatedCookie == 'true'
       );
     },
-    token: state => state.xsrfCookie
+    token: (state) => state.xsrfCookie,
   },
   mutations: {
     authSuccess(state) {
@@ -32,7 +32,7 @@
       localStorage.removeItem('storedUsername');
       state.xsrfCookie = undefined;
       state.isAuthenticatedCookie = undefined;
-    }
+    },
   },
   actions: {
     login({ commit }, { username, password }) {
@@ -40,7 +40,7 @@
       return api
         .post('/login', { data: [username, password] })
         .then(() => commit('authSuccess'))
-        .catch(error => {
+        .catch((error) => {
           commit('authError');
           throw new Error(error);
         });
@@ -50,20 +50,20 @@
         .post('/logout', { data: [] })
         .then(() => commit('logout'))
         .then(() => router.go('/login'))
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     async checkPasswordChangeRequired(_, username) {
       return await api
         .get(`/redfish/v1/AccountService/Accounts/${username}`)
         .then(({ data: { PasswordChangeRequired } }) => PasswordChangeRequired)
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     resetStoreState({ state }) {
       state.authError = false;
       state.xsrfCookie = Cookies.get('XSRF-TOKEN');
       state.isAuthenticatedCookie = Cookies.get('IsAuthenticated');
-    }
-  }
+    },
+  },
 };
 
 export default AuthenticationStore;
diff --git a/src/store/modules/Configuration/DateTimeSettingsStore.js b/src/store/modules/Configuration/DateTimeSettingsStore.js
index 0848990..f431a74 100644
--- a/src/store/modules/Configuration/DateTimeSettingsStore.js
+++ b/src/store/modules/Configuration/DateTimeSettingsStore.js
@@ -5,36 +5,36 @@
   namespaced: true,
   state: {
     ntpServers: [],
-    isNtpProtocolEnabled: null
+    isNtpProtocolEnabled: null,
   },
   getters: {
-    ntpServers: state => state.ntpServers,
-    isNtpProtocolEnabled: state => state.isNtpProtocolEnabled
+    ntpServers: (state) => state.ntpServers,
+    isNtpProtocolEnabled: (state) => state.isNtpProtocolEnabled,
   },
   mutations: {
     setNtpServers: (state, ntpServers) => (state.ntpServers = ntpServers),
     setIsNtpProtocolEnabled: (state, isNtpProtocolEnabled) =>
-      (state.isNtpProtocolEnabled = isNtpProtocolEnabled)
+      (state.isNtpProtocolEnabled = isNtpProtocolEnabled),
   },
   actions: {
     async getNtpData({ commit }) {
       return await api
         .get('/redfish/v1/Managers/bmc/NetworkProtocol')
-        .then(response => {
+        .then((response) => {
           const ntpServers = response.data.NTP.NTPServers;
           const isNtpProtocolEnabled = response.data.NTP.ProtocolEnabled;
           commit('setNtpServers', ntpServers);
           commit('setIsNtpProtocolEnabled', isNtpProtocolEnabled);
         })
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
         });
     },
     async updateDateTimeSettings({ state }, dateTimeForm) {
       const ntpData = {
         NTP: {
-          ProtocolEnabled: dateTimeForm.ntpProtocolEnabled
-        }
+          ProtocolEnabled: dateTimeForm.ntpProtocolEnabled,
+        },
       };
       if (dateTimeForm.ntpProtocolEnabled) {
         ntpData.NTP.NTPServers = dateTimeForm.ntpServersArray;
@@ -44,7 +44,7 @@
         .then(async () => {
           if (!dateTimeForm.ntpProtocolEnabled) {
             const dateTimeData = {
-              DateTime: dateTimeForm.updatedDateTime
+              DateTime: dateTimeForm.updatedDateTime,
             };
             /**
              * https://github.com/openbmc/phosphor-time-manager/blob/master/README.md#special-note-on-changing-ntp-setting
@@ -72,14 +72,14 @@
             'pageDateTimeSettings.toast.successSaveDateTimeSettings'
           );
         })
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(
             i18n.t('pageDateTimeSettings.toast.errorSaveDateTimeSettings')
           );
         });
-    }
-  }
+    },
+  },
 };
 
 export default DateTimeStore;
diff --git a/src/store/modules/Configuration/FirmwareStore.js b/src/store/modules/Configuration/FirmwareStore.js
index c99e7eb..be9f50b 100644
--- a/src/store/modules/Configuration/FirmwareStore.js
+++ b/src/store/modules/Configuration/FirmwareStore.js
@@ -10,8 +10,8 @@
  */
 function getBackupFirmwareLocation(list, currentLocation) {
   return list
-    .map(item => item['@odata.id'])
-    .find(location => {
+    .map((item) => item['@odata.id'])
+    .find((location) => {
       const id = location.split('/').pop();
       const currentId = currentLocation.split('/').pop();
       return id !== currentId;
@@ -27,7 +27,7 @@
       currentLocation: null,
       backupVersion: null,
       backupState: null,
-      backupLocation: null
+      backupLocation: null,
     },
     hostFirmware: {
       currentVersion: null,
@@ -35,19 +35,19 @@
       currentLocation: null,
       backupVersion: null,
       backupState: null,
-      backupLocation: null
+      backupLocation: null,
     },
-    applyTime: null
+    applyTime: null,
   },
   getters: {
-    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
+    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: {
     setBmcFirmwareCurrent: (state, { version, location, status }) => {
@@ -70,13 +70,13 @@
       state.hostFirmware.backupState = status;
       state.hostFirmware.backupLocation = location;
     },
-    setApplyTime: (state, applyTime) => (state.applyTime = applyTime)
+    setApplyTime: (state, applyTime) => (state.applyTime = applyTime),
   },
   actions: {
     async getFirmwareInformation({ dispatch }) {
       return await api.all([
         dispatch('getBmcFirmware'),
-        dispatch('getHostFirmware')
+        dispatch('getHostFirmware'),
       ]);
     },
     async getBmcFirmware({ commit }) {
@@ -102,15 +102,15 @@
           commit('setBmcFirmwareCurrent', {
             version: currentData?.data?.Version,
             location: currentData?.data?.['@odata.id'],
-            status: currentData?.data?.Status?.State
+            status: currentData?.data?.Status?.State,
           });
           commit('setBmcFirmwareBackup', {
             version: backupData.data?.Version,
             location: backupData.data?.['@odata.id'],
-            status: backupData.data?.Status?.State
+            status: backupData.data?.Status?.State,
           });
         })
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     async getHostFirmware({ commit }) {
       return await api
@@ -134,15 +134,15 @@
           commit('setHostFirmwareCurrent', {
             version: currentData?.data?.Version,
             location: currentData?.data?.['@odata.id'],
-            status: currentData?.data?.Status?.State
+            status: currentData?.data?.Status?.State,
           });
           commit('setHostFirmwareBackup', {
             version: backupData.data?.Version,
             location: backupData.data?.['@odata.id'],
-            status: backupData.data?.Status?.State
+            status: backupData.data?.Status?.State,
           });
         })
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     getUpdateServiceApplyTime({ commit }) {
       api
@@ -152,20 +152,20 @@
             data.HttpPushUriOptions.HttpPushUriApplyTime.ApplyTime;
           commit('setApplyTime', applyTime);
         })
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     setApplyTimeImmediate({ commit }) {
       const data = {
         HttpPushUriOptions: {
           HttpPushUriApplyTime: {
-            ApplyTime: 'Immediate'
-          }
-        }
+            ApplyTime: 'Immediate',
+          },
+        },
       };
       return api
         .patch('/redfish/v1/UpdateService', data)
         .then(() => commit('setApplyTime', 'Immediate'))
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     async uploadFirmware({ state, dispatch }, image) {
       if (state.applyTime !== 'Immediate') {
@@ -175,11 +175,11 @@
       }
       return await api
         .post('/redfish/v1/UpdateService', image, {
-          headers: { 'Content-Type': 'application/octet-stream' }
+          headers: { 'Content-Type': 'application/octet-stream' },
         })
         .then(() => dispatch('getSystemFirwareVersion'))
         .then(() => i18n.t('pageFirmware.toast.successUploadMessage'))
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(i18n.t('pageFirmware.toast.errorUploadAndReboot'));
         });
@@ -187,7 +187,7 @@
     async uploadFirmwareTFTP({ state, dispatch }, { address, filename }) {
       const data = {
         TransferProtocol: 'TFTP',
-        ImageURI: `${address}/${filename}`
+        ImageURI: `${address}/${filename}`,
       };
       if (state.applyTime !== 'Immediate') {
         // ApplyTime must be set to Immediate before making
@@ -201,7 +201,7 @@
         )
         .then(() => dispatch('getSystemFirwareVersion'))
         .then(() => i18n.t('pageFirmware.toast.successUploadMessage'))
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(i18n.t('pageFirmware.toast.errorUploadAndReboot'));
         });
@@ -211,19 +211,19 @@
       const data = {
         Links: {
           ActiveSoftwareImage: {
-            '@odata.id': backupLoaction
-          }
-        }
+            '@odata.id': backupLoaction,
+          },
+        },
       };
       return await api
         .patch('/redfish/v1/Managers/bmc', data)
         .then(() => i18n.t('pageFirmware.toast.successRebootFromBackup'))
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(i18n.t('pageFirmware.toast.errorRebootFromBackup'));
         });
-    }
-  }
+    },
+  },
 };
 
 export default FirmwareStore;
diff --git a/src/store/modules/Configuration/NetworkSettingsStore.js b/src/store/modules/Configuration/NetworkSettingsStore.js
index ae1de3d..9cdcd41 100644
--- a/src/store/modules/Configuration/NetworkSettingsStore.js
+++ b/src/store/modules/Configuration/NetworkSettingsStore.js
@@ -7,12 +7,12 @@
   state: {
     defaultGateway: '',
     ethernetData: [],
-    interfaceOptions: []
+    interfaceOptions: [],
   },
   getters: {
-    defaultGateway: state => state.defaultGateway,
-    ethernetData: state => state.ethernetData,
-    interfaceOptions: state => state.interfaceOptions
+    defaultGateway: (state) => state.defaultGateway,
+    ethernetData: (state) => state.ethernetData,
+    interfaceOptions: (state) => state.interfaceOptions,
   },
   mutations: {
     setDefaultGateway: (state, defaultGateway) =>
@@ -20,35 +20,35 @@
     setEthernetData: (state, ethernetData) =>
       (state.ethernetData = ethernetData),
     setInterfaceOptions: (state, interfaceOptions) =>
-      (state.interfaceOptions = interfaceOptions)
+      (state.interfaceOptions = interfaceOptions),
   },
   actions: {
     async getEthernetData({ commit }) {
       return await api
         .get('/redfish/v1/Managers/bmc/EthernetInterfaces')
-        .then(response =>
+        .then((response) =>
           response.data.Members.map(
-            ethernetInterface => ethernetInterface['@odata.id']
+            (ethernetInterface) => ethernetInterface['@odata.id']
           )
         )
-        .then(ethernetInterfaceIds =>
+        .then((ethernetInterfaceIds) =>
           api.all(
-            ethernetInterfaceIds.map(ethernetInterface =>
+            ethernetInterfaceIds.map((ethernetInterface) =>
               api.get(ethernetInterface)
             )
           )
         )
-        .then(ethernetInterfaces => {
+        .then((ethernetInterfaces) => {
           const ethernetData = ethernetInterfaces.map(
-            ethernetInterface => ethernetInterface.data
+            (ethernetInterface) => ethernetInterface.data
           );
           const interfaceOptions = ethernetInterfaces.map(
-            ethernetName => ethernetName.data.Id
+            (ethernetName) => ethernetName.data.Id
           );
           const addresses = ethernetData[0].IPv4StaticAddresses;
 
           // Default gateway manually set to first gateway saved on the first interface. Default gateway property is WIP on backend
-          const defaultGateway = addresses.map(ipv4 => {
+          const defaultGateway = addresses.map((ipv4) => {
             return ipv4.Gateway;
           });
 
@@ -56,7 +56,7 @@
           commit('setEthernetData', ethernetData);
           commit('setInterfaceOptions', interfaceOptions);
         })
-        .catch(error => {
+        .catch((error) => {
           console.log('Network Data:', error);
         });
     },
@@ -67,10 +67,10 @@
         state.ethernetData[networkSettingsForm.selectedInterfaceIndex]
           .IPv4StaticAddresses;
 
-      const addressArray = originalAddresses.map(item => {
+      const addressArray = originalAddresses.map((item) => {
         const address = item.Address;
         if (find(updatedAddresses, { Address: address })) {
-          remove(updatedAddresses, item => {
+          remove(updatedAddresses, (item) => {
             return item.Address === address;
           });
           return {};
@@ -81,7 +81,7 @@
 
       const data = {
         HostName: networkSettingsForm.hostname,
-        MACAddress: networkSettingsForm.macAddress
+        MACAddress: networkSettingsForm.macAddress,
       };
 
       // If DHCP disabled, update static DNS or static ipv4
@@ -99,14 +99,14 @@
         .then(() => {
           return i18n.t('pageNetworkSettings.toast.successSaveNetworkSettings');
         })
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(
             i18n.t('pageNetworkSettings.toast.errorSaveNetworkSettings')
           );
         });
-    }
-  }
+    },
+  },
 };
 
 export default NetworkSettingsStore;
diff --git a/src/store/modules/Control/BootSettingsStore.js b/src/store/modules/Control/BootSettingsStore.js
index ff5f505..99542b8 100644
--- a/src/store/modules/Control/BootSettingsStore.js
+++ b/src/store/modules/Control/BootSettingsStore.js
@@ -7,13 +7,13 @@
     bootSourceOptions: [],
     bootSource: null,
     overrideEnabled: null,
-    tpmEnabled: null
+    tpmEnabled: null,
   },
   getters: {
-    bootSourceOptions: state => state.bootSourceOptions,
-    bootSource: state => state.bootSource,
-    overrideEnabled: state => state.overrideEnabled,
-    tpmEnabled: state => state.tpmEnabled
+    bootSourceOptions: (state) => state.bootSourceOptions,
+    bootSource: (state) => state.bootSource,
+    overrideEnabled: (state) => state.overrideEnabled,
+    tpmEnabled: (state) => state.tpmEnabled,
   },
   mutations: {
     setBootSourceOptions: (state, bootSourceOptions) =>
@@ -27,7 +27,7 @@
         state.overrideEnabled = false;
       }
     },
-    setTpmPolicy: (state, tpmEnabled) => (state.tpmEnabled = tpmEnabled)
+    setTpmPolicy: (state, tpmEnabled) => (state.tpmEnabled = tpmEnabled),
   },
   actions: {
     async getBootSettings({ commit }) {
@@ -41,7 +41,7 @@
           commit('setOverrideEnabled', Boot.BootSourceOverrideEnabled);
           commit('setBootSource', Boot.BootSourceOverrideTarget);
         })
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     saveBootSettings({ commit, dispatch }, { bootSource, overrideEnabled }) {
       const data = { Boot: {} };
@@ -57,13 +57,13 @@
 
       return api
         .patch('/redfish/v1/Systems/system', data)
-        .then(response => {
+        .then((response) => {
           // If request success, commit the values
           commit('setBootSource', data.Boot.BootSourceOverrideTarget);
           commit('setOverrideEnabled', data.Boot.BootSourceOverrideEnabled);
           return response;
         })
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           // If request error, GET saved options
           dispatch('getBootSettings');
@@ -77,7 +77,7 @@
         .then(({ data: { data: { TPMEnable } } }) =>
           commit('setTpmPolicy', TPMEnable)
         )
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     saveTpmPolicy({ commit, dispatch }, tpmEnabled) {
       // TODO: switch to Redfish when available
@@ -87,12 +87,12 @@
           '/xyz/openbmc_project/control/host0/TPMEnable/attr/TPMEnable',
           data
         )
-        .then(response => {
+        .then((response) => {
           // If request success, commit the values
           commit('setTpmPolicy', tpmEnabled);
           return response;
         })
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           // If request error, GET saved policy
           dispatch('getTpmPolicy');
@@ -119,7 +119,7 @@
           let message = i18n.t(
             'pageServerPowerOperations.toast.successSaveSettings'
           );
-          responses.forEach(response => {
+          responses.forEach((response) => {
             if (response instanceof Error) {
               throw new Error(
                 i18n.t('pageServerPowerOperations.toast.errorSaveSettings')
@@ -129,8 +129,8 @@
           return message;
         })
       );
-    }
-  }
+    },
+  },
 };
 
 export default BootSettingsStore;
diff --git a/src/store/modules/Control/ControlStore.js b/src/store/modules/Control/ControlStore.js
index ade5da6..82940f8 100644
--- a/src/store/modules/Control/ControlStore.js
+++ b/src/store/modules/Control/ControlStore.js
@@ -9,15 +9,15 @@
  * @param {string} hostStatus
  * @returns {Promise}
  */
-const checkForHostStatus = function(hostStatus) {
-  return new Promise(resolve => {
+const checkForHostStatus = function (hostStatus) {
+  return new Promise((resolve) => {
     const timer = setTimeout(() => {
       resolve();
       unwatch();
     }, 300000 /*5mins*/);
     const unwatch = this.watch(
-      state => state.global.hostStatus,
-      value => {
+      (state) => state.global.hostStatus,
+      (value) => {
         if (value === hostStatus) {
           resolve();
           unwatch();
@@ -33,12 +33,12 @@
   state: {
     isOperationInProgress: false,
     lastPowerOperationTime: null,
-    lastBmcRebootTime: null
+    lastBmcRebootTime: null,
   },
   getters: {
-    isOperationInProgress: state => state.isOperationInProgress,
-    lastPowerOperationTime: state => state.lastPowerOperationTime,
-    lastBmcRebootTime: state => state.lastBmcRebootTime
+    isOperationInProgress: (state) => state.isOperationInProgress,
+    lastPowerOperationTime: (state) => state.lastPowerOperationTime,
+    lastBmcRebootTime: (state) => state.lastBmcRebootTime,
   },
   mutations: {
     setOperationInProgress: (state, inProgress) =>
@@ -46,28 +46,28 @@
     setLastPowerOperationTime: (state, lastPowerOperationTime) =>
       (state.lastPowerOperationTime = lastPowerOperationTime),
     setLastBmcRebootTime: (state, lastBmcRebootTime) =>
-      (state.lastBmcRebootTime = lastBmcRebootTime)
+      (state.lastBmcRebootTime = lastBmcRebootTime),
   },
   actions: {
     async getLastPowerOperationTime({ commit }) {
       return await api
         .get('/redfish/v1/Systems/system')
-        .then(response => {
+        .then((response) => {
           const lastReset = response.data.LastResetTime;
           const lastPowerOperationTime = new Date(lastReset);
           commit('setLastPowerOperationTime', lastPowerOperationTime);
         })
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     getLastBmcRebootTime({ commit }) {
       return api
         .get('/redfish/v1/Managers/bmc')
-        .then(response => {
+        .then((response) => {
           const lastBmcReset = response.data.LastResetTime;
           const lastBmcRebootTime = new Date(lastBmcReset);
           commit('setLastBmcRebootTime', lastBmcRebootTime);
         })
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     async rebootBmc({ dispatch }) {
       const data = { ResetType: 'GracefulRestart' };
@@ -75,7 +75,7 @@
         .post('/redfish/v1/Managers/bmc/Actions/Manager.Reset', data)
         .then(() => dispatch('getLastBmcRebootTime'))
         .then(() => i18n.t('pageRebootBmc.toast.successRebootStart'))
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(i18n.t('pageRebootBmc.toast.errorRebootStart'));
         });
@@ -119,12 +119,12 @@
       commit('setOperationInProgress', true);
       api
         .post('/redfish/v1/Systems/system/Actions/ComputerSystem.Reset', data)
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           commit('setOperationInProgress', false);
         });
-    }
-  }
+    },
+  },
 };
 
 export default ControlStore;
diff --git a/src/store/modules/Control/PowerControlStore.js b/src/store/modules/Control/PowerControlStore.js
index 3a2434a..9dbddf0 100644
--- a/src/store/modules/Control/PowerControlStore.js
+++ b/src/store/modules/Control/PowerControlStore.js
@@ -5,17 +5,17 @@
   namespaced: true,
   state: {
     powerCapValue: null,
-    powerConsumptionValue: null
+    powerConsumptionValue: null,
   },
   getters: {
-    powerCapValue: state => state.powerCapValue,
-    powerConsumptionValue: state => state.powerConsumptionValue
+    powerCapValue: (state) => state.powerCapValue,
+    powerConsumptionValue: (state) => state.powerConsumptionValue,
   },
   mutations: {
     setPowerCapValue: (state, powerCapValue) =>
       (state.powerCapValue = powerCapValue),
     setPowerConsumptionValue: (state, powerConsumptionValue) =>
-      (state.powerConsumptionValue = powerConsumptionValue)
+      (state.powerConsumptionValue = powerConsumptionValue),
   },
   actions: {
     setPowerCapUpdatedValue({ commit }, value) {
@@ -24,7 +24,7 @@
     async getPowerControl({ commit }) {
       return await api
         .get('/redfish/v1/Chassis/chassis/Power')
-        .then(response => {
+        .then((response) => {
           const powerControl = response.data.PowerControl;
           const powerCap = powerControl[0].PowerLimit.LimitInWatts;
           // If system is powered off, power consumption does not exist in the PowerControl
@@ -33,13 +33,13 @@
           commit('setPowerCapValue', powerCap);
           commit('setPowerConsumptionValue', powerConsumption);
         })
-        .catch(error => {
+        .catch((error) => {
           console.log('Power control', error);
         });
     },
     async setPowerControl(_, powerCapValue) {
       const data = {
-        PowerControl: [{ PowerLimit: { LimitInWatts: powerCapValue } }]
+        PowerControl: [{ PowerLimit: { LimitInWatts: powerCapValue } }],
       };
 
       return await api
@@ -47,14 +47,14 @@
         .then(() =>
           i18n.t('pageServerPowerOperations.toast.successSaveSettings')
         )
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           throw new Error(
             i18n.t('pageServerPowerOperations.toast.errorSaveSettings')
           );
         });
-    }
-  }
+    },
+  },
 };
 
 export default PowerControlStore;
diff --git a/src/store/modules/Control/ServerLedStore.js b/src/store/modules/Control/ServerLedStore.js
index 2be7722..51e0920 100644
--- a/src/store/modules/Control/ServerLedStore.js
+++ b/src/store/modules/Control/ServerLedStore.js
@@ -4,24 +4,24 @@
 const ServerLedStore = {
   namespaced: true,
   state: {
-    indicatorValue: 'Off'
+    indicatorValue: 'Off',
   },
   getters: {
-    getIndicatorValue: state => state.indicatorValue
+    getIndicatorValue: (state) => state.indicatorValue,
   },
   mutations: {
     setIndicatorValue(state, indicatorValue) {
       state.indicatorValue = indicatorValue;
-    }
+    },
   },
   actions: {
     async getIndicatorValue({ commit }) {
       return await api
         .get('/redfish/v1/Systems/system')
-        .then(response => {
+        .then((response) => {
           commit('setIndicatorValue', response.data.IndicatorLED);
         })
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     async saveIndicatorLedValue({ commit }, payload) {
       return await api
@@ -34,7 +34,7 @@
             return i18n.t('pageServerLed.toast.successServerLedOff');
           }
         })
-        .catch(error => {
+        .catch((error) => {
           console.log(error);
           if (payload === 'Lit') {
             throw new Error(i18n.t('pageServerLed.toast.errorServerLedOn'));
@@ -42,8 +42,8 @@
             throw new Error(i18n.t('pageServerLed.toast.errorServerLedOff'));
           }
         });
-    }
-  }
+    },
+  },
 };
 
 export default ServerLedStore;
diff --git a/src/store/modules/Control/VirtualMediaStore.js b/src/store/modules/Control/VirtualMediaStore.js
index 6785f5f..7c183b0 100644
--- a/src/store/modules/Control/VirtualMediaStore.js
+++ b/src/store/modules/Control/VirtualMediaStore.js
@@ -6,17 +6,17 @@
   state: {
     proxyDevices: [],
     legacyDevices: [],
-    connections: []
+    connections: [],
   },
   getters: {
-    proxyDevices: state => state.proxyDevices,
-    legacyDevices: state => state.legacyDevices
+    proxyDevices: (state) => state.proxyDevices,
+    legacyDevices: (state) => state.legacyDevices,
   },
   mutations: {
     setProxyDevicesData: (state, deviceData) =>
       (state.proxyDevices = deviceData),
     setLegacyDevicesData: (state, deviceData) =>
-      (state.legacyDevices = deviceData)
+      (state.legacyDevices = deviceData),
   },
   actions: {
     async getData({ commit }) {
@@ -30,7 +30,7 @@
           websocket: '/vm/0/0',
           file: null,
           transferProtocolType: 'OEM',
-          isActive: false
+          isActive: false,
         };
         commit('setProxyDevicesData', [device]);
         return;
@@ -38,43 +38,43 @@
 
       return await api
         .get('/redfish/v1/Managers/bmc/VirtualMedia')
-        .then(response =>
-          response.data.Members.map(virtualMedia => virtualMedia['@odata.id'])
+        .then((response) =>
+          response.data.Members.map((virtualMedia) => virtualMedia['@odata.id'])
         )
-        .then(devices => api.all(devices.map(device => api.get(device))))
-        .then(devices => {
-          const deviceData = devices.map(device => {
+        .then((devices) => api.all(devices.map((device) => api.get(device))))
+        .then((devices) => {
+          const deviceData = devices.map((device) => {
             const isActive = device.data?.Inserted === true ? true : false;
             return {
               id: device.data?.Id,
               transferProtocolType: device.data?.TransferProtocolType,
               websocket: device.data?.Oem?.OpenBMC?.WebSocketEndpoint,
-              isActive: isActive
+              isActive: isActive,
             };
           });
           const proxyDevices = deviceData
-            .filter(d => d.transferProtocolType === 'OEM')
-            .map(device => {
+            .filter((d) => d.transferProtocolType === 'OEM')
+            .map((device) => {
               return {
                 ...device,
-                file: null
+                file: null,
               };
             });
           const legacyDevices = deviceData
-            .filter(d => !d.transferProtocolType)
-            .map(device => {
+            .filter((d) => !d.transferProtocolType)
+            .map((device) => {
               return {
                 ...device,
                 serverUri: '',
                 username: '',
                 password: '',
-                isRW: false
+                isRW: false,
               };
             });
           commit('setProxyDevicesData', proxyDevices);
           commit('setLegacyDevicesData', legacyDevices);
         })
-        .catch(error => {
+        .catch((error) => {
           console.log('Virtual Media:', error);
         });
     },
@@ -84,7 +84,7 @@
           `/redfish/v1/Managers/bmc/VirtualMedia/${id}/Actions/VirtualMedia.InsertMedia`,
           data
         )
-        .catch(error => {
+        .catch((error) => {
           console.log('Mount image:', error);
           throw new Error();
         });
@@ -94,12 +94,12 @@
         .post(
           `/redfish/v1/Managers/bmc/VirtualMedia/${id}/Actions/VirtualMedia.EjectMedia`
         )
-        .catch(error => {
+        .catch((error) => {
           console.log('Unmount image:', error);
           throw new Error();
         });
-    }
-  }
+    },
+  },
 };
 
 export default VirtualMediaStore;
diff --git a/src/store/modules/GlobalStore.js b/src/store/modules/GlobalStore.js
index 5af5dfe..218feb6 100644
--- a/src/store/modules/GlobalStore.js
+++ b/src/store/modules/GlobalStore.js
@@ -4,10 +4,10 @@
   on: 'xyz.openbmc_project.State.Host.HostState.Running',
   off: 'xyz.openbmc_project.State.Host.HostState.Off',
   error: 'xyz.openbmc_project.State.Host.HostState.Quiesced',
-  diagnosticMode: 'xyz.openbmc_project.State.Host.HostState.DiagnosticMode'
+  diagnosticMode: 'xyz.openbmc_project.State.Host.HostState.DiagnosticMode',
 };
 
-const hostStateMapper = hostState => {
+const hostStateMapper = (hostState) => {
   switch (hostState) {
     case HOST_STATE.on:
     case 'On': // Redfish PowerState
@@ -36,15 +36,15 @@
       ? JSON.parse(localStorage.getItem('storedUtcDisplay'))
       : true,
     username: localStorage.getItem('storedUsername'),
-    isAuthorized: true
+    isAuthorized: true,
   },
   getters: {
-    hostStatus: state => state.hostStatus,
-    bmcTime: state => state.bmcTime,
-    languagePreference: state => state.languagePreference,
-    isUtcDisplay: state => state.isUtcDisplay,
-    username: state => state.username,
-    isAuthorized: state => state.isAuthorized
+    hostStatus: (state) => state.hostStatus,
+    bmcTime: (state) => state.bmcTime,
+    languagePreference: (state) => state.languagePreference,
+    isUtcDisplay: (state) => state.isUtcDisplay,
+    username: (state) => state.username,
+    isAuthorized: (state) => state.isAuthorized,
   },
   mutations: {
     setBmcTime: (state, bmcTime) => (state.bmcTime = bmcTime),
@@ -54,23 +54,23 @@
       (state.languagePreference = language),
     setUsername: (state, username) => (state.username = username),
     setUtcTime: (state, isUtcDisplay) => (state.isUtcDisplay = isUtcDisplay),
-    setUnauthorized: state => {
+    setUnauthorized: (state) => {
       state.isAuthorized = false;
       window.setTimeout(() => {
         state.isAuthorized = true;
       }, 100);
-    }
+    },
   },
   actions: {
     async getBmcTime({ commit }) {
       return await api
         .get('/redfish/v1/Managers/bmc')
-        .then(response => {
+        .then((response) => {
           const bmcDateTime = response.data.DateTime;
           const date = new Date(bmcDateTime);
           commit('setBmcTime', date);
         })
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     getHostStatus({ commit }) {
       api
@@ -85,9 +85,9 @@
             commit('setHostStatus', PowerState);
           }
         })
-        .catch(error => console.log(error));
-    }
-  }
+        .catch((error) => console.log(error));
+    },
+  },
 };
 
 export default GlobalStore;
diff --git a/src/store/modules/Health/BmcStore.js b/src/store/modules/Health/BmcStore.js
index 784bd44..73df10b 100644
--- a/src/store/modules/Health/BmcStore.js
+++ b/src/store/modules/Health/BmcStore.js
@@ -3,10 +3,10 @@
 const ChassisStore = {
   namespaced: true,
   state: {
-    bmc: null
+    bmc: null,
   },
   getters: {
-    bmc: state => state.bmc
+    bmc: (state) => state.bmc,
   },
   mutations: {
     setBmcInfo: (state, data) => {
@@ -32,16 +32,16 @@
       bmc.statusState = data.Status.State;
       bmc.uuid = data.UUID;
       state.bmc = bmc;
-    }
+    },
   },
   actions: {
     async getBmcInfo({ commit }) {
       return await api
         .get('/redfish/v1/Managers/bmc')
         .then(({ data }) => commit('setBmcInfo', data))
-        .catch(error => console.log(error));
-    }
-  }
+        .catch((error) => console.log(error));
+    },
+  },
 };
 
 export default ChassisStore;
diff --git a/src/store/modules/Health/ChassisStore.js b/src/store/modules/Health/ChassisStore.js
index e9e58e7..251279e 100644
--- a/src/store/modules/Health/ChassisStore.js
+++ b/src/store/modules/Health/ChassisStore.js
@@ -3,14 +3,14 @@
 const ChassisStore = {
   namespaced: true,
   state: {
-    chassis: []
+    chassis: [],
   },
   getters: {
-    chassis: state => state.chassis
+    chassis: (state) => state.chassis,
   },
   mutations: {
     setChassisInfo: (state, data) => {
-      state.chassis = data.map(chassis => {
+      state.chassis = data.map((chassis) => {
         const {
           Id,
           Status = {},
@@ -18,7 +18,7 @@
           SerialNumber,
           ChassisType,
           Manufacturer,
-          PowerState
+          PowerState,
         } = chassis;
 
         return {
@@ -30,26 +30,26 @@
           manufacturer: Manufacturer,
           powerState: PowerState,
           statusState: Status.State,
-          healthRollup: Status.HealthRollup
+          healthRollup: Status.HealthRollup,
         };
       });
-    }
+    },
   },
   actions: {
     async getChassisInfo({ commit }) {
       return await api
         .get('/redfish/v1/Chassis')
         .then(({ data: { Members = [] } }) =>
-          Members.map(member => api.get(member['@odata.id']))
+          Members.map((member) => api.get(member['@odata.id']))
         )
-        .then(promises => api.all(promises))
-        .then(response => {
+        .then((promises) => api.all(promises))
+        .then((response) => {
           const data = response.map(({ data }) => data);
           commit('setChassisInfo', data);
         })
-        .catch(error => console.log(error));
-    }
-  }
+        .catch((error) => console.log(error));
+    },
+  },
 };
 
 export default ChassisStore;
diff --git a/src/store/modules/Health/EventLogStore.js b/src/store/modules/Health/EventLogStore.js
index 79bee02..bf1de2f 100644
--- a/src/store/modules/Health/EventLogStore.js
+++ b/src/store/modules/Health/EventLogStore.js
@@ -17,31 +17,32 @@
 
 // TODO: High priority events should also check if Log
 // is resolved when the property is available in Redfish
-const getHighPriorityEvents = events =>
+const getHighPriorityEvents = (events) =>
   events.filter(({ severity }) => severity === 'Critical');
 
 const EventLogStore = {
   namespaced: true,
   state: {
     allEvents: [],
-    loadedEvents: false
+    loadedEvents: false,
   },
   getters: {
-    allEvents: state => state.allEvents,
-    highPriorityEvents: state => getHighPriorityEvents(state.allEvents),
-    healthStatus: state => getHealthStatus(state.allEvents, state.loadedEvents)
+    allEvents: (state) => state.allEvents,
+    highPriorityEvents: (state) => getHighPriorityEvents(state.allEvents),
+    healthStatus: (state) =>
+      getHealthStatus(state.allEvents, state.loadedEvents),
   },
   mutations: {
     setAllEvents: (state, allEvents) => (
       (state.allEvents = allEvents), (state.loadedEvents = true)
-    )
+    ),
   },
   actions: {
     async getEventLogData({ commit }) {
       return await api
         .get('/redfish/v1/Systems/system/LogServices/EventLog/Entries')
         .then(({ data: { Members = [] } = {} }) => {
-          const eventLogs = Members.map(log => {
+          const eventLogs = Members.map((log) => {
             const { Id, Severity, Created, EntryType, Message } = log;
             return {
               id: Id,
@@ -49,25 +50,25 @@
               date: new Date(Created),
               type: EntryType,
               description: Message,
-              uri: log['@odata.id']
+              uri: log['@odata.id'],
             };
           });
           commit('setAllEvents', eventLogs);
         })
-        .catch(error => {
+        .catch((error) => {
           console.log('Event Log Data:', error);
         });
     },
     async deleteEventLogs({ dispatch }, uris = []) {
-      const promises = uris.map(uri =>
-        api.delete(uri).catch(error => {
+      const promises = uris.map((uri) =>
+        api.delete(uri).catch((error) => {
           console.log(error);
           return error;
         })
       );
       return await api
         .all(promises)
-        .then(response => {
+        .then((response) => {
           dispatch('getEventLogData');
           return response;
         })
@@ -95,8 +96,8 @@
             return toastMessages;
           })
         );
-    }
-  }
+    },
+  },
 };
 
 export default EventLogStore;
diff --git a/src/store/modules/Health/FanStore.js b/src/store/modules/Health/FanStore.js
index 2de388b..b4a4189 100644
--- a/src/store/modules/Health/FanStore.js
+++ b/src/store/modules/Health/FanStore.js
@@ -3,33 +3,33 @@
 const FanStore = {
   namespaced: true,
   state: {
-    fans: []
+    fans: [],
   },
   getters: {
-    fans: state => state.fans
+    fans: (state) => state.fans,
   },
   mutations: {
     setFanInfo: (state, data) => {
-      state.fans = data.map(fan => {
+      state.fans = data.map((fan) => {
         const { MemberId, Status = {}, PartNumber, SerialNumber } = fan;
         return {
           id: MemberId,
           health: Status.Health,
           partNumber: PartNumber,
           serialNumber: SerialNumber,
-          statusState: Status.State
+          statusState: Status.State,
         };
       });
-    }
+    },
   },
   actions: {
     async getFanInfo({ commit }) {
       return await api
         .get('/redfish/v1/Chassis/chassis/Thermal')
         .then(({ data: { Fans = [] } }) => commit('setFanInfo', Fans))
-        .catch(error => console.log(error));
-    }
-  }
+        .catch((error) => console.log(error));
+    },
+  },
 };
 
 export default FanStore;
diff --git a/src/store/modules/Health/MemoryStore.js b/src/store/modules/Health/MemoryStore.js
index 63e08e6..cd2478d 100644
--- a/src/store/modules/Health/MemoryStore.js
+++ b/src/store/modules/Health/MemoryStore.js
@@ -3,10 +3,10 @@
 const MemoryStore = {
   namespaced: true,
   state: {
-    dimms: []
+    dimms: [],
   },
   getters: {
-    dimms: state => state.dimms
+    dimms: (state) => state.dimms,
   },
   mutations: {
     setMemoryInfo: (state, data) => {
@@ -17,23 +17,23 @@
           health: Status.Health,
           partNumber: PartNumber,
           serialNumber: SerialNumber,
-          statusState: Status.State
+          statusState: Status.State,
         };
       });
-    }
+    },
   },
   actions: {
     async getDimms({ commit }) {
       return await api
         .get('/redfish/v1/Systems/system/Memory')
         .then(({ data: { Members } }) => {
-          const promises = Members.map(item => api.get(item['@odata.id']));
+          const promises = Members.map((item) => api.get(item['@odata.id']));
           return api.all(promises);
         })
-        .then(response => commit('setMemoryInfo', response))
-        .catch(error => console.log(error));
-    }
-  }
+        .then((response) => commit('setMemoryInfo', response))
+        .catch((error) => console.log(error));
+    },
+  },
 };
 
 export default MemoryStore;
diff --git a/src/store/modules/Health/PowerSupplyStore.js b/src/store/modules/Health/PowerSupplyStore.js
index 4e3d5fe..565715f 100644
--- a/src/store/modules/Health/PowerSupplyStore.js
+++ b/src/store/modules/Health/PowerSupplyStore.js
@@ -3,14 +3,14 @@
 const PowerSupplyStore = {
   namespaced: true,
   state: {
-    powerSupplies: []
+    powerSupplies: [],
   },
   getters: {
-    powerSupplies: state => state.powerSupplies
+    powerSupplies: (state) => state.powerSupplies,
   },
   mutations: {
     setPowerSupply: (state, data) => {
-      state.powerSupplies = data.map(powerSupply => {
+      state.powerSupplies = data.map((powerSupply) => {
         const {
           EfficiencyPercent,
           FirmwareVersion,
@@ -20,7 +20,7 @@
           PartNumber,
           PowerInputWatts,
           SerialNumber,
-          Status
+          Status,
         } = powerSupply;
         return {
           id: MemberId,
@@ -32,10 +32,10 @@
           indicatorLed: IndicatorLED,
           model: Model,
           powerInputWatts: PowerInputWatts,
-          statusState: Status.State
+          statusState: Status.State,
         };
       });
-    }
+    },
   },
   actions: {
     async getPowerSupply({ commit }) {
@@ -44,9 +44,9 @@
         .then(({ data: { PowerSupplies } }) =>
           commit('setPowerSupply', PowerSupplies)
         )
-        .catch(error => console.log(error));
-    }
-  }
+        .catch((error) => console.log(error));
+    },
+  },
 };
 
 export default PowerSupplyStore;
diff --git a/src/store/modules/Health/ProcessorStore.js b/src/store/modules/Health/ProcessorStore.js
index a1411eb..4a67c6b 100644
--- a/src/store/modules/Health/ProcessorStore.js
+++ b/src/store/modules/Health/ProcessorStore.js
@@ -3,14 +3,14 @@
 const ProcessorStore = {
   namespaced: true,
   state: {
-    processors: []
+    processors: [],
   },
   getters: {
-    processors: state => state.processors
+    processors: (state) => state.processors,
   },
   mutations: {
     setProcessorsInfo: (state, data) => {
-      state.processors = data.map(processor => {
+      state.processors = data.map((processor) => {
         const {
           Id,
           Status = {},
@@ -22,7 +22,7 @@
           Name,
           ProcessorArchitecture,
           ProcessorType,
-          TotalCores
+          TotalCores,
         } = processor;
         return {
           id: Id,
@@ -36,26 +36,26 @@
           name: Name,
           processorArchitecture: ProcessorArchitecture,
           processorType: ProcessorType,
-          totalCores: TotalCores
+          totalCores: TotalCores,
         };
       });
-    }
+    },
   },
   actions: {
     async getProcessorsInfo({ commit }) {
       return await api
         .get('/redfish/v1/Systems/system/Processors')
         .then(({ data: { Members = [] } }) =>
-          Members.map(member => api.get(member['@odata.id']))
+          Members.map((member) => api.get(member['@odata.id']))
         )
-        .then(promises => api.all(promises))
-        .then(response => {
+        .then((promises) => api.all(promises))
+        .then((response) => {
           const data = response.map(({ data }) => data);
           commit('setProcessorsInfo', data);
         })
-        .catch(error => console.log(error));
-    }
-  }
+        .catch((error) => console.log(error));
+    },
+  },
 };
 
 export default ProcessorStore;
diff --git a/src/store/modules/Health/SensorsStore.js b/src/store/modules/Health/SensorsStore.js
index 5f2bf52..1c0de0d 100644
--- a/src/store/modules/Health/SensorsStore.js
+++ b/src/store/modules/Health/SensorsStore.js
@@ -4,15 +4,15 @@
 const SensorsStore = {
   namespaced: true,
   state: {
-    sensors: []
+    sensors: [],
   },
   getters: {
-    sensors: state => state.sensors
+    sensors: (state) => state.sensors,
   },
   mutations: {
     setSensors: (state, sensors) => {
       state.sensors = uniqBy([...state.sensors, ...sensors], 'name');
-    }
+    },
   },
   actions: {
     async getAllSensors({ dispatch }) {
@@ -30,18 +30,18 @@
       return await api
         .get('/redfish/v1/Chassis')
         .then(({ data: { Members } }) =>
-          Members.map(member => member['@odata.id'])
+          Members.map((member) => member['@odata.id'])
         )
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     async getSensors({ commit }, id) {
       const sensors = await api
         .get(`${id}/Sensors`)
-        .then(response => response.data.Members)
-        .catch(error => console.log(error));
+        .then((response) => response.data.Members)
+        .catch((error) => console.log(error));
       if (!sensors) return;
-      const promises = sensors.map(sensor => {
-        return api.get(sensor['@odata.id']).catch(error => {
+      const promises = sensors.map((sensor) => {
+        return api.get(sensor['@odata.id']).catch((error) => {
           console.log(error);
           return error;
         });
@@ -57,7 +57,7 @@
               upperCaution: data.Thresholds?.UpperCaution?.Reading,
               lowerCritical: data.Thresholds?.LowerCritical?.Reading,
               upperCritical: data.Thresholds?.UpperCritical?.Reading,
-              units: data.ReadingUnits
+              units: data.ReadingUnits,
             };
           });
           commit('setSensors', sensorData);
@@ -69,16 +69,16 @@
         .get(`${id}/Thermal`)
         .then(({ data: { Fans = [], Temperatures = [] } }) => {
           const sensorData = [];
-          Fans.forEach(sensor => {
+          Fans.forEach((sensor) => {
             sensorData.push({
               // TODO: add upper/lower threshold
               name: sensor.Name,
               status: sensor.Status.Health,
               currentValue: sensor.Reading,
-              units: sensor.ReadingUnits
+              units: sensor.ReadingUnits,
             });
           });
-          Temperatures.forEach(sensor => {
+          Temperatures.forEach((sensor) => {
             sensorData.push({
               name: sensor.Name,
               status: sensor.Status.Health,
@@ -87,18 +87,18 @@
               upperCaution: sensor.UpperThresholdNonCritical,
               lowerCritical: sensor.LowerThresholdCritical,
               upperCritical: sensor.UpperThresholdCritical,
-              units: '℃'
+              units: '℃',
             });
           });
           commit('setSensors', sensorData);
         })
-        .catch(error => console.log(error));
+        .catch((error) => console.log(error));
     },
     async getPowerSensors({ commit }, id) {
       return await api
         .get(`${id}/Power`)
         .then(({ data: { Voltages = [] } }) => {
-          const sensorData = Voltages.map(sensor => {
+          const sensorData = Voltages.map((sensor) => {
             return {
               name: sensor.Name,
               status: sensor.Status.Health,
@@ -107,14 +107,14 @@
               upperCaution: sensor.UpperThresholdNonCritical,
               lowerCritical: sensor.LowerThresholdCritical,
               upperCritical: sensor.UpperThresholdCritical,
-              units: 'Volts'
+              units: 'Volts',
             };
           });
           commit('setSensors', sensorData);
         })
-        .catch(error => console.log(error));
-    }
-  }
+        .catch((error) => console.log(error));
+    },
+  },
 };
 
 export default SensorsStore;
diff --git a/src/store/modules/Health/SystemStore.js b/src/store/modules/Health/SystemStore.js
index 828b78b..30ae66b 100644
--- a/src/store/modules/Health/SystemStore.js
+++ b/src/store/modules/Health/SystemStore.js
@@ -3,10 +3,10 @@
 const SystemStore = {
   namespaced: true,
   state: {
-    systems: []
+    systems: [],
   },
   getters: {
-    systems: state => state.systems
+    systems: (state) => state.systems,
   },
   mutations: {
     setSystemInfo: (state, data) => {
@@ -26,16 +26,16 @@
       system.statusState = data.Status.State;
       system.systemType = data.SystemType;
       state.systems = [system];
-    }
+    },
   },
   actions: {
     async getSystem({ commit }) {
       return await api
         .get('/redfish/v1/Systems/system')
         .then(({ data }) => commit('setSystemInfo', data))
-        .catch(error => console.log(error));
-    }
-  }
+        .catch((error) => console.log(error));
+    },
+  },
 };
 
 export default SystemStore;
diff --git a/src/store/plugins/WebSocketPlugin.js b/src/store/plugins/WebSocketPlugin.js
index 1d42067..5780d74 100644
--- a/src/store/plugins/WebSocketPlugin.js
+++ b/src/store/plugins/WebSocketPlugin.js
@@ -9,14 +9,14 @@
  *
  * https://github.com/openbmc/docs/blob/b41aff0fabe137cdb0cfff584b5fe4a41c0c8e77/rest-api.md#event-subscription-protocol
  */
-const WebSocketPlugin = store => {
+const WebSocketPlugin = (store) => {
   let ws;
   const data = {
     paths: ['/xyz/openbmc_project/state/host0', '/xyz/openbmc_project/logging'],
     interfaces: [
       'xyz.openbmc_project.State.Host',
-      'xyz.openbmc_project.Logging.Entry'
-    ]
+      'xyz.openbmc_project.Logging.Entry',
+    ],
   };
 
   const initWebSocket = () => {
@@ -28,10 +28,10 @@
     ws.onopen = () => {
       ws.send(JSON.stringify(data));
     };
-    ws.onerror = event => {
+    ws.onerror = (event) => {
       console.error(event);
     };
-    ws.onmessage = debounce(event => {
+    ws.onmessage = debounce((event) => {
       const data = JSON.parse(event.data);
       const eventInterface = data.interface;
       const path = data.path;
diff --git a/src/utilities/NBDServer.js b/src/utilities/NBDServer.js
index 7c0419a..57c79ce 100644
--- a/src/utilities/NBDServer.js
+++ b/src/utilities/NBDServer.js
@@ -41,7 +41,7 @@
     this.ws = null;
     this.state = NBD_STATE_UNKNOWN;
     this.msgbuf = null;
-    this.start = function() {
+    this.start = function () {
       this.ws = new WebSocket(this.endpoint, [token]);
       this.state = NBD_STATE_OPEN;
       this.ws.binaryType = 'arraybuffer';
@@ -51,17 +51,17 @@
       this.ws.onerror = this._on_ws_error.bind(this);
       this.socketStarted();
     };
-    this.stop = function() {
+    this.stop = function () {
       if (this.ws.readyState == 1) {
         this.ws.close();
         this.state = NBD_STATE_UNKNOWN;
       }
     };
-    this._on_ws_error = function(ev) {
+    this._on_ws_error = function (ev) {
       console.log(`${endpoint} error: ${ev.error}`);
       console.log(JSON.stringify(ev));
     };
-    this._on_ws_close = function(ev) {
+    this._on_ws_close = function (ev) {
       console.log(
         `${endpoint} closed with code: ${ev.code} + reason: ${ev.reason}`
       );
@@ -69,14 +69,14 @@
       this.socketClosed(ev.code);
     };
     /* websocket event handlers */
-    this._on_ws_open = function() {
+    this._on_ws_open = function () {
       console.log(endpoint + ' opened');
       this.client = {
-        flags: 0
+        flags: 0,
       };
       this._negotiate();
     };
-    this._on_ws_message = function(ev) {
+    this._on_ws_message = function (ev) {
       var data = ev.data;
       if (this.msgbuf == null) {
         this.msgbuf = data;
@@ -113,7 +113,7 @@
         }
       }
     };
-    this._negotiate = function() {
+    this._negotiate = function () {
       var buf = new ArrayBuffer(18);
       var data = new DataView(buf, 0, 18);
       /* NBD magic: NBDMAGIC */
@@ -128,7 +128,7 @@
       this.ws.send(buf);
     };
     /* handlers */
-    this._handle_cflags = function(buf) {
+    this._handle_cflags = function (buf) {
       if (buf.byteLength < 4) {
         return 0;
       }
@@ -137,7 +137,7 @@
       this.state = NBD_STATE_WAIT_OPTION;
       return 4;
     };
-    this._handle_option = function(buf) {
+    this._handle_option = function (buf) {
       if (buf.byteLength < 16) return 0;
       var data = new DataView(buf, 0, 16);
       if (data.getUint32(0) != 0x49484156 || data.getUint32(4) != 0x454f5054) {
@@ -179,7 +179,7 @@
       }
       return 16 + len;
     };
-    this._create_cmd_response = function(req, rc, data = null) {
+    this._create_cmd_response = function (req, rc, data = null) {
       var len = 16;
       if (data) len += data.byteLength;
       var resp = new ArrayBuffer(len);
@@ -191,7 +191,7 @@
       if (data) new Uint8Array(resp, 16).set(new Uint8Array(data));
       return resp;
     };
-    this._handle_cmd = function(buf) {
+    this._handle_cmd = function (buf) {
       if (buf.byteLength < 28) {
         return 0;
       }
@@ -207,7 +207,7 @@
         handle_lsB: view.getUint32(12),
         offset_msB: view.getUint32(16),
         offset_lsB: view.getUint32(20),
-        length: view.getUint32(24)
+        length: view.getUint32(24),
       };
       /* we don't support writes, so nothing needs the data at present */
       /* req.data = buf.slice(28); */
@@ -251,7 +251,7 @@
       }
       return consumed;
     };
-    this._handle_cmd_read = function(req) {
+    this._handle_cmd_read = function (req) {
       var offset;
       // eslint-disable-next-line prettier/prettier
       offset = (req.offset_msB * 2 ** 32) + req.offset_lsB;
@@ -261,14 +261,14 @@
       var blob = this.file.slice(offset, offset + req.length);
       var reader = new FileReader();
 
-      reader.onload = function(ev) {
+      reader.onload = function (ev) {
         var reader = ev.target;
         if (reader.readyState != FileReader.DONE) return;
         var resp = this._create_cmd_response(req, 0, reader.result);
         this.ws.send(resp);
       }.bind(this);
 
-      reader.onerror = function(ev) {
+      reader.onerror = function (ev) {
         var reader = ev.target;
         console.log('error reading file: ' + reader.error);
         var resp = this._create_cmd_response(req, EIO);
@@ -277,14 +277,14 @@
       reader.readAsArrayBuffer(blob);
       return 0;
     };
-    this._handle_cmd_disconnect = function() {
+    this._handle_cmd_disconnect = function () {
       this.stop();
       return 0;
     };
     this.recv_handlers = Object.freeze({
       [NBD_STATE_WAIT_CFLAGS]: this._handle_cflags.bind(this),
       [NBD_STATE_WAIT_OPTION]: this._handle_option.bind(this),
-      [NBD_STATE_TRANSMISSION]: this._handle_cmd.bind(this)
+      [NBD_STATE_TRANSMISSION]: this._handle_cmd.bind(this),
     });
   }
 }
diff --git a/src/views/AccessControl/Ldap/Ldap.vue b/src/views/AccessControl/Ldap/Ldap.vue
index 40164a5..2717201 100644
--- a/src/views/AccessControl/Ldap/Ldap.vue
+++ b/src/views/AccessControl/Ldap/Ldap.vue
@@ -96,7 +96,7 @@
                   <b-row>
                     <b-col sm="6" xl="4">
                       <b-form-group label-for="server-uri">
-                        <template v-slot:label>
+                        <template #label>
                           {{ $t('pageLdap.form.serverUri') }}
                           <info-tooltip
                             :title="$t('pageLdap.form.serverUriTooltip')"
@@ -174,7 +174,7 @@
                     </b-col>
                     <b-col sm="6" xl="4">
                       <b-form-group label-for="user-id-attribute">
-                        <template v-slot:label>
+                        <template #label>
                           {{ $t('pageLdap.form.userIdAttribute') }} -
                           <span class="form-text d-inline">
                             {{ $t('global.form.optional') }}
@@ -190,7 +190,7 @@
                     </b-col>
                     <b-col sm="6" xl="4">
                       <b-form-group label-for="group-id-attribute">
-                        <template v-slot:label>
+                        <template #label>
                           {{ $t('pageLdap.form.groupIdAttribute') }} -
                           <span class="form-text d-inline">
                             {{ $t('global.form.optional') }}
@@ -252,9 +252,13 @@
     InputPasswordToggle,
     PageTitle,
     PageSection,
-    TableRoleGroups
+    TableRoleGroups,
   },
   mixins: [BVToastMixin, VuelidateMixin, LoadingBarMixin],
+  beforeRouteLeave(to, from, next) {
+    this.hideLoader();
+    next();
+  },
   data() {
     return {
       form: {
@@ -268,8 +272,8 @@
         bindPassword: '',
         baseDn: '',
         userIdAttribute: '',
-        groupIdAttribute: ''
-      }
+        groupIdAttribute: '',
+      },
     };
   },
   computed: {
@@ -277,70 +281,70 @@
       'isServiceEnabled',
       'isActiveDirectoryEnabled',
       'ldap',
-      'activeDirectory'
+      'activeDirectory',
     ]),
     sslCertificates() {
       return this.$store.getters['sslCertificates/allCertificates'];
     },
     caCertificateExpiration() {
       const caCertificate = find(this.sslCertificates, {
-        type: 'TrustStore Certificate'
+        type: 'TrustStore Certificate',
       });
       if (caCertificate === undefined) return null;
       return caCertificate.validUntil;
     },
     ldapCertificateExpiration() {
       const ldapCertificate = find(this.sslCertificates, {
-        type: 'LDAP Certificate'
+        type: 'LDAP Certificate',
       });
       if (ldapCertificate === undefined) return null;
       return ldapCertificate.validUntil;
     },
     ldapProtocol() {
       return this.form.secureLdapEnabled ? 'ldaps://' : 'ldap://';
-    }
+    },
   },
   watch: {
-    isServiceEnabled: function(value) {
+    isServiceEnabled: function (value) {
       this.form.ldapAuthenticationEnabled = value;
     },
-    isActiveDirectoryEnabled: function(value) {
+    isActiveDirectoryEnabled: function (value) {
       this.form.activeDirectoryEnabled = value;
       this.setFormValues();
-    }
+    },
   },
   validations: {
     form: {
       ldapAuthenticationEnabled: {},
       secureLdapEnabled: {},
       activeDirectoryEnabled: {
-        required: requiredIf(function() {
+        required: requiredIf(function () {
           return this.form.ldapAuthenticationEnabled;
-        })
+        }),
       },
       serverUri: {
-        required: requiredIf(function() {
+        required: requiredIf(function () {
           return this.form.ldapAuthenticationEnabled;
-        })
+        }),
       },
       bindDn: {
-        required: requiredIf(function() {
+        required: requiredIf(function () {
           return this.form.ldapAuthenticationEnabled;
-        })
+        }),
       },
       bindPassword: {
-        required: requiredIf(function() {
+        required: requiredIf(function () {
           return this.form.ldapAuthenticationEnabled;
-        })
+        }),
       },
       baseDn: {
-        required: requiredIf(function() {
+        required: requiredIf(function () {
           return this.form.ldapAuthenticationEnabled;
-        })
+        }),
       },
       userIdAttribute: {},
-      groupIdAttribute: {}
-    }
+      groupIdAttribute: {},
+    },
   },
   created() {
     this.startLoader();
@@ -350,10 +354,6 @@
     this.$store.dispatch('sslCertificates/getCertificates');
     this.setFormValues();
   },
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
   methods: {
     setFormValues(serviceType) {
       if (!serviceType) {
@@ -366,7 +366,7 @@
         bindDn = '',
         baseDn = '',
         userAttribute = '',
-        groupsAttribute = ''
+        groupsAttribute = '',
       } = serviceType;
       const secureLdap =
         serviceAddress && serviceAddress.includes('ldaps://') ? true : false;
@@ -392,12 +392,12 @@
         bindPassword: this.form.bindPassword,
         baseDn: this.form.baseDn,
         userIdAttribute: this.form.userIdAttribute,
-        groupIdAttribute: this.form.groupIdAttribute
+        groupIdAttribute: this.form.groupIdAttribute,
       };
       this.startLoader();
       this.$store
         .dispatch('ldap/saveAccountSettings', data)
-        .then(success => {
+        .then((success) => {
           this.successToast(success);
           this.$v.form.$reset();
         })
@@ -426,7 +426,7 @@
         // disables the service.
         this.setFormValues();
       }
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/AccessControl/Ldap/ModalAddRoleGroup.vue b/src/views/AccessControl/Ldap/ModalAddRoleGroup.vue
index e2da1eb..b9b1f5a 100644
--- a/src/views/AccessControl/Ldap/ModalAddRoleGroup.vue
+++ b/src/views/AccessControl/Ldap/ModalAddRoleGroup.vue
@@ -1,6 +1,6 @@
 <template>
   <b-modal id="modal-role-group" ref="modal" @ok="onOk" @hidden="resetForm">
-    <template v-slot:modal-title>
+    <template #modal-title>
       <template v-if="roleGroup">
         {{ $t('pageLdap.modal.editRoleGroup') }}
       </template>
@@ -49,7 +49,7 @@
                 :state="getValidationState($v.form.groupPrivilege)"
                 @input="$v.form.groupPrivilege.$touch()"
               >
-                <template v-if="!roleGroup" v-slot:first>
+                <template v-if="!roleGroup" #first>
                   <b-form-select-option :value="null" disabled>
                     {{ $t('global.form.selectAnOption') }}
                   </b-form-select-option>
@@ -63,7 +63,7 @@
         </b-col>
       </b-row>
     </b-container>
-    <template v-slot:modal-footer="{ ok, cancel }">
+    <template #modal-footer="{ ok, cancel }">
       <b-button variant="secondary" @click="cancel()">
         {{ $t('global.action.cancel') }}
       </b-button>
@@ -89,47 +89,47 @@
     roleGroup: {
       type: Object,
       default: null,
-      validator: prop => {
+      validator: (prop) => {
         if (prop === null) return true;
         return (
           prop.hasOwnProperty('groupName') &&
           prop.hasOwnProperty('groupPrivilege')
         );
-      }
-    }
+      },
+    },
   },
   data() {
     return {
       form: {
         groupName: null,
-        groupPrivilege: null
-      }
+        groupPrivilege: null,
+      },
     };
   },
   computed: {
     accountRoles() {
       return this.$store.getters['localUsers/accountRoles'];
-    }
+    },
   },
   watch: {
-    roleGroup: function(value) {
+    roleGroup: function (value) {
       if (value === null) return;
       this.form.groupName = value.groupName;
       this.form.groupPrivilege = value.groupPrivilege;
-    }
+    },
   },
   validations() {
     return {
       form: {
         groupName: {
-          required: requiredIf(function() {
+          required: requiredIf(function () {
             return !this.roleGroup;
-          })
+          }),
         },
         groupPrivilege: {
-          required
-        }
-      }
+          required,
+        },
+      },
     };
   },
   methods: {
@@ -139,7 +139,7 @@
       this.$emit('ok', {
         addNew: !this.roleGroup,
         groupName: this.form.groupName,
-        groupPrivilege: this.form.groupPrivilege
+        groupPrivilege: this.form.groupPrivilege,
       });
       this.closeModal();
     },
@@ -158,7 +158,7 @@
       // prevent modal close
       bvModalEvt.preventDefault();
       this.handleSubmit();
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/AccessControl/Ldap/TableRoleGroups.vue b/src/views/AccessControl/Ldap/TableRoleGroups.vue
index 9daf1fd..ef300ea 100644
--- a/src/views/AccessControl/Ldap/TableRoleGroups.vue
+++ b/src/views/AccessControl/Ldap/TableRoleGroups.vue
@@ -43,7 +43,7 @@
           @row-selected="onRowSelected($event, tableItems.length)"
         >
           <!-- Checkbox column -->
-          <template v-slot:head(checkbox)>
+          <template #head(checkbox)>
             <b-form-checkbox
               v-model="tableHeaderCheckboxModel"
               :indeterminate="tableHeaderCheckboxIndeterminate"
@@ -51,7 +51,7 @@
               @change="onChangeHeaderCheckbox($refs.table)"
             />
           </template>
-          <template v-slot:cell(checkbox)="row">
+          <template #cell(checkbox)="row">
             <b-form-checkbox
               v-model="row.rowSelected"
               :disabled="!isServiceEnabled"
@@ -60,7 +60,7 @@
           </template>
 
           <!-- table actions column -->
-          <template v-slot:cell(actions)="{ item }">
+          <template #cell(actions)="{ item }">
             <table-row-action
               v-for="(action, index) in item.actions"
               :key="index"
@@ -69,7 +69,7 @@
               :title="action.title"
               @click:tableAction="onTableRowAction($event, item)"
             >
-              <template v-slot:icon>
+              <template #icon>
                 <icon-edit v-if="action.value === 'edit'" />
                 <icon-trashcan v-if="action.value === 'delete'" />
               </template>
@@ -108,7 +108,7 @@
     IconTrashcan,
     ModalAddRoleGroup,
     TableRowAction,
-    TableToolbar
+    TableToolbar,
   },
   mixins: [BVTableSelectableMixin, BVToastMixin, LoadingBarMixin],
   data() {
@@ -117,31 +117,31 @@
       fields: [
         {
           key: 'checkbox',
-          sortable: false
+          sortable: false,
         },
         {
           key: 'groupName',
           sortable: true,
-          label: this.$t('pageLdap.tableRoleGroups.groupName')
+          label: this.$t('pageLdap.tableRoleGroups.groupName'),
         },
         {
           key: 'groupPrivilege',
           sortable: true,
-          label: this.$t('pageLdap.tableRoleGroups.groupPrivilege')
+          label: this.$t('pageLdap.tableRoleGroups.groupPrivilege'),
         },
         {
           key: 'actions',
           sortable: false,
           label: '',
-          tdClass: 'text-right'
-        }
+          tdClass: 'text-right',
+        },
       ],
       batchActions: [
         {
           value: 'delete',
-          label: this.$t('global.action.delete')
-        }
-      ]
+          label: this.$t('global.action.delete'),
+        },
+      ],
     };
   },
   computed: {
@@ -155,17 +155,17 @@
             {
               value: 'edit',
               title: this.$t('global.action.edit'),
-              enabled: this.isServiceEnabled
+              enabled: this.isServiceEnabled,
             },
             {
               value: 'delete',
               title: this.$t('global.action.delete'),
-              enabled: this.isServiceEnabled
-            }
-          ]
+              enabled: this.isServiceEnabled,
+            },
+          ],
         };
       });
-    }
+    },
   },
   created() {
     this.$store.dispatch('localUsers/getAccountRoles');
@@ -180,17 +180,17 @@
           ),
           {
             title: this.$t('pageLdap.modal.deleteRoleGroup'),
-            okTitle: this.$t('global.action.delete')
+            okTitle: this.$t('global.action.delete'),
           }
         )
-        .then(deleteConfirmed => {
+        .then((deleteConfirmed) => {
           if (deleteConfirmed) {
             this.startLoader();
             this.$store
               .dispatch('ldap/deleteRoleGroup', {
-                roleGroups: this.selectedRows
+                roleGroups: this.selectedRows,
               })
-              .then(success => this.successToast(success))
+              .then((success) => this.successToast(success))
               .catch(({ message }) => this.errorToast(message))
               .finally(() => this.endLoader());
           }
@@ -205,19 +205,19 @@
           this.$bvModal
             .msgBoxConfirm(
               this.$t('pageLdap.modal.deleteRoleGroupConfirmMessage', {
-                groupName: row.groupName
+                groupName: row.groupName,
               }),
               {
                 title: this.$t('pageLdap.modal.deleteRoleGroup'),
-                okTitle: this.$t('global.action.delete')
+                okTitle: this.$t('global.action.delete'),
               }
             )
-            .then(deleteConfirmed => {
+            .then((deleteConfirmed) => {
               if (deleteConfirmed) {
                 this.startLoader();
                 this.$store
                   .dispatch('ldap/deleteRoleGroup', { roleGroups: [row] })
-                  .then(success => this.successToast(success))
+                  .then((success) => this.successToast(success))
                   .catch(({ message }) => this.errorToast(message))
                   .finally(() => this.endLoader());
               }
@@ -236,17 +236,17 @@
       if (addNew) {
         this.$store
           .dispatch('ldap/addNewRoleGroup', data)
-          .then(success => this.successToast(success))
+          .then((success) => this.successToast(success))
           .catch(({ message }) => this.errorToast(message))
           .finally(() => this.endLoader());
       } else {
         this.$store
           .dispatch('ldap/saveRoleGroup', data)
-          .then(success => this.successToast(success))
+          .then((success) => this.successToast(success))
           .catch(({ message }) => this.errorToast(message))
           .finally(() => this.endLoader());
       }
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
index 9978f4a..5c2d7f1 100644
--- a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
+++ b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
@@ -39,7 +39,7 @@
           @row-selected="onRowSelected($event, tableItems.length)"
         >
           <!-- Checkbox column -->
-          <template v-slot:head(checkbox)>
+          <template #head(checkbox)>
             <b-form-checkbox
               v-model="tableHeaderCheckboxModel"
               data-test-id="localUserManagement-checkbox-tableHeaderCheckbox"
@@ -47,7 +47,7 @@
               @change="onChangeHeaderCheckbox($refs.table)"
             />
           </template>
-          <template v-slot:cell(checkbox)="row">
+          <template #cell(checkbox)="row">
             <b-form-checkbox
               v-model="row.rowSelected"
               data-test-id="localUserManagement-checkbox-toggleSelectRow"
@@ -56,7 +56,7 @@
           </template>
 
           <!-- table actions column -->
-          <template v-slot:cell(actions)="{ item }">
+          <template #cell(actions)="{ item }">
             <table-row-action
               v-for="(action, index) in item.actions"
               :key="index"
@@ -65,18 +65,14 @@
               :title="action.title"
               @click:tableAction="onTableRowAction($event, item)"
             >
-              <template v-slot:icon>
+              <template #icon>
                 <icon-edit
                   v-if="action.value === 'edit'"
-                  :data-test-id="
-                    `localUserManagement-tableRowAction-edit-${index}`
-                  "
+                  :data-test-id="`localUserManagement-tableRowAction-edit-${index}`"
                 />
                 <icon-trashcan
                   v-if="action.value === 'delete'"
-                  :data-test-id="
-                    `localUserManagement-tableRowAction-delete-${index}`
-                  "
+                  :data-test-id="`localUserManagement-tableRowAction-delete-${index}`"
                 />
               </template>
             </table-row-action>
@@ -142,48 +138,52 @@
     PageTitle,
     TableRoles,
     TableRowAction,
-    TableToolbar
+    TableToolbar,
   },
   mixins: [BVTableSelectableMixin, BVToastMixin, LoadingBarMixin],
+  beforeRouteLeave(to, from, next) {
+    this.hideLoader();
+    next();
+  },
   data() {
     return {
       activeUser: null,
       fields: [
         {
-          key: 'checkbox'
+          key: 'checkbox',
         },
         {
           key: 'username',
-          label: this.$t('pageLocalUserManagement.table.username')
+          label: this.$t('pageLocalUserManagement.table.username'),
         },
         {
           key: 'privilege',
-          label: this.$t('pageLocalUserManagement.table.privilege')
+          label: this.$t('pageLocalUserManagement.table.privilege'),
         },
         {
           key: 'status',
-          label: this.$t('pageLocalUserManagement.table.status')
+          label: this.$t('pageLocalUserManagement.table.status'),
         },
         {
           key: 'actions',
           label: '',
-          tdClass: 'text-right text-nowrap'
-        }
+          tdClass: 'text-right text-nowrap',
+        },
       ],
       tableToolbarActions: [
         {
           value: 'delete',
-          label: this.$t('global.action.delete')
+          label: this.$t('global.action.delete'),
         },
         {
           value: 'enable',
-          label: this.$t('global.action.enable')
+          label: this.$t('global.action.enable'),
         },
         {
           value: 'disable',
-          label: this.$t('global.action.disable')
-        }
-      ]
+          label: this.$t('global.action.disable'),
+        },
+      ],
     };
   },
   computed: {
@@ -192,7 +192,7 @@
     },
     tableItems() {
       // transform user data to table data
-      return this.allUsers.map(user => {
+      return this.allUsers.map((user) => {
         return {
           username: user.UserName,
           privilege: user.RoleId,
@@ -205,15 +205,15 @@
             {
               value: 'edit',
               enabled: true,
-              title: this.$t('pageLocalUserManagement.editUser')
+              title: this.$t('pageLocalUserManagement.editUser'),
             },
             {
               value: 'delete',
               enabled: user.UserName === 'root' ? false : true,
-              title: this.$tc('pageLocalUserManagement.deleteUser')
-            }
+              title: this.$tc('pageLocalUserManagement.deleteUser'),
+            },
           ],
-          ...user
+          ...user,
         };
       });
     },
@@ -222,7 +222,7 @@
     },
     passwordRequirements() {
       return this.$store.getters['localUsers/accountPasswordRequirements'];
-    }
+    },
   },
   created() {
     this.startLoader();
@@ -230,10 +230,6 @@
     this.$store.dispatch('localUsers/getAccountSettings');
     this.$store.dispatch('localUsers/getAccountRoles');
   },
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
   methods: {
     initModalUser(user) {
       this.activeUser = user;
@@ -243,14 +239,14 @@
       this.$bvModal
         .msgBoxConfirm(
           this.$t('pageLocalUserManagement.modal.deleteConfirmMessage', {
-            user: user.username
+            user: user.username,
           }),
           {
             title: this.$tc('pageLocalUserManagement.deleteUser'),
-            okTitle: this.$tc('pageLocalUserManagement.deleteUser')
+            okTitle: this.$tc('pageLocalUserManagement.deleteUser'),
           }
         )
-        .then(deleteConfirmed => {
+        .then((deleteConfirmed) => {
           if (deleteConfirmed) {
             this.deleteUser(user);
           }
@@ -264,13 +260,13 @@
       if (isNewUser) {
         this.$store
           .dispatch('localUsers/createUser', userData)
-          .then(success => this.successToast(success))
+          .then((success) => this.successToast(success))
           .catch(({ message }) => this.errorToast(message))
           .finally(() => this.endLoader());
       } else {
         this.$store
           .dispatch('localUsers/updateUser', userData)
-          .then(success => this.successToast(success))
+          .then((success) => this.successToast(success))
           .catch(({ message }) => this.errorToast(message))
           .finally(() => this.endLoader());
       }
@@ -279,7 +275,7 @@
       this.startLoader();
       this.$store
         .dispatch('localUsers/deleteUser', username)
-        .then(success => this.successToast(success))
+        .then((success) => this.successToast(success))
         .catch(({ message }) => this.errorToast(message))
         .finally(() => this.endLoader());
     },
@@ -300,15 +296,15 @@
                 okTitle: this.$tc(
                   'pageLocalUserManagement.deleteUser',
                   this.selectedRows.length
-                )
+                ),
               }
             )
-            .then(deleteConfirmed => {
+            .then((deleteConfirmed) => {
               if (deleteConfirmed) {
                 this.startLoader();
                 this.$store
                   .dispatch('localUsers/deleteUsers', this.selectedRows)
-                  .then(messages => {
+                  .then((messages) => {
                     messages.forEach(({ type, message }) => {
                       if (type === 'success') this.successToast(message);
                       if (type === 'error') this.errorToast(message);
@@ -322,7 +318,7 @@
           this.startLoader();
           this.$store
             .dispatch('localUsers/enableUsers', this.selectedRows)
-            .then(messages => {
+            .then((messages) => {
               messages.forEach(({ type, message }) => {
                 if (type === 'success') this.successToast(message);
                 if (type === 'error') this.errorToast(message);
@@ -334,7 +330,7 @@
           this.startLoader();
           this.$store
             .dispatch('localUsers/disableUsers', this.selectedRows)
-            .then(messages => {
+            .then((messages) => {
               messages.forEach(({ type, message }) => {
                 if (type === 'success') this.successToast(message);
                 if (type === 'error') this.errorToast(message);
@@ -360,11 +356,11 @@
       this.startLoader();
       this.$store
         .dispatch('localUsers/saveAccountSettings', settings)
-        .then(message => this.successToast(message))
+        .then((message) => this.successToast(message))
         .catch(({ message }) => this.errorToast(message))
         .finally(() => this.endLoader());
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/views/AccessControl/LocalUserManagement/ModalSettings.vue b/src/views/AccessControl/LocalUserManagement/ModalSettings.vue
index a611c59..89a1ebc 100644
--- a/src/views/AccessControl/LocalUserManagement/ModalSettings.vue
+++ b/src/views/AccessControl/LocalUserManagement/ModalSettings.vue
@@ -19,7 +19,7 @@
                 {{
                   $t('global.form.valueMustBeBetween', {
                     min: 0,
-                    max: 65535
+                    max: 65535,
                   })
                 }}
               </b-form-text>
@@ -39,13 +39,13 @@
                 <template
                   v-if="
                     !$v.form.lockoutThreshold.minLength ||
-                      !$v.form.lockoutThreshold.maxLength
+                    !$v.form.lockoutThreshold.maxLength
                   "
                 >
                   {{
                     $t('global.form.valueMustBeBetween', {
                       min: 0,
-                      max: 65535
+                      max: 65535,
                     })
                   }}
                 </template>
@@ -104,7 +104,7 @@
         </b-row>
       </b-container>
     </b-form>
-    <template v-slot:modal-footer="{ ok, cancel }">
+    <template #modal-footer="{ ok, cancel }">
       <b-button
         variant="secondary"
         data-test-id="localUserManagement-button-cancel"
@@ -131,7 +131,7 @@
   required,
   requiredIf,
   minValue,
-  maxValue
+  maxValue,
 } from 'vuelidate/lib/validators';
 
 export default {
@@ -139,42 +139,42 @@
   props: {
     settings: {
       type: Object,
-      required: true
-    }
+      required: true,
+    },
   },
   data() {
     return {
       form: {
         lockoutThreshold: 0,
         unlockMethod: 0,
-        lockoutDuration: null
-      }
+        lockoutDuration: null,
+      },
     };
   },
   watch: {
-    settings: function({ lockoutThreshold, lockoutDuration }) {
+    settings: function ({ lockoutThreshold, lockoutDuration }) {
       this.form.lockoutThreshold = lockoutThreshold;
       this.form.unlockMethod = lockoutDuration ? 1 : 0;
       this.form.lockoutDuration = lockoutDuration ? lockoutDuration : null;
-    }
+    },
   },
   validations: {
     form: {
       lockoutThreshold: {
         minValue: minValue(0),
         maxValue: maxValue(65535),
-        required
+        required,
       },
       unlockMethod: { required },
       lockoutDuration: {
-        minValue: function(value) {
+        minValue: function (value) {
           return this.form.unlockMethod === 0 || value > 0;
         },
-        required: requiredIf(function() {
+        required: requiredIf(function () {
           return this.form.unlockMethod === 1;
-        })
-      }
-    }
+        }),
+      },
+    },
   },
   methods: {
     handleSubmit() {
@@ -213,7 +213,7 @@
         ? this.settings.lockoutDuration
         : null;
       this.$v.$reset(); // clear validations
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/AccessControl/LocalUserManagement/ModalUser.vue b/src/views/AccessControl/LocalUserManagement/ModalUser.vue
index 0fec894..962718b 100644
--- a/src/views/AccessControl/LocalUserManagement/ModalUser.vue
+++ b/src/views/AccessControl/LocalUserManagement/ModalUser.vue
@@ -1,6 +1,6 @@
 <template>
   <b-modal id="modal-user" ref="modal" @hidden="resetForm">
-    <template v-slot:modal-title>
+    <template #modal-title>
       <template v-if="newUser">
         {{ $t('pageLocalUserManagement.addUser') }}
       </template>
@@ -131,7 +131,7 @@
                 {{
                   $t('pageLocalUserManagement.modal.passwordMustBeBetween', {
                     min: passwordRequirements.minLength,
-                    max: passwordRequirements.maxLength
+                    max: passwordRequirements.maxLength,
                   })
                 }}
               </b-form-text>
@@ -160,7 +160,7 @@
                         'pageLocalUserManagement.modal.passwordMustBeBetween',
                         {
                           min: passwordRequirements.minLength,
-                          max: passwordRequirements.maxLength
+                          max: passwordRequirements.maxLength,
                         }
                       )
                     }}
@@ -200,7 +200,7 @@
         </b-row>
       </b-container>
     </b-form>
-    <template v-slot:modal-footer="{ ok, cancel }">
+    <template #modal-footer="{ ok, cancel }">
       <b-button
         variant="secondary"
         data-test-id="localUserManagement-button-cancel"
@@ -233,7 +233,7 @@
   minLength,
   sameAs,
   helpers,
-  requiredIf
+  requiredIf,
 } from 'vuelidate/lib/validators';
 import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
 import InputPasswordToggle from '@/components/Global/InputPasswordToggle';
@@ -245,12 +245,12 @@
   props: {
     user: {
       type: Object,
-      default: null
+      default: null,
     },
     passwordRequirements: {
       type: Object,
-      required: true
-    }
+      required: true,
+    },
   },
   data() {
     return {
@@ -261,8 +261,8 @@
         privilege: '',
         password: '',
         passwordConfirmation: '',
-        manualUnlock: false
-      }
+        manualUnlock: false,
+      },
     };
   },
   computed: {
@@ -277,46 +277,46 @@
     },
     privilegeTypes() {
       return this.$store.getters['localUsers/accountRoles'];
-    }
+    },
   },
   watch: {
-    user: function(value) {
+    user: function (value) {
       if (value === null) return;
       this.originalUsername = value.username;
       this.form.username = value.username;
       this.form.status = value.Enabled;
       this.form.privilege = value.privilege;
-    }
+    },
   },
   validations() {
     return {
       form: {
         status: {
-          required
+          required,
         },
         username: {
           required,
           maxLength: maxLength(16),
-          pattern: helpers.regex('pattern', /^([a-zA-Z_][a-zA-Z0-9_]*)/)
+          pattern: helpers.regex('pattern', /^([a-zA-Z_][a-zA-Z0-9_]*)/),
         },
         privilege: {
-          required
+          required,
         },
         password: {
-          required: requiredIf(function() {
+          required: requiredIf(function () {
             return this.requirePassword();
           }),
           minLength: minLength(this.passwordRequirements.minLength),
-          maxLength: maxLength(this.passwordRequirements.maxLength)
+          maxLength: maxLength(this.passwordRequirements.maxLength),
         },
         passwordConfirmation: {
-          required: requiredIf(function() {
+          required: requiredIf(function () {
             return this.requirePassword();
           }),
-          sameAsPassword: sameAs('password')
+          sameAsPassword: sameAs('password'),
         },
-        manualUnlock: {}
-      }
+        manualUnlock: {},
+      },
     };
   },
   methods: {
@@ -384,7 +384,7 @@
       // prevent modal close
       bvModalEvt.preventDefault();
       this.handleSubmit();
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/AccessControl/LocalUserManagement/TableRoles.vue b/src/views/AccessControl/LocalUserManagement/TableRoles.vue
index bf300f5..9c2e5fe 100644
--- a/src/views/AccessControl/LocalUserManagement/TableRoles.vue
+++ b/src/views/AccessControl/LocalUserManagement/TableRoles.vue
@@ -1,21 +1,21 @@
 <template>
   <b-table stacked="sm" hover small :items="items" :fields="fields">
-    <template v-slot:cell(administrator)="data">
+    <template #cell(administrator)="data">
       <template v-if="data.value">
         <checkmark20 />
       </template>
     </template>
-    <template v-slot:cell(operator)="data">
+    <template #cell(operator)="data">
       <template v-if="data.value">
         <checkmark20 />
       </template>
     </template>
-    <template v-slot:cell(readonly)="data">
+    <template #cell(readonly)="data">
       <template v-if="data.value">
         <checkmark20 />
       </template>
     </template>
-    <template v-slot:cell(noaccess)="data">
+    <template #cell(noaccess)="data">
       <template v-if="data.value">
         <checkmark20 />
       </template>
@@ -28,7 +28,7 @@
 
 export default {
   components: {
-    Checkmark20
+    Checkmark20,
   },
   data() {
     return {
@@ -40,7 +40,7 @@
           administrator: true,
           operator: false,
           readonly: false,
-          noaccess: false
+          noaccess: false,
         },
         {
           description: this.$t(
@@ -49,7 +49,7 @@
           administrator: true,
           operator: false,
           readonly: false,
-          noaccess: false
+          noaccess: false,
         },
         {
           description: this.$t(
@@ -58,7 +58,7 @@
           administrator: true,
           operator: true,
           readonly: true,
-          noaccess: false
+          noaccess: false,
         },
         {
           description: this.$t(
@@ -67,7 +67,7 @@
           administrator: true,
           operator: false,
           readonly: false,
-          noaccess: false
+          noaccess: false,
         },
         {
           description: this.$t(
@@ -76,7 +76,7 @@
           administrator: true,
           operator: true,
           readonly: true,
-          noaccess: false
+          noaccess: false,
         },
         {
           description: this.$t(
@@ -85,7 +85,7 @@
           administrator: true,
           operator: true,
           readonly: true,
-          noaccess: false
+          noaccess: false,
         },
         {
           description: this.$t(
@@ -94,7 +94,7 @@
           administrator: true,
           operator: true,
           readonly: true,
-          noaccess: false
+          noaccess: false,
         },
         {
           description: this.$t(
@@ -103,7 +103,7 @@
           administrator: true,
           operator: false,
           readonly: false,
-          noaccess: false
+          noaccess: false,
         },
         {
           description: this.$t(
@@ -112,17 +112,17 @@
           administrator: true,
           operator: true,
           readonly: true,
-          noaccess: false
-        }
+          noaccess: false,
+        },
       ],
       fields: [
         { key: 'description', label: 'Privilege' },
         { key: 'administrator', label: 'Administrator', class: 'text-center' },
         { key: 'operator', label: 'Operator', class: 'text-center' },
         { key: 'readonly', label: 'ReadOnly', class: 'text-center' },
-        { key: 'noaccess', label: 'NoAccess', class: 'text-center' }
-      ]
+        { key: 'noaccess', label: 'NoAccess', class: 'text-center' },
+      ],
     };
-  }
+  },
 };
 </script>
diff --git a/src/views/AccessControl/SslCertificates/CsrCountryCodes.js b/src/views/AccessControl/SslCertificates/CsrCountryCodes.js
index 59e724b..a2d7000 100644
--- a/src/views/AccessControl/SslCertificates/CsrCountryCodes.js
+++ b/src/views/AccessControl/SslCertificates/CsrCountryCodes.js
@@ -30,12 +30,12 @@
   {
     name: 'Bonaire, Sint Eustatius and Saba',
     code: 'BQ',
-    label: i18n.t('countries.BQ')
+    label: i18n.t('countries.BQ'),
   },
   {
     name: 'Bosnia and Herzegovina ',
     code: 'BA',
-    label: i18n.t('countries.BA')
+    label: i18n.t('countries.BA'),
   },
   { name: 'Bostwana', code: 'BW', label: i18n.t('countries.BW') },
   { name: 'Bouvet Island', code: 'BV', label: i18n.t('countries.BV') },
@@ -43,7 +43,7 @@
   {
     name: 'British Indian Ocean Territory',
     code: 'IO',
-    label: i18n.t('countries.IO')
+    label: i18n.t('countries.IO'),
   },
   { name: 'Brunei Darussalam ', code: 'BN', label: i18n.t('countries.BN') },
   { name: 'Bulgaria', code: 'BG', label: i18n.t('countries.BG') },
@@ -57,7 +57,7 @@
   {
     name: 'Central African Republic',
     code: 'CF',
-    label: i18n.t('countries.CF')
+    label: i18n.t('countries.CF'),
   },
   { name: 'Chad', code: 'TD', label: i18n.t('countries.TD') },
   { name: 'Chile', code: 'CL', label: i18n.t('countries.CL') },
@@ -69,7 +69,7 @@
   {
     name: 'Congo, The Democratic Republic of the',
     code: 'CD',
-    label: i18n.t('countries.CD')
+    label: i18n.t('countries.CD'),
   },
   { name: 'Congo', code: 'CG', label: i18n.t('countries.CG') },
   { name: 'Cook Islands', code: 'CK', label: i18n.t('countries.CK') },
@@ -95,7 +95,7 @@
   {
     name: 'Falkland Islands (Malvinas)',
     code: 'FK',
-    label: i18n.t('countries.FK')
+    label: i18n.t('countries.FK'),
   },
   { name: 'Faroe Islands', code: 'FO', label: i18n.t('countries.FO') },
   { name: 'Fiji', code: 'FJ', label: i18n.t('countries.FJ') },
@@ -106,7 +106,7 @@
   {
     name: 'French Southern Territories',
     code: 'TF',
-    label: i18n.t('countries.TF')
+    label: i18n.t('countries.TF'),
   },
   { name: 'Gabon', code: 'GA', label: i18n.t('countries.GA') },
   { name: 'Gambia, The', code: 'GM', label: i18n.t('countries.GM') },
@@ -128,7 +128,7 @@
   {
     name: 'Heard Island and McDonald Islands',
     code: 'HM',
-    label: i18n.t('countries.HM')
+    label: i18n.t('countries.HM'),
   },
   { name: 'Holy See', code: 'VA', label: i18n.t('countries.VA') },
   { name: 'Honduras', code: 'HN', label: i18n.t('countries.HN') },
@@ -140,7 +140,7 @@
   {
     name: 'Iran, Islamic Republic of',
     code: 'IR',
-    label: i18n.t('countries.IR')
+    label: i18n.t('countries.IR'),
   },
   { name: 'Iraq', code: 'IQ', label: i18n.t('countries.IQ') },
   { name: 'Ireland', code: 'IE', label: i18n.t('countries.IE') },
@@ -158,14 +158,14 @@
   {
     name: "Korea, Democratic People's Republic of",
     code: 'KP',
-    label: i18n.t('countries.KP')
+    label: i18n.t('countries.KP'),
   },
   { name: 'Kuwait', code: 'KW', label: i18n.t('countries.KW') },
   { name: 'Kyrgyzstan', code: 'KG', label: i18n.t('countries.KG') },
   {
     name: "Lao People's Democratic Republic",
     code: 'LA',
-    label: i18n.t('countries.LA')
+    label: i18n.t('countries.LA'),
   },
   { name: 'Latvia', code: 'LV', label: i18n.t('countries.LV') },
   { name: 'Lebanon', code: 'LB', label: i18n.t('countries.LB') },
@@ -179,7 +179,7 @@
   {
     name: 'Macedonia, The Former Yugoslav Republic of',
     code: 'MK',
-    label: i18n.t('countries.MK')
+    label: i18n.t('countries.MK'),
   },
   { name: 'Madagascar', code: 'MG', label: i18n.t('countries.MG') },
   { name: 'Malawi', code: 'MW', label: i18n.t('countries.MW') },
@@ -196,7 +196,7 @@
   {
     name: 'Micronesia, Federated States of',
     code: 'FM',
-    label: i18n.t('countries.FM')
+    label: i18n.t('countries.FM'),
   },
   { name: 'Moldova, Republic of', code: 'MD', label: i18n.t('countries.MD') },
   { name: 'Monaco', code: 'MC', label: i18n.t('countries.MC') },
@@ -220,7 +220,7 @@
   {
     name: 'Northern Mariana Islands',
     code: 'MP',
-    label: i18n.t('countries.MP')
+    label: i18n.t('countries.MP'),
   },
   { name: 'Norway', code: 'NO', label: i18n.t('countries.NO') },
   { name: 'Oman', code: 'OM', label: i18n.t('countries.OM') },
@@ -245,7 +245,7 @@
   {
     name: 'Saint Helena, Ascension and Tristan da Cunha',
     code: 'SH',
-    label: i18n.t('countries.SH')
+    label: i18n.t('countries.SH'),
   },
   { name: 'Saint Kitts and Nevis ', code: 'KN', label: i18n.t('countries.KN') },
   { name: 'Saint Lucia', code: 'LC', label: i18n.t('countries.LC') },
@@ -253,12 +253,12 @@
   {
     name: 'Saint Pierre and Miquelon',
     code: 'PM',
-    label: i18n.t('countries.PM')
+    label: i18n.t('countries.PM'),
   },
   {
     name: 'Saint Vincent and the Grenadines',
     code: 'VC',
-    label: i18n.t('countries.VC')
+    label: i18n.t('countries.VC'),
   },
   { name: 'Samoa', code: 'WS', label: i18n.t('countries.WS') },
   { name: 'San Marino ', code: 'SM', label: i18n.t('countries.SM') },
@@ -278,7 +278,7 @@
   {
     name: 'South Georgia and the South Sandwich Islands',
     code: 'GS',
-    label: i18n.t('countries.GS')
+    label: i18n.t('countries.GS'),
   },
   { name: 'South Sudan', code: 'SS', label: i18n.t('countries.SS') },
   { name: 'Spain', code: 'ES', label: i18n.t('countries.ES') },
@@ -294,7 +294,7 @@
   {
     name: 'Tanzania, United Republic of',
     code: 'TZ',
-    label: i18n.t('countries.TZ')
+    label: i18n.t('countries.TZ'),
   },
   { name: 'Thailand', code: 'TH', label: i18n.t('countries.TH') },
   { name: 'Timor-Leste', code: 'TL', label: i18n.t('countries.TL') },
@@ -308,7 +308,7 @@
   {
     name: 'Turks and Caicos Islands',
     code: 'TC',
-    label: i18n.t('countries.TC')
+    label: i18n.t('countries.TC'),
   },
   { name: 'Tuvalu', code: 'TV', label: i18n.t('countries.TV') },
   { name: 'Uganda', code: 'UG', label: i18n.t('countries.UG') },
@@ -318,12 +318,12 @@
   {
     name: 'United States Minor Outlying Islands',
     code: 'UM',
-    label: i18n.t('countries.UM')
+    label: i18n.t('countries.UM'),
   },
   {
     name: 'United States of America',
     code: 'US',
-    label: i18n.t('countries.US')
+    label: i18n.t('countries.US'),
   },
   { name: 'Uruguay', code: 'UY', label: i18n.t('countries.UY') },
   { name: 'Uzbekistan', code: 'UZ', label: i18n.t('countries.UZ') },
@@ -333,7 +333,7 @@
   {
     name: 'Virgin Islands, British',
     code: 'VG',
-    label: i18n.t('countries.VG')
+    label: i18n.t('countries.VG'),
   },
   { name: 'Virgin Islands, U.S', code: 'VI', label: i18n.t('countries.VI') },
   { name: 'Wallis and Futuna', code: 'WF', label: i18n.t('countries.WF') },
@@ -341,5 +341,5 @@
   { name: 'Yemen', code: 'YE', label: i18n.t('countries.YE') },
   { name: 'Zambia', code: 'ZM', label: i18n.t('countries.ZM') },
   { name: 'Zimbabwe', code: 'ZW', label: i18n.t('countries.ZW') },
-  { name: 'Åland Islands', code: 'AX', label: i18n.t('countries.AX') }
+  { name: 'Åland Islands', code: 'AX', label: i18n.t('countries.AX') },
 ];
diff --git a/src/views/AccessControl/SslCertificates/ModalGenerateCsr.vue b/src/views/AccessControl/SslCertificates/ModalGenerateCsr.vue
index 84f14c3..da6b457 100644
--- a/src/views/AccessControl/SslCertificates/ModalGenerateCsr.vue
+++ b/src/views/AccessControl/SslCertificates/ModalGenerateCsr.vue
@@ -30,7 +30,7 @@
                       :state="getValidationState($v.form.certificateType)"
                       @input="$v.form.certificateType.$touch()"
                     >
-                      <template v-slot:first>
+                      <template #first>
                         <b-form-select-option :value="null" disabled>
                           {{ $t('global.form.selectAnOption') }}
                         </b-form-select-option>
@@ -54,7 +54,7 @@
                       :state="getValidationState($v.form.country)"
                       @input="$v.form.country.$touch()"
                     >
-                      <template v-slot:first>
+                      <template #first>
                         <b-form-select-option :value="null" disabled>
                           {{ $t('global.form.selectAnOption') }}
                         </b-form-select-option>
@@ -158,7 +158,7 @@
                 </b-col>
                 <b-col lg="6">
                   <b-form-group label-for="challenge-password">
-                    <template v-slot:label>
+                    <template #label>
                       {{ $t('pageSslCertificates.modal.challengePassword') }} -
                       <span class="form-text d-inline">
                         {{ $t('global.form.optional') }}
@@ -176,7 +176,7 @@
               <b-row>
                 <b-col lg="6">
                   <b-form-group label-for="contact-person">
-                    <template v-slot:label>
+                    <template #label>
                       {{ $t('pageSslCertificates.modal.contactPerson') }} -
                       <span class="form-text d-inline">
                         {{ $t('global.form.optional') }}
@@ -192,7 +192,7 @@
                 </b-col>
                 <b-col lg="6">
                   <b-form-group label-for="email-address">
-                    <template v-slot:label>
+                    <template #label>
                       {{ $t('pageSslCertificates.modal.emailAddress') }} -
                       <span class="form-text d-inline">
                         {{ $t('global.form.optional') }}
@@ -210,7 +210,7 @@
               <b-row>
                 <b-col lg="12">
                   <b-form-group label-for="alternate-name">
-                    <template v-slot:label>
+                    <template #label>
                       {{ $t('pageSslCertificates.modal.alternateName') }} -
                       <span class="form-text d-inline">
                         {{ $t('global.form.optional') }}
@@ -229,14 +229,14 @@
                       size="lg"
                       separator=" "
                       :input-attrs="{
-                        'aria-describedby': 'alternate-name-help-block'
+                        'aria-describedby': 'alternate-name-help-block',
                       }"
                       :duplicate-tag-text="
                         $t('pageSslCertificates.modal.duplicateAlternateName')
                       "
                       placeholder=""
                     >
-                      <template v-slot:add-button-text>
+                      <template #add-button-text>
                         {{ $t('global.action.add') }} <icon-add />
                       </template>
                     </b-form-tags>
@@ -262,7 +262,7 @@
                       :state="getValidationState($v.form.keyPairAlgorithm)"
                       @input="$v.form.keyPairAlgorithm.$touch()"
                     >
-                      <template v-slot:first>
+                      <template #first>
                         <b-form-select-option :value="null" disabled>
                           {{ $t('global.form.selectAnOption') }}
                         </b-form-select-option>
@@ -289,7 +289,7 @@
                         :state="getValidationState($v.form.keyCurveId)"
                         @input="$v.form.keyCurveId.$touch()"
                       >
-                        <template v-slot:first>
+                        <template #first>
                           <b-form-select-option :value="null" disabled>
                             {{ $t('global.form.selectAnOption') }}
                           </b-form-select-option>
@@ -313,7 +313,7 @@
                         :state="getValidationState($v.form.keyBitLength)"
                         @input="$v.form.keyBitLength.$touch()"
                       >
-                        <template v-slot:first>
+                        <template #first>
                           <b-form-select-option :value="null" disabled>
                             {{ $t('global.form.selectAnOption') }}
                           </b-form-select-option>
@@ -330,7 +330,7 @@
           </b-row>
         </b-container>
       </b-form>
-      <template v-slot:modal-footer="{ ok, cancel }">
+      <template #modal-footer="{ ok, cancel }">
         <b-button variant="secondary" @click="cancel()">
           {{ $t('global.action.cancel') }}
         </b-button>
@@ -353,7 +353,7 @@
       @hidden="onHiddenCsrStringModal"
     >
       {{ csrString }}
-      <template v-slot:modal-footer>
+      <template #modal-footer>
         <b-btn variant="secondary" @click="copyCsrString">
           <template v-if="csrStringCopied">
             <icon-checkmark />
@@ -406,25 +406,25 @@
         alternateName: [],
         keyPairAlgorithm: null,
         keyCurveId: null,
-        keyBitLength: null
+        keyBitLength: null,
       },
       certificateOptions: CERTIFICATE_TYPES.reduce((arr, cert) => {
         if (cert.type === 'TrustStore Certificate') return arr;
         arr.push({
           text: cert.label,
-          value: cert.type
+          value: cert.type,
         });
         return arr;
       }, []),
-      countryOptions: COUNTRY_LIST.map(country => ({
+      countryOptions: COUNTRY_LIST.map((country) => ({
         text: country.label,
-        value: country.code
+        value: country.code,
       })),
       keyPairAlgorithmOptions: ['EC', 'RSA'],
       keyCurveIdOptions: ['prime256v1', 'secp521r1', 'secp384r1'],
       keyBitLengthOptions: [2048],
       csrString: '',
-      csrStringCopied: false
+      csrStringCopied: false,
     };
   },
   validations: {
@@ -442,16 +442,16 @@
       alternateName: {},
       keyPairAlgorithm: { required },
       keyCurveId: {
-        reuired: requiredIf(function(form) {
+        reuired: requiredIf(function (form) {
           return form.keyPairAlgorithm === 'EC';
-        })
+        }),
       },
       keyBitLength: {
-        reuired: requiredIf(function(form) {
+        reuired: requiredIf(function (form) {
           return form.keyPairAlgorithm === 'RSA';
-        })
-      }
-    }
+        }),
+      },
+    },
   },
   methods: {
     handleSubmit() {
@@ -493,7 +493,7 @@
           this.csrStringCopied = false;
         }, 5000 /*5 seconds*/);
       });
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/AccessControl/SslCertificates/ModalUploadCertificate.vue b/src/views/AccessControl/SslCertificates/ModalUploadCertificate.vue
index 63c3b4e..070dd0d 100644
--- a/src/views/AccessControl/SslCertificates/ModalUploadCertificate.vue
+++ b/src/views/AccessControl/SslCertificates/ModalUploadCertificate.vue
@@ -1,6 +1,6 @@
 <template>
   <b-modal id="upload-certificate" ref="modal" @ok="onOk" @hidden="resetForm">
-    <template v-slot:modal-title>
+    <template #modal-title>
       <template v-if="certificate">
         {{ $t('pageSslCertificates.replaceCertificate') }}
       </template>
@@ -59,7 +59,7 @@
         </b-form-invalid-feedback>
       </b-form-group>
     </b-form>
-    <template v-slot:modal-ok>
+    <template #modal-ok>
       <template v-if="certificate">
         {{ $t('global.action.replace') }}
       </template>
@@ -80,20 +80,20 @@
     certificate: {
       type: Object,
       default: null,
-      validator: prop => {
+      validator: (prop) => {
         if (prop === null) return true;
         return (
           prop.hasOwnProperty('type') && prop.hasOwnProperty('certificate')
         );
-      }
-    }
+      },
+    },
   },
   data() {
     return {
       form: {
         certificateType: null,
-        file: null
-      }
+        file: null,
+      },
     };
   },
   computed: {
@@ -104,30 +104,30 @@
       return this.certificateTypes.map(({ type, label }) => {
         return {
           text: label,
-          value: type
+          value: type,
         };
       });
-    }
+    },
   },
   watch: {
-    certificateOptions: function(options) {
+    certificateOptions: function (options) {
       if (options.length) {
         this.form.certificateType = options[0].value;
       }
-    }
+    },
   },
   validations() {
     return {
       form: {
         certificateType: {
-          required: requiredIf(function() {
+          required: requiredIf(function () {
             return !this.certificate;
-          })
+          }),
         },
         file: {
-          required
-        }
-      }
+          required,
+        },
+      },
     };
   },
   methods: {
@@ -140,7 +140,7 @@
         location: this.certificate ? this.certificate.location : null,
         type: this.certificate
           ? this.certificate.type
-          : this.form.certificateType
+          : this.form.certificateType,
       });
       this.closeModal();
     },
@@ -160,7 +160,7 @@
       // prevent modal close
       bvModalEvt.preventDefault();
       this.handleSubmit();
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/AccessControl/SslCertificates/SslCertificates.vue b/src/views/AccessControl/SslCertificates/SslCertificates.vue
index bce50d7..fe63bd9 100644
--- a/src/views/AccessControl/SslCertificates/SslCertificates.vue
+++ b/src/views/AccessControl/SslCertificates/SslCertificates.vue
@@ -11,7 +11,7 @@
           <template v-else>
             {{
               $t('pageSslCertificates.alert.certificateExpiredMessage', {
-                certificate: expiredCertificateTypes[0]
+                certificate: expiredCertificateTypes[0],
               })
             }}
           </template>
@@ -24,7 +24,7 @@
           <template v-else>
             {{
               $t('pageSslCertificates.alert.certificateExpiringMessage', {
-                certificate: expiringCertificateTypes[0]
+                certificate: expiringCertificateTypes[0],
               })
             }}
           </template>
@@ -61,11 +61,11 @@
           :items="tableItems"
           :empty-text="$t('global.table.emptyMessage')"
         >
-          <template v-slot:cell(validFrom)="{ value }">
+          <template #cell(validFrom)="{ value }">
             {{ value | formatDate }}
           </template>
 
-          <template v-slot:cell(validUntil)="{ value }">
+          <template #cell(validUntil)="{ value }">
             <status-icon
               v-if="getDaysUntilExpired(value) < 31"
               :status="getIconStatus(value)"
@@ -73,7 +73,7 @@
             {{ value | formatDate }}
           </template>
 
-          <template v-slot:cell(actions)="{ value, item }">
+          <template #cell(actions)="{ value, item }">
             <table-row-action
               v-for="(action, index) in value"
               :key="index"
@@ -82,7 +82,7 @@
               :enabled="action.enabled"
               @click:tableAction="onTableRowAction($event, item)"
             >
-              <template v-slot:icon>
+              <template #icon>
                 <icon-replace v-if="action.value === 'replace'" />
                 <icon-trashcan v-if="action.value === 'delete'" />
               </template>
@@ -124,39 +124,43 @@
     ModalUploadCertificate,
     PageTitle,
     StatusIcon,
-    TableRowAction
+    TableRowAction,
   },
   mixins: [BVToastMixin, LoadingBarMixin],
+  beforeRouteLeave(to, from, next) {
+    this.hideLoader();
+    next();
+  },
   data() {
     return {
       modalCertificate: null,
       fields: [
         {
           key: 'certificate',
-          label: this.$t('pageSslCertificates.table.certificate')
+          label: this.$t('pageSslCertificates.table.certificate'),
         },
         {
           key: 'issuedBy',
-          label: this.$t('pageSslCertificates.table.issuedBy')
+          label: this.$t('pageSslCertificates.table.issuedBy'),
         },
         {
           key: 'issuedTo',
-          label: this.$t('pageSslCertificates.table.issuedTo')
+          label: this.$t('pageSslCertificates.table.issuedTo'),
         },
         {
           key: 'validFrom',
-          label: this.$t('pageSslCertificates.table.validFrom')
+          label: this.$t('pageSslCertificates.table.validFrom'),
         },
         {
           key: 'validUntil',
-          label: this.$t('pageSslCertificates.table.validUntil')
+          label: this.$t('pageSslCertificates.table.validUntil'),
         },
         {
           key: 'actions',
           label: '',
-          tdClass: 'text-right text-nowrap'
-        }
-      ]
+          tdClass: 'text-right text-nowrap',
+        },
+      ],
     };
   },
   computed: {
@@ -164,21 +168,21 @@
       return this.$store.getters['sslCertificates/allCertificates'];
     },
     tableItems() {
-      return this.certificates.map(certificate => {
+      return this.certificates.map((certificate) => {
         return {
           ...certificate,
           actions: [
             {
               value: 'replace',
-              title: this.$t('pageSslCertificates.replaceCertificate')
+              title: this.$t('pageSslCertificates.replaceCertificate'),
             },
             {
               value: 'delete',
               title: this.$t('pageSslCertificates.deleteCertificate'),
               enabled:
-                certificate.type === 'TrustStore Certificate' ? true : false
-            }
-          ]
+                certificate.type === 'TrustStore Certificate' ? true : false,
+            },
+          ],
         };
       });
     },
@@ -205,7 +209,7 @@
         }
         return acc;
       }, []);
-    }
+    },
   },
   async created() {
     this.startLoader();
@@ -214,10 +218,6 @@
       .dispatch('sslCertificates/getCertificates')
       .finally(() => this.endLoader());
   },
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
   methods: {
     onTableRowAction(event, rowItem) {
       switch (event) {
@@ -240,14 +240,14 @@
         .msgBoxConfirm(
           this.$t('pageSslCertificates.modal.deleteConfirmMessage', {
             issuedBy: certificate.issuedBy,
-            certificate: certificate.certificate
+            certificate: certificate.certificate,
           }),
           {
             title: this.$t('pageSslCertificates.deleteCertificate'),
-            okTitle: this.$t('global.action.delete')
+            okTitle: this.$t('global.action.delete'),
           }
         )
-        .then(deleteConfirmed => {
+        .then((deleteConfirmed) => {
           if (deleteConfirmed) this.deleteCertificate(certificate);
         });
     },
@@ -264,7 +264,7 @@
       this.startLoader();
       this.$store
         .dispatch('sslCertificates/addNewCertificate', { file, type })
-        .then(success => this.successToast(success))
+        .then((success) => this.successToast(success))
         .catch(({ message }) => this.errorToast(message))
         .finally(() => this.endLoader());
     },
@@ -272,15 +272,15 @@
       this.startLoader();
       const reader = new FileReader();
       reader.readAsBinaryString(file);
-      reader.onloadend = event => {
+      reader.onloadend = (event) => {
         const certificateString = event.target.result;
         this.$store
           .dispatch('sslCertificates/replaceCertificate', {
             certificateString,
             type,
-            location
+            location,
           })
-          .then(success => this.successToast(success))
+          .then((success) => this.successToast(success))
           .catch(({ message }) => this.errorToast(message))
           .finally(() => this.endLoader());
       };
@@ -290,9 +290,9 @@
       this.$store
         .dispatch('sslCertificates/deleteCertificate', {
           type,
-          location
+          location,
         })
-        .then(success => this.successToast(success))
+        .then((success) => this.successToast(success))
         .catch(({ message }) => this.errorToast(message))
         .finally(() => this.endLoader());
     },
@@ -312,7 +312,7 @@
       } else if (daysUntilExpired < 31) {
         return 'warning';
       }
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/ChangePassword/ChangePassword.vue b/src/views/ChangePassword/ChangePassword.vue
index fbf95d9..039dd0b 100644
--- a/src/views/ChangePassword/ChangePassword.vue
+++ b/src/views/ChangePassword/ChangePassword.vue
@@ -84,10 +84,10 @@
     return {
       form: {
         password: null,
-        passwordConfirm: null
+        passwordConfirm: null,
       },
       username: this.$store.getters['global/username'],
-      changePasswordError: false
+      changePasswordError: false,
     };
   },
   validations() {
@@ -96,9 +96,9 @@
         password: { required },
         passwordConfirm: {
           required,
-          sameAsPassword: sameAs('password')
-        }
-      }
+          sameAsPassword: sameAs('password'),
+        },
+      },
     };
   },
   methods: {
@@ -111,15 +111,15 @@
       if (this.$v.$invalid) return;
       let data = {
         originalUsername: this.username,
-        password: this.form.password
+        password: this.form.password,
       };
 
       this.$store
         .dispatch('localUsers/updateUser', data)
         .then(() => this.$router.push('/'))
         .catch(() => (this.changePasswordError = true));
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/views/Configuration/DateTimeSettings/DateTimeSettings.vue b/src/views/Configuration/DateTimeSettings/DateTimeSettings.vue
index 33e097c..79cdbc1 100644
--- a/src/views/Configuration/DateTimeSettings/DateTimeSettings.vue
+++ b/src/views/Configuration/DateTimeSettings/DateTimeSettings.vue
@@ -84,7 +84,7 @@
                     button-variant="link"
                     aria-controls="input-manual-date"
                   >
-                    <template v-slot:button-content>
+                    <template #button-content>
                       <icon-calendar
                         :title="$t('global.calendar.openDatePicker')"
                         aria-hidden="true"
@@ -227,8 +227,12 @@
     BVToastMixin,
     LoadingBarMixin,
     LocalTimezoneLabelMixin,
-    VuelidateMixin
+    VuelidateMixin,
   ],
+  beforeRouteLeave(to, from, next) {
+    this.hideLoader();
+    next();
+  },
   data() {
     return {
       locale: this.$store.getters['global/languagePreference'],
@@ -236,10 +240,10 @@
         configurationSelected: '',
         manual: {
           date: '',
-          time: ''
+          time: '',
         },
-        ntp: { firstAddress: '', secondAddress: '', thirdAddress: '' }
-      }
+        ntp: { firstAddress: '', secondAddress: '', thirdAddress: '' },
+      },
     };
   },
   validations() {
@@ -247,28 +251,28 @@
       form: {
         manual: {
           date: {
-            required: requiredIf(function() {
+            required: requiredIf(function () {
               return this.form.configurationSelected === 'manual';
             }),
-            pattern: helpers.regex('pattern', isoDateRegex)
+            pattern: helpers.regex('pattern', isoDateRegex),
           },
           time: {
-            required: requiredIf(function() {
+            required: requiredIf(function () {
               return this.form.configurationSelected === 'manual';
             }),
-            pattern: helpers.regex('pattern', isoTimeRegex)
-          }
+            pattern: helpers.regex('pattern', isoTimeRegex),
+          },
         },
         ntp: {
           firstAddress: {
-            required: requiredIf(function() {
+            required: requiredIf(function () {
               return this.form.configurationSelected === 'ntp';
-            })
+            }),
           },
           secondAddress: {},
-          thirdAddress: {}
-        }
-      }
+          thirdAddress: {},
+        },
+      },
     };
   },
   computed: {
@@ -284,7 +288,7 @@
         return 'UTC';
       }
       return this.localOffset();
-    }
+    },
   },
   watch: {
     ntpServers() {
@@ -300,25 +304,21 @@
       this.form.manual.time = this.$options.filters
         .formatTime(this.$store.getters['global/bmcTime'])
         .slice(0, 5);
-    }
+    },
   },
   created() {
     this.startLoader();
     Promise.all([
       this.$store.dispatch('global/getBmcTime'),
-      this.$store.dispatch('dateTime/getNtpData')
+      this.$store.dispatch('dateTime/getNtpData'),
     ]).finally(() => this.endLoader());
   },
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
   methods: {
     emitChange() {
       if (this.$v.$invalid) return;
       this.$v.$reset(); //reset to re-validate on blur
       this.$emit('change', {
-        manualDate: this.manualDate ? new Date(this.manualDate) : null
+        manualDate: this.manualDate ? new Date(this.manualDate) : null,
       });
     },
     setNtpValues() {
@@ -367,13 +367,13 @@
         dateTimeForm.ntpServersArray = [
           ntpFirstAddress,
           ntpSecondAddress,
-          ntpThirdAddress
+          ntpThirdAddress,
         ];
       }
 
       this.$store
         .dispatch('dateTime/updateDateTimeSettings', dateTimeForm)
-        .then(success => {
+        .then((success) => {
           this.successToast(success);
           if (!isNTPEnabled) return;
           // Shift address up if second address is empty
@@ -407,7 +407,7 @@
         timeArray[1] // User input minute
       );
       return new Date(utcDate);
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Configuration/Firmware/Firmware.vue b/src/views/Configuration/Firmware/Firmware.vue
index e1f97c4..48c29eb 100644
--- a/src/views/Configuration/Firmware/Firmware.vue
+++ b/src/views/Configuration/Firmware/Firmware.vue
@@ -8,7 +8,7 @@
           <b-card-group deck>
             <!-- Current FW -->
             <b-card header-bg-variant="success">
-              <template v-slot:header>
+              <template #header>
                 <dl class="mb-0">
                   <dt>{{ $t('pageFirmware.current') }}</dt>
                   <dd class="mb-0">{{ bmcFirmwareCurrentVersion }}</dd>
@@ -18,12 +18,12 @@
                 <dt>{{ $t('pageFirmware.state') }}:</dt>
                 <dd>{{ bmcFirmwareCurrentState }}</dd>
               </dl>
-              <template v-slot:footer></template>
+              <template #footer></template>
             </b-card>
 
             <!-- Backup FW -->
             <b-card footer-class="p-0">
-              <template v-slot:header>
+              <template #header>
                 <dl class="mb-0">
                   <dt>{{ $t('pageFirmware.backup') }}</dt>
                   <dd class="mb-0">{{ bmcFirmwareBackupVersion }}</dd>
@@ -33,7 +33,7 @@
                 <dt>{{ $t('pageFirmware.state') }}:</dt>
                 <dd>{{ bmcFirmwareBackupState }}</dd>
               </dl>
-              <template v-slot:footer>
+              <template #footer>
                 <b-btn
                   v-b-modal.modal-reboot-backup-bmc
                   :disabled="!bmcFirmwareBackupVersion"
@@ -53,7 +53,7 @@
           <b-card-group deck>
             <!-- Current FW -->
             <b-card header-bg-variant="success">
-              <template v-slot:header>
+              <template #header>
                 <dl class="mb-0">
                   <dt>{{ $t('pageFirmware.current') }}</dt>
                   <dd class="mb-0">{{ hostFirmwareCurrentVersion }}</dd>
@@ -68,7 +68,7 @@
 
             <!-- Backup FW -->
             <b-card>
-              <template v-slot:header>
+              <template #header>
                 <dl class="mb-0">
                   <dt>{{ $t('pageFirmware.backup') }}</dt>
                   <dd class="mb-0">{{ hostFirmwareBackupVersion }}</dd>
@@ -212,16 +212,21 @@
     ModalRebootBackupBmc,
     ModalUpload,
     PageSection,
-    PageTitle
+    PageTitle,
   },
   mixins: [BVToastMixin, LoadingBarMixin, VuelidateMixin],
+  beforeRouteLeave(to, from, next) {
+    this.hideLoader();
+    this.clearRebootTimeout();
+    next();
+  },
   data() {
     return {
       isWorkstationSelected: true,
       file: null,
       tftpIpAddress: null,
       tftpFileName: null,
-      timeoutId: null
+      timeoutId: null,
     };
   },
   computed: {
@@ -233,16 +238,16 @@
       'hostFirmwareCurrentVersion',
       'hostFirmwareCurrentState',
       'hostFirmwareBackupVersion',
-      'hostFirmwareBackupState'
-    ])
+      'hostFirmwareBackupState',
+    ]),
   },
   watch: {
-    isWorkstationSelected: function() {
+    isWorkstationSelected: function () {
       this.$v.$reset();
       this.file = null;
       this.tftpIpAddress = null;
       this.tftpFileName = null;
-    }
+    },
   },
   created() {
     this.startLoader();
@@ -251,28 +256,23 @@
       .dispatch('firmware/getFirmwareInformation')
       .finally(() => this.endLoader());
   },
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    this.clearRebootTimeout();
-    next();
-  },
   validations() {
     return {
       file: {
-        required: requiredIf(function() {
+        required: requiredIf(function () {
           return this.isWorkstationSelected;
-        })
+        }),
       },
       tftpIpAddress: {
-        required: requiredIf(function() {
+        required: requiredIf(function () {
           return !this.isWorkstationSelected;
-        })
+        }),
       },
       tftpFileName: {
-        required: requiredIf(function() {
+        required: requiredIf(function () {
           return !this.isWorkstationSelected;
-        })
-      }
+        }),
+      },
     };
   },
   methods: {
@@ -292,7 +292,7 @@
     dispatchWorkstationUpload() {
       this.$store
         .dispatch('firmware/uploadFirmware', this.file)
-        .then(success =>
+        .then((success) =>
           this.infoToast(
             success,
             this.$t('pageFirmware.toast.successUploadTitle')
@@ -306,11 +306,11 @@
     dispatchTftpUpload() {
       const data = {
         address: this.tftpIpAddress,
-        filename: this.tftpFileName
+        filename: this.tftpFileName,
       };
       this.$store
         .dispatch('firmware/uploadFirmwareTFTP', data)
-        .then(success =>
+        .then((success) =>
           this.infoToast(
             success,
             this.$t('pageFirmware.toast.successUploadTitle')
@@ -325,7 +325,7 @@
       this.setRebootTimeout();
       this.$store
         .dispatch('firmware/switchBmcFirmware')
-        .then(success =>
+        .then((success) =>
           this.infoToast(success, this.$t('global.status.success'))
         )
         .catch(({ message }) => {
@@ -355,8 +355,8 @@
       this.$v.$touch();
       if (this.$v.$invalid) return;
       this.$bvModal.show('modal-upload');
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/views/Configuration/Firmware/FirmwareModalRebootBackupBmc.vue b/src/views/Configuration/Firmware/FirmwareModalRebootBackupBmc.vue
index 06ab65d..8f9a8f8 100644
--- a/src/views/Configuration/Firmware/FirmwareModalRebootBackupBmc.vue
+++ b/src/views/Configuration/Firmware/FirmwareModalRebootBackupBmc.vue
@@ -22,12 +22,12 @@
   props: {
     current: {
       type: String,
-      required: true
+      required: true,
     },
     backup: {
       type: String,
-      required: true
-    }
-  }
+      required: true,
+    },
+  },
 };
 </script>
diff --git a/src/views/Configuration/NetworkSettings/NetworkSettings.vue b/src/views/Configuration/NetworkSettings/NetworkSettings.vue
index 4a181fd..303077c 100644
--- a/src/views/Configuration/NetworkSettings/NetworkSettings.vue
+++ b/src/views/Configuration/NetworkSettings/NetworkSettings.vue
@@ -109,14 +109,14 @@
                 :items="form.ipv4StaticTableItems"
                 class="mb-0"
               >
-                <template v-slot:cell(Address)="{ item, index }">
+                <template #cell(Address)="{ item, index }">
                   <b-form-input
                     v-model.trim="item.Address"
                     :data-test-id="`networkSettings-input-staticIpv4-${index}`"
                     :aria-label="
                       $t('pageNetworkSettings.ariaLabel.staticIpv4AddressRow') +
-                        ' ' +
-                        (index + 1)
+                      ' ' +
+                      (index + 1)
                     "
                     :readonly="dhcpEnabled"
                     :state="
@@ -149,14 +149,14 @@
                     </div>
                   </b-form-invalid-feedback>
                 </template>
-                <template v-slot:cell(SubnetMask)="{ item, index }">
+                <template #cell(SubnetMask)="{ item, index }">
                   <b-form-input
                     v-model.trim="item.SubnetMask"
                     :data-test-id="`networkSettings-input-subnetMask-${index}`"
                     :aria-label="
                       $t('pageNetworkSettings.ariaLabel.staticIpv4SubnetRow') +
-                        ' ' +
-                        (index + 1)
+                      ' ' +
+                      (index + 1)
                     "
                     :readonly="dhcpEnabled"
                     :state="
@@ -190,7 +190,7 @@
                     </div>
                   </b-form-invalid-feedback>
                 </template>
-                <template v-slot:cell(actions)="{ item, index }">
+                <template #cell(actions)="{ item, index }">
                   <table-row-action
                     v-for="(action, actionIndex) in item.actions"
                     :key="actionIndex"
@@ -200,7 +200,7 @@
                       onDeleteIpv4StaticTableRow($event, index)
                     "
                   >
-                    <template v-slot:icon>
+                    <template #icon>
                       <icon-trashcan v-if="action.value === 'delete'" />
                     </template>
                   </table-row-action>
@@ -223,14 +223,14 @@
                 :items="form.dnsStaticTableItems"
                 class="mb-0"
               >
-                <template v-slot:cell(address)="{ item, index }">
+                <template #cell(address)="{ item, index }">
                   <b-form-input
                     v-model.trim="item.address"
                     :data-test-id="`networkSettings-input-dnsAddress-${index}`"
                     :aria-label="
                       $t('pageNetworkSettings.ariaLabel.staticDnsRow') +
-                        ' ' +
-                        (index + 1)
+                      ' ' +
+                      (index + 1)
                     "
                     :readonly="dhcpEnabled"
                     :state="
@@ -263,7 +263,7 @@
                     </div>
                   </b-form-invalid-feedback>
                 </template>
-                <template v-slot:cell(actions)="{ item, index }">
+                <template #cell(actions)="{ item, index }">
                   <table-row-action
                     v-for="(action, actionIndex) in item.actions"
                     :key="actionIndex"
@@ -271,7 +271,7 @@
                     :title="action.title"
                     @click:tableAction="onDeleteDnsTableRow($event, index)"
                   >
-                    <template v-slot:icon>
+                    <template #icon>
                       <icon-trashcan v-if="action.value === 'delete'" />
                     </template>
                   </table-row-action>
@@ -327,9 +327,13 @@
     PageSection,
     TableRowAction,
     IconTrashcan,
-    IconAdd
+    IconAdd,
   },
   mixins: [BVToastMixin, VuelidateMixin, LoadingBarMixin],
+  beforeRouteLeave(to, from, next) {
+    this.hideLoader();
+    next();
+  },
   data() {
     return {
       dhcpEnabled: null,
@@ -337,20 +341,20 @@
       ipv4StaticTableFields: [
         {
           key: 'Address',
-          label: this.$t('pageNetworkSettings.table.ipAddress')
+          label: this.$t('pageNetworkSettings.table.ipAddress'),
         },
         {
           key: 'SubnetMask',
-          label: this.$t('pageNetworkSettings.table.subnet')
+          label: this.$t('pageNetworkSettings.table.subnet'),
         },
-        { key: 'actions', label: '', tdClass: 'text-right' }
+        { key: 'actions', label: '', tdClass: 'text-right' },
       ],
       dnsTableFields: [
         {
           key: 'address',
-          label: this.$t('pageNetworkSettings.table.ipAddress')
+          label: this.$t('pageNetworkSettings.table.ipAddress'),
         },
-        { key: 'actions', label: '', tdClass: 'text-right' }
+        { key: 'actions', label: '', tdClass: 'text-right' },
       ],
       selectedInterfaceIndex: 0,
       selectedInterface: {},
@@ -359,8 +363,8 @@
         hostname: '',
         macAddress: '',
         ipv4StaticTableItems: [],
-        dnsStaticTableItems: []
-      }
+        dnsStaticTableItems: [],
+      },
     };
   },
   validations() {
@@ -372,45 +376,45 @@
           $each: {
             Address: {
               required,
-              validateAddress
+              validateAddress,
             },
             SubnetMask: {
               required,
-              validateAddress
-            }
-          }
+              validateAddress,
+            },
+          },
         },
         macAddress: { required, validateMacAddress },
         dnsStaticTableItems: {
           $each: {
             address: {
               required,
-              validateAddress
-            }
-          }
-        }
-      }
+              validateAddress,
+            },
+          },
+        },
+      },
     };
   },
   computed: {
     ...mapState('networkSettings', [
       'ethernetData',
       'interfaceOptions',
-      'defaultGateway'
+      'defaultGateway',
     ]),
     interfaceSelectOptions() {
       return this.interfaceOptions.map((option, index) => {
         return {
           text: option,
-          value: index
+          value: index,
         };
       });
-    }
+    },
   },
   watch: {
-    ethernetData: function() {
+    ethernetData: function () {
       this.selectInterface();
-    }
+    },
   },
   created() {
     this.startLoader();
@@ -418,10 +422,6 @@
       .dispatch('networkSettings/getEthernetData')
       .finally(() => this.endLoader());
   },
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
   methods: {
     selectInterface() {
       this.selectedInterface = this.ethernetData[this.selectedInterfaceIndex];
@@ -437,16 +437,16 @@
     },
     getDnsStaticTableItems() {
       const dns = this.selectedInterface.StaticNameServers || [];
-      this.form.dnsStaticTableItems = dns.map(server => {
+      this.form.dnsStaticTableItems = dns.map((server) => {
         return {
           address: server,
           actions: [
             {
               value: 'delete',
               enabled: this.dhcpEnabled,
-              title: this.$t('pageNetworkSettings.table.deleteDns')
-            }
-          ]
+              title: this.$t('pageNetworkSettings.table.deleteDns'),
+            },
+          ],
         };
       });
     },
@@ -458,9 +458,9 @@
           {
             value: 'delete',
             enabled: this.dhcpEnabled,
-            title: this.$t('pageNetworkSettings.table.deleteDns')
-          }
-        ]
+            title: this.$t('pageNetworkSettings.table.deleteDns'),
+          },
+        ],
       });
     },
     deleteDnsTableRow(index) {
@@ -472,7 +472,7 @@
     },
     getIpv4StaticTableItems() {
       const addresses = this.selectedInterface.IPv4StaticAddresses || [];
-      this.form.ipv4StaticTableItems = addresses.map(ipv4 => {
+      this.form.ipv4StaticTableItems = addresses.map((ipv4) => {
         return {
           Address: ipv4.Address,
           SubnetMask: ipv4.SubnetMask,
@@ -480,9 +480,9 @@
             {
               value: 'delete',
               enabled: this.dhcpEnabled,
-              title: this.$t('pageNetworkSettings.table.deleteStaticIpv4')
-            }
-          ]
+              title: this.$t('pageNetworkSettings.table.deleteStaticIpv4'),
+            },
+          ],
         };
       });
     },
@@ -495,9 +495,9 @@
           {
             value: 'delete',
             enabled: this.dhcpEnabled,
-            title: this.$t('pageNetworkSettings.table.deleteStaticIpv4')
-          }
-        ]
+            title: this.$t('pageNetworkSettings.table.deleteStaticIpv4'),
+          },
+        ],
       });
     },
     deleteIpv4StaticTableRow(index) {
@@ -522,17 +522,17 @@
         hostname,
         macAddress,
         selectedInterfaceIndex,
-        isDhcpEnabled
+        isDhcpEnabled,
       };
       networkSettingsForm.staticIpv4 = this.form.ipv4StaticTableItems.map(
-        updateIpv4 => {
+        (updateIpv4) => {
           delete updateIpv4.actions;
           updateIpv4.Gateway = this.form.gateway;
           return updateIpv4;
         }
       );
       networkSettingsForm.staticNameServers = this.form.dnsStaticTableItems.map(
-        updateDns => {
+        (updateDns) => {
           return updateDns.address;
         }
       );
@@ -541,7 +541,7 @@
           'networkSettings/updateInterfaceSettings',
           networkSettingsForm
         )
-        .then(success => {
+        .then((success) => {
           this.successToast(success);
         })
         .catch(({ message }) => this.errorToast(message))
@@ -549,7 +549,7 @@
           this.$v.form.$reset();
           this.endLoader();
         });
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Control/Kvm/Kvm.vue b/src/views/Control/Kvm/Kvm.vue
index 66b2e5f..10322bd 100644
--- a/src/views/Control/Kvm/Kvm.vue
+++ b/src/views/Control/Kvm/Kvm.vue
@@ -13,7 +13,7 @@
 
 export default {
   name: 'Kvm',
-  components: { PageTitle, KvmConsole }
+  components: { PageTitle, KvmConsole },
 };
 </script>
 
diff --git a/src/views/Control/Kvm/KvmConsole.vue b/src/views/Control/Kvm/KvmConsole.vue
index 8438b35..43dc727 100644
--- a/src/views/Control/Kvm/KvmConsole.vue
+++ b/src/views/Control/Kvm/KvmConsole.vue
@@ -60,8 +60,8 @@
   props: {
     isFullWindow: {
       type: Boolean,
-      default: true
-    }
+      default: true,
+    },
   },
   data() {
     return {
@@ -70,7 +70,7 @@
       terminalClass: this.isFullWindow ? 'full-window' : '',
       marginClass: this.isFullWindow ? 'margin-left-full-window' : '',
       status: Connecting,
-      convasRef: null
+      convasRef: null,
     };
   },
   computed: {
@@ -89,7 +89,7 @@
         return this.$t('pageKvm.disconnected');
       }
       return this.$t('pageKvm.connecting');
-    }
+    },
   },
   mounted() {
     this.openTerminal();
@@ -141,8 +141,8 @@
         '_blank',
         'directories=no,titlebar=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=yes,width=700,height=550'
       );
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/views/Control/ManagePowerUsage/ManagePowerUsage.vue b/src/views/Control/ManagePowerUsage/ManagePowerUsage.vue
index 5a7eed0..5fcf938 100644
--- a/src/views/Control/ManagePowerUsage/ManagePowerUsage.vue
+++ b/src/views/Control/ManagePowerUsage/ManagePowerUsage.vue
@@ -46,7 +46,7 @@
                 {{
                   $t('pageManagePowerUsage.powerCapLabelTextInfo', {
                     min: 1,
-                    max: 10000
+                    max: 10000,
                   })
                 }}
               </b-form-text>
@@ -97,9 +97,13 @@
   name: 'ManagePowerUsage',
   components: { PageTitle },
   mixins: [VuelidateMixin, BVToastMixin, LoadingBarMixin],
+  beforeRouteLeave(to, from, next) {
+    this.hideLoader();
+    next();
+  },
   computed: {
     ...mapGetters({
-      powerConsumptionValue: 'powerControl/powerConsumptionValue'
+      powerConsumptionValue: 'powerControl/powerConsumptionValue',
     }),
 
     /**
@@ -114,7 +118,7 @@
         let newValue = value ? '' : null;
         this.$v.$reset();
         this.$store.dispatch('powerControl/setPowerCapUpdatedValue', newValue);
-      }
+      },
     },
     powerCapValue: {
       get() {
@@ -123,8 +127,8 @@
       set(value) {
         this.$v.$touch();
         this.$store.dispatch('powerControl/setPowerCapUpdatedValue', value);
-      }
-    }
+      },
+    },
   },
   created() {
     this.startLoader();
@@ -132,17 +136,13 @@
       .dispatch('powerControl/getPowerControl')
       .finally(() => this.endLoader());
   },
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
   validations: {
     powerCapValue: {
       between: between(1, 10000),
-      required: requiredIf(function() {
+      required: requiredIf(function () {
         return this.isPowerCapFieldEnabled;
-      })
-    }
+      }),
+    },
   },
   methods: {
     submitForm() {
@@ -151,10 +151,10 @@
       this.startLoader();
       this.$store
         .dispatch('powerControl/setPowerControl', this.powerCapValue)
-        .then(message => this.successToast(message))
+        .then((message) => this.successToast(message))
         .catch(({ message }) => this.errorToast(message))
         .finally(() => this.endLoader());
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Control/RebootBmc/RebootBmc.vue b/src/views/Control/RebootBmc/RebootBmc.vue
index 2993253..03880b3 100644
--- a/src/views/Control/RebootBmc/RebootBmc.vue
+++ b/src/views/Control/RebootBmc/RebootBmc.vue
@@ -43,10 +43,14 @@
   name: 'RebootBmc',
   components: { PageTitle, PageSection },
   mixins: [BVToastMixin, LoadingBarMixin],
+  beforeRouteLeave(to, from, next) {
+    this.hideLoader();
+    next();
+  },
   computed: {
     lastBmcRebootTime() {
       return this.$store.getters['controls/lastBmcRebootTime'];
-    }
+    },
   },
   created() {
     this.startLoader();
@@ -54,28 +58,24 @@
       .dispatch('controls/getLastBmcRebootTime')
       .finally(() => this.endLoader());
   },
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
   methods: {
     onClick() {
       this.$bvModal
         .msgBoxConfirm(this.$t('pageRebootBmc.modal.confirmMessage'), {
           title: this.$t('pageRebootBmc.modal.confirmTitle'),
-          okTitle: this.$t('global.action.confirm')
+          okTitle: this.$t('global.action.confirm'),
         })
-        .then(confirmed => {
+        .then((confirmed) => {
           if (confirmed) this.rebootBmc();
         });
     },
     rebootBmc() {
       this.$store
         .dispatch('controls/rebootBmc')
-        .then(message => this.successToast(message))
+        .then((message) => this.successToast(message))
         .catch(({ message }) => this.errorToast(message));
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/views/Control/SerialOverLan/SerialOverLan.vue b/src/views/Control/SerialOverLan/SerialOverLan.vue
index 037a496..48a6834 100644
--- a/src/views/Control/SerialOverLan/SerialOverLan.vue
+++ b/src/views/Control/SerialOverLan/SerialOverLan.vue
@@ -18,7 +18,7 @@
   components: {
     PageSection,
     PageTitle,
-    SerialOverLanConsole
-  }
+    SerialOverLanConsole,
+  },
 };
 </script>
diff --git a/src/views/Control/SerialOverLan/SerialOverLanConsole.vue b/src/views/Control/SerialOverLan/SerialOverLanConsole.vue
index d5e9b21..b734bb1 100644
--- a/src/views/Control/SerialOverLan/SerialOverLanConsole.vue
+++ b/src/views/Control/SerialOverLan/SerialOverLanConsole.vue
@@ -42,13 +42,13 @@
   name: 'SerialOverLanConsole',
   components: {
     IconLaunch,
-    StatusIcon
+    StatusIcon,
   },
   props: {
     isFullWindow: {
       type: Boolean,
-      default: true
-    }
+      default: true,
+    },
   },
   computed: {
     hostStatus() {
@@ -61,7 +61,7 @@
       return this.hostStatus === 'on'
         ? this.$t('pageSerialOverLan.connected')
         : this.$t('pageSerialOverLan.disconnected');
-    }
+    },
   },
   created() {
     this.$store.dispatch('global/getHostStatus');
@@ -74,7 +74,7 @@
       const token = this.$store.getters['authentication/token'];
 
       const ws = new WebSocket(`wss://${window.location.host}/console0`, [
-        token
+        token,
       ]);
 
       // Refer https://github.com/xtermjs/xterm.js/ for xterm implementation and addons.
@@ -82,7 +82,7 @@
       const term = new Terminal({
         fontSize: 15,
         fontFamily:
-          'SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace'
+          'SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace',
       });
 
       const attachAddon = new AttachAddon(ws);
@@ -94,7 +94,7 @@
       const SOL_THEME = {
         background: '#19273c',
         cursor: 'rgba(83, 146, 255, .5)',
-        scrollbar: 'rgba(83, 146, 255, .5)'
+        scrollbar: 'rgba(83, 146, 255, .5)',
       };
       term.setOption('theme', SOL_THEME);
 
@@ -102,10 +102,10 @@
       fitAddon.fit();
 
       try {
-        ws.onopen = function() {
+        ws.onopen = function () {
           console.log('websocket console0/ opened');
         };
-        ws.onclose = function(event) {
+        ws.onclose = function (event) {
           console.log(
             'websocket console0/ closed. code: ' +
               event.code +
@@ -123,8 +123,8 @@
         '_blank',
         'directories=no,titlebar=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=yes,width=600,height=550'
       );
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/views/Control/ServerLed/ServerLed.vue b/src/views/Control/ServerLed/ServerLed.vue
index b2eab0e..73ec704 100644
--- a/src/views/Control/ServerLed/ServerLed.vue
+++ b/src/views/Control/ServerLed/ServerLed.vue
@@ -38,6 +38,10 @@
   name: 'ServerLed',
   components: { PageTitle, PageSection },
   mixins: [LoadingBarMixin, BVToastMixin],
+  beforeRouteLeave(to, from, next) {
+    this.hideLoader();
+    next();
+  },
   computed: {
     indicatorLed: {
       get() {
@@ -45,8 +49,8 @@
       },
       set(newValue) {
         return newValue;
-      }
-    }
+      },
+    },
   },
   created() {
     this.startLoader();
@@ -54,15 +58,11 @@
       .dispatch('serverLed/getIndicatorValue')
       .finally(() => this.endLoader());
   },
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
   methods: {
     changeLedValue(indicatorLed) {
       this.$store
         .dispatch('serverLed/saveIndicatorLedValue', indicatorLed)
-        .then(message => this.successToast(message))
+        .then((message) => this.successToast(message))
         .catch(({ message }) => {
           this.errorToast(message);
           if (indicatorLed === 'Off') {
@@ -71,7 +71,7 @@
             this.indicatorLed === 'Off';
           }
         });
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Control/ServerPowerOperations/BootSettings.vue b/src/views/Control/ServerPowerOperations/BootSettings.vue
index 3435f1c..a94da0c 100644
--- a/src/views/Control/ServerPowerOperations/BootSettings.vue
+++ b/src/views/Control/ServerPowerOperations/BootSettings.vue
@@ -62,8 +62,8 @@
       form: {
         bootOption: this.$store.getters['hostBootSettings/bootSource'],
         oneTimeBoot: this.$store.getters['hostBootSettings/overrideEnabled'],
-        tpmPolicyOn: this.$store.getters['hostBootSettings/tpmEnabled']
-      }
+        tpmPolicyOn: this.$store.getters['hostBootSettings/tpmEnabled'],
+      },
     };
   },
   computed: {
@@ -71,19 +71,19 @@
       'bootSourceOptions',
       'bootSource',
       'overrideEnabled',
-      'tpmEnabled'
-    ])
+      'tpmEnabled',
+    ]),
   },
   watch: {
-    bootSource: function(value) {
+    bootSource: function (value) {
       this.form.bootOption = value;
     },
-    overrideEnabled: function(value) {
+    overrideEnabled: function (value) {
       this.form.oneTimeBoot = value;
     },
-    tpmEnabled: function(value) {
+    tpmEnabled: function (value) {
       this.form.tpmPolicyOn = value;
-    }
+    },
   },
   validations: {
     // Empty validations to leverage vuelidate form states
@@ -91,13 +91,13 @@
     form: {
       bootOption: {},
       oneTimeBoot: {},
-      tpmPolicyOn: {}
-    }
+      tpmPolicyOn: {},
+    },
   },
   created() {
     Promise.all([
       this.$store.dispatch('hostBootSettings/getBootSettings'),
-      this.$store.dispatch('hostBootSettings/getTpmPolicy')
+      this.$store.dispatch('hostBootSettings/getTpmPolicy'),
     ]).finally(() =>
       this.$root.$emit('serverPowerOperations::bootSettings::complete')
     );
@@ -124,7 +124,7 @@
 
       this.$store
         .dispatch('hostBootSettings/saveSettings', settings)
-        .then(message => this.successToast(message))
+        .then((message) => this.successToast(message))
         .catch(({ message }) => this.errorToast(message))
         .finally(() => {
           this.$v.form.$reset();
@@ -135,7 +135,7 @@
       this.$v.form.bootOption.$touch();
       // Disable one time boot if selected boot option is 'None'
       if (selectedOption === 'None') this.form.oneTimeBoot = false;
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Control/ServerPowerOperations/ServerPowerOperations.vue b/src/views/Control/ServerPowerOperations/ServerPowerOperations.vue
index 32b2ea8..9bc259f 100644
--- a/src/views/Control/ServerPowerOperations/ServerPowerOperations.vue
+++ b/src/views/Control/ServerPowerOperations/ServerPowerOperations.vue
@@ -148,12 +148,16 @@
   name: 'ServerPowerOperations',
   components: { PageTitle, PageSection, BootSettings, Alert },
   mixins: [BVToastMixin, LoadingBarMixin],
+  beforeRouteLeave(to, from, next) {
+    this.hideLoader();
+    next();
+  },
   data() {
     return {
       form: {
         rebootOption: 'orderly',
-        shutdownOption: 'orderly'
-      }
+        shutdownOption: 'orderly',
+      },
     };
   },
   computed: {
@@ -168,24 +172,20 @@
     },
     oneTimeBootEnabled() {
       return this.$store.getters['hostBootSettings/overrideEnabled'];
-    }
+    },
   },
   created() {
     this.startLoader();
-    const bootSettingsPromise = new Promise(resolve => {
+    const bootSettingsPromise = new Promise((resolve) => {
       this.$root.$on('serverPowerOperations::bootSettings::complete', () =>
         resolve()
       );
     });
     Promise.all([
       this.$store.dispatch('controls/getLastPowerOperationTime'),
-      bootSettingsPromise
+      bootSettingsPromise,
     ]).finally(() => this.endLoader());
   },
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
   methods: {
     powerOn() {
       this.$store.dispatch('controls/hostPowerOn');
@@ -196,19 +196,19 @@
       );
       const modalOptions = {
         title: this.$t('pageServerPowerOperations.modal.confirmRebootTitle'),
-        okTitle: this.$t('global.action.confirm')
+        okTitle: this.$t('global.action.confirm'),
       };
 
       if (this.form.rebootOption === 'orderly') {
         this.$bvModal
           .msgBoxConfirm(modalMessage, modalOptions)
-          .then(confirmed => {
+          .then((confirmed) => {
             if (confirmed) this.$store.dispatch('controls/hostSoftReboot');
           });
       } else if (this.form.rebootOption === 'immediate') {
         this.$bvModal
           .msgBoxConfirm(modalMessage, modalOptions)
-          .then(confirmed => {
+          .then((confirmed) => {
             if (confirmed) this.$store.dispatch('controls/hostHardReboot');
           });
       }
@@ -219,24 +219,24 @@
       );
       const modalOptions = {
         title: this.$t('pageServerPowerOperations.modal.confirmShutdownTitle'),
-        okTitle: this.$t('global.action.confirm')
+        okTitle: this.$t('global.action.confirm'),
       };
 
       if (this.form.shutdownOption === 'orderly') {
         this.$bvModal
           .msgBoxConfirm(modalMessage, modalOptions)
-          .then(confirmed => {
+          .then((confirmed) => {
             if (confirmed) this.$store.dispatch('controls/hostSoftPowerOff');
           });
       }
       if (this.form.shutdownOption === 'immediate') {
         this.$bvModal
           .msgBoxConfirm(modalMessage, modalOptions)
-          .then(confirmed => {
+          .then((confirmed) => {
             if (confirmed) this.$store.dispatch('controls/hostHardPowerOff');
           });
       }
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Control/VirtualMedia/ModalConfigureConnection.vue b/src/views/Control/VirtualMedia/ModalConfigureConnection.vue
index 2c75ae2..2190773 100644
--- a/src/views/Control/VirtualMedia/ModalConfigureConnection.vue
+++ b/src/views/Control/VirtualMedia/ModalConfigureConnection.vue
@@ -6,7 +6,7 @@
     @hidden="resetForm"
     @show="initModal"
   >
-    <template v-slot:modal-title>
+    <template #modal-title>
       {{ $t('pageVirtualMedia.modal.title') }}
     </template>
     <b-form>
@@ -60,7 +60,7 @@
         </b-form-checkbox>
       </b-form-group>
     </b-form>
-    <template v-slot:modal-ok>
+    <template #modal-ok>
       {{ $t('global.action.save') }}
     </template>
   </b-modal>
@@ -76,11 +76,11 @@
     connection: {
       type: Object,
       default: null,
-      validator: prop => {
+      validator: (prop) => {
         console.log(prop);
         return true;
-      }
-    }
+      },
+    },
   },
   data() {
     return {
@@ -88,23 +88,23 @@
         serverUri: null,
         username: null,
         password: null,
-        isRW: false
-      }
+        isRW: false,
+      },
     };
   },
   watch: {
-    connection: function(value) {
+    connection: function (value) {
       if (value === null) return;
       Object.assign(this.form, value);
-    }
+    },
   },
   validations() {
     return {
       form: {
         serverUri: {
-          required
-        }
-      }
+          required,
+        },
+      },
     };
   },
   methods: {
@@ -136,7 +136,7 @@
     onOk(bvModalEvt) {
       bvModalEvt.preventDefault();
       this.handleSubmit();
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Control/VirtualMedia/VirtualMedia.vue b/src/views/Control/VirtualMedia/VirtualMedia.vue
index 5460eb4..a15f2cd 100644
--- a/src/views/Control/VirtualMedia/VirtualMedia.vue
+++ b/src/views/Control/VirtualMedia/VirtualMedia.vue
@@ -111,7 +111,9 @@
     return {
       modalConfigureConnection: null,
       loadImageFromExternalServer:
-        process.env.VUE_APP_VIRTUAL_MEDIA_LIST_ENABLED === 'true' ? true : false
+        process.env.VUE_APP_VIRTUAL_MEDIA_LIST_ENABLED === 'true'
+          ? true
+          : false,
     };
   },
   computed: {
@@ -120,7 +122,7 @@
     },
     legacyDevices() {
       return this.$store.getters['virtualMedia/legacyDevices'];
-    }
+    },
   },
   created() {
     if (this.proxyDevices.length > 0 || this.legacyDevices.length > 0) return;
@@ -142,7 +144,7 @@
         this.successToast(this.$t('pageVirtualMedia.toast.serverRunning'));
       device.nbd.errorReadingFile = () =>
         this.errorToast(this.$t('pageVirtualMedia.toast.errorReadingFile'));
-      device.nbd.socketClosed = code => {
+      device.nbd.socketClosed = (code) => {
         if (code === 1000)
           this.successToast(
             this.$t('pageVirtualMedia.toast.serverClosedSuccessfully')
@@ -171,7 +173,7 @@
       this.$store
         .dispatch('virtualMedia/mountImage', {
           id: connectionData.id,
-          data: data
+          data: data,
         })
         .then(() => {
           this.successToast(
@@ -208,7 +210,7 @@
     configureConnection(connectionData) {
       this.modalConfigureConnection = connectionData;
       this.$bvModal.show('configure-connection');
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Health/EventLogs/EventLogs.vue b/src/views/Health/EventLogs/EventLogs.vue
index c345d8f..90f589a 100644
--- a/src/views/Health/EventLogs/EventLogs.vue
+++ b/src/views/Health/EventLogs/EventLogs.vue
@@ -33,7 +33,7 @@
           @clearSelected="clearSelectedRows($refs.table)"
           @batchAction="onBatchAction"
         >
-          <template v-slot:export>
+          <template #export>
             <table-toolbar-export
               :data="batchExportData"
               :file-name="exportFileNameByDate()"
@@ -64,7 +64,7 @@
           @row-selected="onRowSelected($event, filteredLogs.length)"
         >
           <!-- Checkbox column -->
-          <template v-slot:head(checkbox)>
+          <template #head(checkbox)>
             <b-form-checkbox
               v-model="tableHeaderCheckboxModel"
               data-test-id="eventLogs-checkbox-selectAll"
@@ -72,7 +72,7 @@
               @change="onChangeHeaderCheckbox($refs.table)"
             />
           </template>
-          <template v-slot:cell(checkbox)="row">
+          <template #cell(checkbox)="row">
             <b-form-checkbox
               v-model="row.rowSelected"
               :data-test-id="`eventLogs-checkbox-selectRow-${row.index}`"
@@ -81,19 +81,19 @@
           </template>
 
           <!-- Severity column -->
-          <template v-slot:cell(severity)="{ value }">
+          <template #cell(severity)="{ value }">
             <status-icon v-if="value" :status="statusIcon(value)" />
             {{ value }}
           </template>
 
           <!-- Date column -->
-          <template v-slot:cell(date)="{ value }">
+          <template #cell(date)="{ value }">
             <p class="mb-0">{{ value | formatDate }}</p>
             <p class="mb-0">{{ value | formatTime }}</p>
           </template>
 
           <!-- Actions column -->
-          <template v-slot:cell(actions)="row">
+          <template #cell(actions)="row">
             <table-row-action
               v-for="(action, index) in row.item.actions"
               :key="index"
@@ -104,7 +104,7 @@
               :data-test-id="`eventLogs-button-deleteRow-${row.index}`"
               @click:tableAction="onTableRowAction($event, row.item)"
             >
-              <template v-slot:icon>
+              <template #icon>
                 <icon-export v-if="action.value === 'export'" />
                 <icon-trashcan v-if="action.value === 'delete'" />
               </template>
@@ -179,7 +179,7 @@
     TableRowAction,
     TableToolbar,
     TableToolbarExport,
-    TableDateFilter
+    TableDateFilter,
   },
   mixins: [
     BVPaginationMixin,
@@ -189,64 +189,70 @@
     TableFilterMixin,
     TableDataFormatterMixin,
     TableSortMixin,
-    SearchFilterMixin
+    SearchFilterMixin,
   ],
+  beforeRouteLeave(to, from, next) {
+    // Hide loader if the user navigates to another page
+    // before request is fulfilled.
+    this.hideLoader();
+    next();
+  },
   data() {
     return {
       fields: [
         {
           key: 'checkbox',
-          sortable: false
+          sortable: false,
         },
         {
           key: 'id',
           label: this.$t('pageEventLogs.table.id'),
-          sortable: true
+          sortable: true,
         },
         {
           key: 'severity',
           label: this.$t('pageEventLogs.table.severity'),
           sortable: true,
-          tdClass: 'text-nowrap'
+          tdClass: 'text-nowrap',
         },
         {
           key: 'type',
           label: this.$t('pageEventLogs.table.type'),
-          sortable: true
+          sortable: true,
         },
         {
           key: 'date',
           label: this.$t('pageEventLogs.table.date'),
-          sortable: true
+          sortable: true,
         },
         {
           key: 'description',
-          label: this.$t('pageEventLogs.table.description')
+          label: this.$t('pageEventLogs.table.description'),
         },
         {
           key: 'actions',
           sortable: false,
           label: '',
-          tdClass: 'text-right text-nowrap'
-        }
+          tdClass: 'text-right text-nowrap',
+        },
       ],
       tableFilters: [
         {
           key: 'severity',
           label: this.$t('pageEventLogs.table.severity'),
-          values: ['OK', 'Warning', 'Critical']
-        }
+          values: ['OK', 'Warning', 'Critical'],
+        },
       ],
       activeFilters: [],
       batchActions: [
         {
           value: 'delete',
-          label: this.$t('global.action.delete')
-        }
+          label: this.$t('global.action.delete'),
+        },
       ],
       filterStartDate: null,
       filterEndDate: null,
-      searchTotalFilteredRows: 0
+      searchTotalFilteredRows: 0,
     };
   },
   computed: {
@@ -256,24 +262,24 @@
         : this.filteredLogs.length;
     },
     allLogs() {
-      return this.$store.getters['eventLog/allEvents'].map(event => {
+      return this.$store.getters['eventLog/allEvents'].map((event) => {
         return {
           ...event,
           actions: [
             {
               value: 'export',
-              title: this.$t('global.action.export')
+              title: this.$t('global.action.export'),
             },
             {
               value: 'delete',
-              title: this.$t('global.action.delete')
-            }
-          ]
+              title: this.$t('global.action.delete'),
+            },
+          ],
         };
       });
     },
     batchExportData() {
-      return this.selectedRows.map(row => omit(row, 'actions'));
+      return this.selectedRows.map((row) => omit(row, 'actions'));
     },
     filteredLogsByDate() {
       return this.getFilteredTableDataByDate(
@@ -287,7 +293,7 @@
         this.filteredLogsByDate,
         this.activeFilters
       );
-    }
+    },
   },
   created() {
     this.startLoader();
@@ -295,23 +301,19 @@
       .dispatch('eventLog/getEventLogData')
       .finally(() => this.endLoader());
   },
-  beforeRouteLeave(to, from, next) {
-    // Hide loader if the user navigates to another page
-    // before request is fulfilled.
-    this.hideLoader();
-    next();
-  },
   methods: {
     deleteLogs(uris) {
-      this.$store.dispatch('eventLog/deleteEventLogs', uris).then(messages => {
-        messages.forEach(({ type, message }) => {
-          if (type === 'success') {
-            this.successToast(message);
-          } else if (type === 'error') {
-            this.errorToast(message);
-          }
+      this.$store
+        .dispatch('eventLog/deleteEventLogs', uris)
+        .then((messages) => {
+          messages.forEach(({ type, message }) => {
+            if (type === 'success') {
+              this.successToast(message);
+            } else if (type === 'error') {
+              this.errorToast(message);
+            }
+          });
         });
-      });
     },
     onFilterChange({ activeFilters }) {
       this.activeFilters = activeFilters;
@@ -326,16 +328,16 @@
         this.$bvModal
           .msgBoxConfirm(this.$tc('pageEventLogs.modal.deleteMessage'), {
             title: this.$tc('pageEventLogs.modal.deleteTitle'),
-            okTitle: this.$t('global.action.delete')
+            okTitle: this.$t('global.action.delete'),
           })
-          .then(deleteConfirmed => {
+          .then((deleteConfirmed) => {
             if (deleteConfirmed) this.deleteLogs([uri]);
           });
       }
     },
     onBatchAction(action) {
       if (action === 'delete') {
-        const uris = this.selectedRows.map(row => row.uri);
+        const uris = this.selectedRows.map((row) => row.uri);
         this.$bvModal
           .msgBoxConfirm(
             this.$tc(
@@ -347,10 +349,10 @@
                 'pageEventLogs.modal.deleteTitle',
                 this.selectedRows.length
               ),
-              okTitle: this.$t('global.action.delete')
+              okTitle: this.$t('global.action.delete'),
             }
           )
-          .then(deleteConfirmed => {
+          .then((deleteConfirmed) => {
             if (deleteConfirmed) this.deleteLogs(uris);
           });
       }
@@ -368,13 +370,9 @@
       date =
         date.toISOString().slice(0, 10) +
         '_' +
-        date
-          .toString()
-          .split(':')
-          .join('-')
-          .split(' ')[4];
+        date.toString().split(':').join('-').split(' ')[4];
       return this.$t('pageEventLogs.exportFilePrefix') + date;
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Health/HardwareStatus/HardwareStatus.vue b/src/views/Health/HardwareStatus/HardwareStatus.vue
index fb20338..24f0295 100644
--- a/src/views/Health/HardwareStatus/HardwareStatus.vue
+++ b/src/views/Health/HardwareStatus/HardwareStatus.vue
@@ -45,32 +45,38 @@
     TableFans,
     TableBmcManager,
     TableChassis,
-    TableProcessors
+    TableProcessors,
   },
   mixins: [LoadingBarMixin],
+  beforeRouteLeave(to, from, next) {
+    // Hide loader if user navigates away from page
+    // before requests complete
+    this.hideLoader();
+    next();
+  },
   created() {
     this.startLoader();
-    const systemTablePromise = new Promise(resolve => {
+    const systemTablePromise = new Promise((resolve) => {
       this.$root.$on('hardwareStatus::system::complete', () => resolve());
     });
-    const bmcManagerTablePromise = new Promise(resolve => {
+    const bmcManagerTablePromise = new Promise((resolve) => {
       this.$root.$on('hardwareStatus::bmcManager::complete', () => resolve());
     });
-    const chassisTablePromise = new Promise(resolve => {
+    const chassisTablePromise = new Promise((resolve) => {
       this.$root.$on('hardwareStatus::chassis::complete', () => resolve());
     });
-    const dimmSlotTablePromise = new Promise(resolve => {
+    const dimmSlotTablePromise = new Promise((resolve) => {
       this.$root.$on('hardwareStatus::dimmSlot::complete', () => resolve());
     });
-    const fansTablePromise = new Promise(resolve => {
+    const fansTablePromise = new Promise((resolve) => {
       this.$root.$on('hardwareStatus::fans::complete', () => resolve());
     });
-    const powerSuppliesTablePromise = new Promise(resolve => {
+    const powerSuppliesTablePromise = new Promise((resolve) => {
       this.$root.$on('hardwareStatus::powerSupplies::complete', () =>
         resolve()
       );
     });
-    const processorsTablePromise = new Promise(resolve => {
+    const processorsTablePromise = new Promise((resolve) => {
       this.$root.$on('hardwareStatus::processors::complete', () => resolve());
     });
     // Combine all child component Promises to indicate
@@ -82,14 +88,8 @@
       dimmSlotTablePromise,
       fansTablePromise,
       powerSuppliesTablePromise,
-      processorsTablePromise
+      processorsTablePromise,
     ]).finally(() => this.endLoader());
   },
-  beforeRouteLeave(to, from, next) {
-    // Hide loader if user navigates away from page
-    // before requests complete
-    this.hideLoader();
-    next();
-  }
 };
 </script>
diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableBmcManager.vue b/src/views/Health/HardwareStatus/HardwareStatusTableBmcManager.vue
index e7ddf53..783cd64 100644
--- a/src/views/Health/HardwareStatus/HardwareStatusTableBmcManager.vue
+++ b/src/views/Health/HardwareStatus/HardwareStatusTableBmcManager.vue
@@ -9,7 +9,7 @@
       :empty-text="$t('global.table.emptyMessage')"
     >
       <!-- Expand chevron icon -->
-      <template v-slot:cell(expandRow)="row">
+      <template #cell(expandRow)="row">
         <b-button
           variant="link"
           data-test-id="hardwareStatus-button-expandBmc"
@@ -21,12 +21,12 @@
       </template>
 
       <!-- Health -->
-      <template v-slot:cell(health)="{ value }">
+      <template #cell(health)="{ value }">
         <status-icon :status="statusIcon(value)" />
         {{ value }}
       </template>
 
-      <template v-slot:row-details="{ item }">
+      <template #row-details="{ item }">
         <b-container fluid>
           <b-row>
             <b-col sm="6">
@@ -153,30 +153,30 @@
         {
           key: 'expandRow',
           label: '',
-          tdClass: 'table-row-expand'
+          tdClass: 'table-row-expand',
         },
         {
           key: 'id',
           label: this.$t('pageHardwareStatus.table.id'),
-          formatter: this.tableFormatter
+          formatter: this.tableFormatter,
         },
         {
           key: 'health',
           label: this.$t('pageHardwareStatus.table.health'),
           formatter: this.tableFormatter,
-          tdClass: 'text-nowrap'
+          tdClass: 'text-nowrap',
         },
         {
           key: 'partNumber',
           label: this.$t('pageHardwareStatus.table.partNumber'),
-          formatter: this.tableFormatter
+          formatter: this.tableFormatter,
         },
         {
           key: 'serialNumber',
           label: this.$t('pageHardwareStatus.table.serialNumber'),
-          formatter: this.tableFormatter
-        }
-      ]
+          formatter: this.tableFormatter,
+        },
+      ],
     };
   },
   computed: {
@@ -189,13 +189,13 @@
       } else {
         return [];
       }
-    }
+    },
   },
   created() {
     this.$store.dispatch('bmc/getBmcInfo').finally(() => {
       // Emit initial data fetch complete to parent component
       this.$root.$emit('hardwareStatus::bmcManager::complete');
     });
-  }
+  },
 };
 </script>
diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue b/src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue
index 0b56a9f..fbdadcd 100644
--- a/src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue
+++ b/src/views/Health/HardwareStatus/HardwareStatusTableChassis.vue
@@ -9,7 +9,7 @@
       :empty-text="$t('global.table.emptyMessage')"
     >
       <!-- Expand chevron icon -->
-      <template v-slot:cell(expandRow)="row">
+      <template #cell(expandRow)="row">
         <b-button
           variant="link"
           data-test-id="hardwareStatus-button-expandChassis"
@@ -21,12 +21,12 @@
       </template>
 
       <!-- Health -->
-      <template v-slot:cell(health)="{ value }">
+      <template #cell(health)="{ value }">
         <status-icon :status="statusIcon(value)" />
         {{ value }}
       </template>
 
-      <template v-slot:row-details="{ item }">
+      <template #row-details="{ item }">
         <b-container fluid>
           <b-row>
             <b-col sm="6" xl="4">
@@ -82,42 +82,42 @@
         {
           key: 'expandRow',
           label: '',
-          tdClass: 'table-row-expand'
+          tdClass: 'table-row-expand',
         },
         {
           key: 'id',
           label: this.$t('pageHardwareStatus.table.id'),
-          formatter: this.tableFormatter
+          formatter: this.tableFormatter,
         },
         {
           key: 'health',
           label: this.$t('pageHardwareStatus.table.health'),
           formatter: this.tableFormatter,
-          tdClass: 'text-nowrap'
+          tdClass: 'text-nowrap',
         },
         {
           key: 'partNumber',
           label: this.$t('pageHardwareStatus.table.partNumber'),
-          formatter: this.tableFormatter
+          formatter: this.tableFormatter,
         },
         {
           key: 'serialNumber',
           label: this.$t('pageHardwareStatus.table.serialNumber'),
-          formatter: this.tableFormatter
-        }
-      ]
+          formatter: this.tableFormatter,
+        },
+      ],
     };
   },
   computed: {
     chassis() {
       return this.$store.getters['chassis/chassis'];
-    }
+    },
   },
   created() {
     this.$store.dispatch('chassis/getChassisInfo').finally(() => {
       // Emit initial data fetch complete to parent component
       this.$root.$emit('hardwareStatus::chassis::complete');
     });
-  }
+  },
 };
 </script>
diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue b/src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue
index babb8d0..2c90163 100644
--- a/src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue
+++ b/src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue
@@ -31,7 +31,7 @@
       @filtered="onFiltered"
     >
       <!-- Expand chevron icon -->
-      <template v-slot:cell(expandRow)="row">
+      <template #cell(expandRow)="row">
         <b-button
           variant="link"
           data-test-id="hardwareStatus-button-expandDimms"
@@ -43,12 +43,12 @@
       </template>
 
       <!-- Health -->
-      <template v-slot:cell(health)="{ value }">
+      <template #cell(health)="{ value }">
         <status-icon :status="statusIcon(value)" />
         {{ value }}
       </template>
 
-      <template v-slot:row-details="{ item }">
+      <template #row-details="{ item }">
         <b-container fluid>
           <b-row>
             <b-col sm="6" xl="4">
@@ -84,7 +84,7 @@
     TableRowExpandMixin,
     TableDataFormatterMixin,
     TableSortMixin,
-    SearchFilterMixin
+    SearchFilterMixin,
   ],
   data() {
     return {
@@ -93,35 +93,35 @@
           key: 'expandRow',
           label: '',
           tdClass: 'table-row-expand',
-          sortable: false
+          sortable: false,
         },
         {
           key: 'id',
           label: this.$t('pageHardwareStatus.table.id'),
           formatter: this.tableFormatter,
-          sortable: true
+          sortable: true,
         },
         {
           key: 'health',
           label: this.$t('pageHardwareStatus.table.health'),
           formatter: this.tableFormatter,
           sortable: true,
-          tdClass: 'text-nowrap'
+          tdClass: 'text-nowrap',
         },
         {
           key: 'partNumber',
           label: this.$t('pageHardwareStatus.table.partNumber'),
           formatter: this.tableFormatter,
-          sortable: true
+          sortable: true,
         },
         {
           key: 'serialNumber',
           label: this.$t('pageHardwareStatus.table.serialNumber'),
           formatter: this.tableFormatter,
-          sortable: true
-        }
+          sortable: true,
+        },
       ],
-      searchTotalFilteredRows: 0
+      searchTotalFilteredRows: 0,
     };
   },
   computed: {
@@ -132,7 +132,7 @@
     },
     dimms() {
       return this.$store.getters['memory/dimms'];
-    }
+    },
   },
   created() {
     this.$store.dispatch('memory/getDimms').finally(() => {
@@ -148,7 +148,7 @@
     },
     onFiltered(filteredItems) {
       this.searchTotalFilteredRows = filteredItems.length;
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableFans.vue b/src/views/Health/HardwareStatus/HardwareStatusTableFans.vue
index 9ee9291..6ade34b 100644
--- a/src/views/Health/HardwareStatus/HardwareStatusTableFans.vue
+++ b/src/views/Health/HardwareStatus/HardwareStatusTableFans.vue
@@ -31,7 +31,7 @@
       @filtered="onFiltered"
     >
       <!-- Expand chevron icon -->
-      <template v-slot:cell(expandRow)="row">
+      <template #cell(expandRow)="row">
         <b-button
           variant="link"
           data-test-id="hardwareStatus-button-expandFans"
@@ -43,12 +43,12 @@
       </template>
 
       <!-- Health -->
-      <template v-slot:cell(health)="{ value }">
+      <template #cell(health)="{ value }">
         <status-icon :status="statusIcon(value)" />
         {{ value }}
       </template>
 
-      <template v-slot:row-details="{ item }">
+      <template #row-details="{ item }">
         <b-container fluid>
           <b-row>
             <b-col sm="6" xl="4">
@@ -83,7 +83,7 @@
     TableRowExpandMixin,
     TableDataFormatterMixin,
     TableSortMixin,
-    SearchFilterMixin
+    SearchFilterMixin,
   ],
   data() {
     return {
@@ -92,35 +92,35 @@
           key: 'expandRow',
           label: '',
           tdClass: 'table-row-expand',
-          sortable: false
+          sortable: false,
         },
         {
           key: 'id',
           label: this.$t('pageHardwareStatus.table.id'),
           formatter: this.tableFormatter,
-          sortable: true
+          sortable: true,
         },
         {
           key: 'health',
           label: this.$t('pageHardwareStatus.table.health'),
           formatter: this.tableFormatter,
           sortable: true,
-          tdClass: 'text-nowrap'
+          tdClass: 'text-nowrap',
         },
         {
           key: 'partNumber',
           label: this.$t('pageHardwareStatus.table.partNumber'),
           formatter: this.tableFormatter,
-          sortable: true
+          sortable: true,
         },
         {
           key: 'serialNumber',
           label: this.$t('pageHardwareStatus.table.serialNumber'),
           formatter: this.tableFormatter,
-          sortable: true
-        }
+          sortable: true,
+        },
       ],
-      searchTotalFilteredRows: 0
+      searchTotalFilteredRows: 0,
     };
   },
   computed: {
@@ -131,7 +131,7 @@
     },
     fans() {
       return this.$store.getters['fan/fans'];
-    }
+    },
   },
   created() {
     this.$store.dispatch('fan/getFanInfo').finally(() => {
@@ -147,7 +147,7 @@
     },
     onFiltered(filteredItems) {
       this.searchTotalFilteredRows = filteredItems.length;
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue b/src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue
index bd5cedb..91c26a7 100644
--- a/src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue
+++ b/src/views/Health/HardwareStatus/HardwareStatusTablePowerSupplies.vue
@@ -31,7 +31,7 @@
       @filtered="onFiltered"
     >
       <!-- Expand chevron icon -->
-      <template v-slot:cell(expandRow)="row">
+      <template #cell(expandRow)="row">
         <b-button
           variant="link"
           data-test-id="hardwareStatus-button-expandPowerSupplies"
@@ -43,12 +43,12 @@
       </template>
 
       <!-- Health -->
-      <template v-slot:cell(health)="{ value }">
+      <template #cell(health)="{ value }">
         <status-icon :status="statusIcon(value)" />
         {{ value }}
       </template>
 
-      <template v-slot:row-details="{ item }">
+      <template #row-details="{ item }">
         <b-container fluid>
           <b-row>
             <b-col sm="6" xl="4">
@@ -106,7 +106,7 @@
     TableRowExpandMixin,
     TableDataFormatterMixin,
     TableSortMixin,
-    SearchFilterMixin
+    SearchFilterMixin,
   ],
   data() {
     return {
@@ -115,35 +115,35 @@
           key: 'expandRow',
           label: '',
           tdClass: 'table-row-expand',
-          sortable: false
+          sortable: false,
         },
         {
           key: 'id',
           label: this.$t('pageHardwareStatus.table.id'),
           formatter: this.tableFormatter,
-          sortable: true
+          sortable: true,
         },
         {
           key: 'health',
           label: this.$t('pageHardwareStatus.table.health'),
           formatter: this.tableFormatter,
           sortable: true,
-          tdClass: 'text-nowrap'
+          tdClass: 'text-nowrap',
         },
         {
           key: 'partNumber',
           label: this.$t('pageHardwareStatus.table.partNumber'),
           formatter: this.tableFormatter,
-          sortable: true
+          sortable: true,
         },
         {
           key: 'serialNumber',
           label: this.$t('pageHardwareStatus.table.serialNumber'),
           formatter: this.tableFormatter,
-          sortable: true
-        }
+          sortable: true,
+        },
       ],
-      searchTotalFilteredRows: 0
+      searchTotalFilteredRows: 0,
     };
   },
   computed: {
@@ -154,7 +154,7 @@
     },
     powerSupplies() {
       return this.$store.getters['powerSupply/powerSupplies'];
-    }
+    },
   },
   created() {
     this.$store.dispatch('powerSupply/getPowerSupply').finally(() => {
@@ -170,7 +170,7 @@
     },
     onFiltered(filteredItems) {
       this.searchTotalFilteredRows = filteredItems.length;
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableProcessors.vue b/src/views/Health/HardwareStatus/HardwareStatusTableProcessors.vue
index de77243..fba4cc4 100644
--- a/src/views/Health/HardwareStatus/HardwareStatusTableProcessors.vue
+++ b/src/views/Health/HardwareStatus/HardwareStatusTableProcessors.vue
@@ -30,7 +30,7 @@
       @filtered="onFiltered"
     >
       <!-- Expand button -->
-      <template v-slot:cell(expandRow)="row">
+      <template #cell(expandRow)="row">
         <b-button
           variant="link"
           data-test-id="hardwareStatus-button-expandProcessors"
@@ -41,11 +41,11 @@
         </b-button>
       </template>
       <!-- Health -->
-      <template v-slot:cell(health)="{ value }">
+      <template #cell(health)="{ value }">
         <status-icon :status="statusIcon(value)" />
         {{ value }}
       </template>
-      <template v-slot:row-details="{ item }">
+      <template #row-details="{ item }">
         <b-container fluid>
           <b-row>
             <b-col sm="6" xl="4">
@@ -113,7 +113,7 @@
     TableRowExpandMixin,
     TableDataFormatterMixin,
     TableSortMixin,
-    SearchFilterMixin
+    SearchFilterMixin,
   ],
   data() {
     return {
@@ -122,35 +122,35 @@
           key: 'expandRow',
           label: '',
           tdClass: 'table-row-expand',
-          sortable: false
+          sortable: false,
         },
         {
           key: 'id',
           label: this.$t('pageHardwareStatus.table.id'),
           formatter: this.tableFormatter,
-          sortable: true
+          sortable: true,
         },
         {
           key: 'health',
           label: this.$t('pageHardwareStatus.table.health'),
           formatter: this.tableFormatter,
           sortable: true,
-          tdClass: 'text-nowrap'
+          tdClass: 'text-nowrap',
         },
         {
           key: 'partNumber',
           label: this.$t('pageHardwareStatus.table.partNumber'),
           formatter: this.tableFormatter,
-          sortable: true
+          sortable: true,
         },
         {
           key: 'serialNumber',
           label: this.$t('pageHardwareStatus.table.serialNumber'),
           formatter: this.tableFormatter,
-          sortable: true
-        }
+          sortable: true,
+        },
       ],
-      searchTotalFilteredRows: 0
+      searchTotalFilteredRows: 0,
     };
   },
   computed: {
@@ -161,7 +161,7 @@
     },
     processors() {
       return this.$store.getters['processors/processors'];
-    }
+    },
   },
   created() {
     this.$store.dispatch('processors/getProcessorsInfo').finally(() => {
@@ -172,7 +172,7 @@
   methods: {
     onFiltered(filteredItems) {
       this.searchTotalFilteredRows = filteredItems.length;
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableStystem.vue b/src/views/Health/HardwareStatus/HardwareStatusTableStystem.vue
index da4d546..fc65fbf 100644
--- a/src/views/Health/HardwareStatus/HardwareStatusTableStystem.vue
+++ b/src/views/Health/HardwareStatus/HardwareStatusTableStystem.vue
@@ -9,7 +9,7 @@
       :empty-text="$t('global.table.emptyMessage')"
     >
       <!-- Expand chevron icon -->
-      <template v-slot:cell(expandRow)="row">
+      <template #cell(expandRow)="row">
         <b-button
           variant="link"
           data-test-id="hardwareStatus-button-expandSystem"
@@ -21,12 +21,12 @@
       </template>
 
       <!-- Health -->
-      <template v-slot:cell(health)="{ value }">
+      <template #cell(health)="{ value }">
         <status-icon :status="statusIcon(value)" />
         {{ value }}
       </template>
 
-      <template v-slot:row-details="{ item }">
+      <template #row-details="{ item }">
         <b-container fluid>
           <b-row>
             <b-col sm="6" xl="4">
@@ -94,42 +94,42 @@
         {
           key: 'expandRow',
           label: '',
-          tdClass: 'table-row-expand'
+          tdClass: 'table-row-expand',
         },
         {
           key: 'id',
           label: this.$t('pageHardwareStatus.table.id'),
-          formatter: this.tableFormatter
+          formatter: this.tableFormatter,
         },
         {
           key: 'health',
           label: this.$t('pageHardwareStatus.table.health'),
           formatter: this.tableFormatter,
-          tdClass: 'text-nowrap'
+          tdClass: 'text-nowrap',
         },
         {
           key: 'partNumber',
           label: this.$t('pageHardwareStatus.table.partNumber'),
-          formatter: this.tableFormatter
+          formatter: this.tableFormatter,
         },
         {
           key: 'serialNumber',
           label: this.$t('pageHardwareStatus.table.serialNumber'),
-          formatter: this.tableFormatter
-        }
-      ]
+          formatter: this.tableFormatter,
+        },
+      ],
     };
   },
   computed: {
     systems() {
       return this.$store.getters['system/systems'];
-    }
+    },
   },
   created() {
     this.$store.dispatch('system/getSystem').finally(() => {
       // Emit initial data fetch complete to parent component
       this.$root.$emit('hardwareStatus::system::complete');
     });
-  }
+  },
 };
 </script>
diff --git a/src/views/Health/Sensors/Sensors.vue b/src/views/Health/Sensors/Sensors.vue
index acd2d18..384c64f 100644
--- a/src/views/Health/Sensors/Sensors.vue
+++ b/src/views/Health/Sensors/Sensors.vue
@@ -26,7 +26,7 @@
           :selected-items-count="selectedRows.length"
           @clearSelected="clearSelectedRows($refs.table)"
         >
-          <template v-slot:export>
+          <template #export>
             <table-toolbar-export
               :data="selectedRows"
               :file-name="exportFileNameByDate()"
@@ -56,36 +56,36 @@
           @row-selected="onRowSelected($event, filteredSensors.length)"
         >
           <!-- Checkbox column -->
-          <template v-slot:head(checkbox)>
+          <template #head(checkbox)>
             <b-form-checkbox
               v-model="tableHeaderCheckboxModel"
               :indeterminate="tableHeaderCheckboxIndeterminate"
               @change="onChangeHeaderCheckbox($refs.table)"
             />
           </template>
-          <template v-slot:cell(checkbox)="row">
+          <template #cell(checkbox)="row">
             <b-form-checkbox
               v-model="row.rowSelected"
               @change="toggleSelectRow($refs.table, row.index)"
             />
           </template>
 
-          <template v-slot:cell(status)="{ value }">
+          <template #cell(status)="{ value }">
             <status-icon :status="statusIcon(value)" /> {{ value }}
           </template>
-          <template v-slot:cell(currentValue)="data">
+          <template #cell(currentValue)="data">
             {{ data.value }} {{ data.item.units }}
           </template>
-          <template v-slot:cell(lowerCaution)="data">
+          <template #cell(lowerCaution)="data">
             {{ data.value }} {{ data.item.units }}
           </template>
-          <template v-slot:cell(upperCaution)="data">
+          <template #cell(upperCaution)="data">
             {{ data.value }} {{ data.item.units }}
           </template>
-          <template v-slot:cell(lowerCritical)="data">
+          <template #cell(lowerCritical)="data">
             {{ data.value }} {{ data.item.units }}
           </template>
-          <template v-slot:cell(upperCritical)="data">
+          <template #cell(upperCritical)="data">
             {{ data.value }} {{ data.item.units }}
           </template>
         </b-table>
@@ -119,7 +119,7 @@
     TableCellCount,
     TableFilter,
     TableToolbar,
-    TableToolbarExport
+    TableToolbarExport,
   },
   mixins: [
     TableFilterMixin,
@@ -127,63 +127,67 @@
     LoadingBarMixin,
     TableDataFormatterMixin,
     TableSortMixin,
-    SearchFilterMixin
+    SearchFilterMixin,
   ],
+  beforeRouteLeave(to, from, next) {
+    this.hideLoader();
+    next();
+  },
   data() {
     return {
       fields: [
         {
           key: 'checkbox',
           sortable: false,
-          label: ''
+          label: '',
         },
         {
           key: 'name',
           sortable: true,
-          label: this.$t('pageSensors.table.name')
+          label: this.$t('pageSensors.table.name'),
         },
         {
           key: 'status',
           sortable: true,
           label: this.$t('pageSensors.table.status'),
-          tdClass: 'text-nowrap'
+          tdClass: 'text-nowrap',
         },
         {
           key: 'lowerCritical',
           formatter: this.tableFormatter,
-          label: this.$t('pageSensors.table.lowerCritical')
+          label: this.$t('pageSensors.table.lowerCritical'),
         },
         {
           key: 'lowerCaution',
           formatter: this.tableFormatter,
-          label: this.$t('pageSensors.table.lowerWarning')
+          label: this.$t('pageSensors.table.lowerWarning'),
         },
 
         {
           key: 'currentValue',
           formatter: this.tableFormatter,
-          label: this.$t('pageSensors.table.currentValue')
+          label: this.$t('pageSensors.table.currentValue'),
         },
         {
           key: 'upperCaution',
           formatter: this.tableFormatter,
-          label: this.$t('pageSensors.table.upperWarning')
+          label: this.$t('pageSensors.table.upperWarning'),
         },
         {
           key: 'upperCritical',
           formatter: this.tableFormatter,
-          label: this.$t('pageSensors.table.upperCritical')
-        }
+          label: this.$t('pageSensors.table.upperCritical'),
+        },
       ],
       tableFilters: [
         {
           key: 'status',
           label: this.$t('pageSensors.table.status'),
-          values: ['OK', 'Warning', 'Critical']
-        }
+          values: ['OK', 'Warning', 'Critical'],
+        },
       ],
       activeFilters: [],
-      searchTotalFilteredRows: 0
+      searchTotalFilteredRows: 0,
     };
   },
   computed: {
@@ -197,7 +201,7 @@
     },
     filteredSensors() {
       return this.getFilteredTableData(this.allSensors, this.activeFilters);
-    }
+    },
   },
   created() {
     this.startLoader();
@@ -205,10 +209,6 @@
       .dispatch('sensors/getAllSensors')
       .finally(() => this.endLoader());
   },
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
   methods: {
     sortCompare(a, b, key) {
       if (key === 'status') {
@@ -230,13 +230,9 @@
       date =
         date.toISOString().slice(0, 10) +
         '_' +
-        date
-          .toString()
-          .split(':')
-          .join('-')
-          .split(' ')[4];
+        date.toString().split(':').join('-').split(' ')[4];
       return this.$t('pageSensors.exportFilePrefix') + date;
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/src/views/Login/Login.vue b/src/views/Login/Login.vue
index dd0a415..1936cd4 100644
--- a/src/views/Login/Login.vue
+++ b/src/views/Login/Login.vue
@@ -1,6 +1,6 @@
 <template>
   <b-form
-    class="login-form  mx-auto ml-md-5 mb-3"
+    class="login-form mx-auto ml-md-5 mb-3"
     novalidate
     @submit.prevent="login"
   >
@@ -79,38 +79,38 @@
     return {
       userInfo: {
         username: null,
-        password: null
+        password: null,
       },
       disableSubmitButton: false,
       languages: [
         {
           value: 'en-US',
-          text: 'English'
+          text: 'English',
         },
         {
           value: 'es',
-          text: 'Español'
-        }
-      ]
+          text: 'Español',
+        },
+      ],
     };
   },
   computed: {
     authError() {
       return this.$store.getters['authentication/authError'];
-    }
+    },
   },
   validations: {
     userInfo: {
       username: {
-        required
+        required,
       },
       password: {
-        required
-      }
-    }
+        required,
+      },
+    },
   },
   methods: {
-    login: function() {
+    login: function () {
       this.$v.$touch();
       if (this.$v.$invalid) return;
       this.disableSubmitButton = true;
@@ -128,17 +128,17 @@
             username
           );
         })
-        .then(passwordChangeRequired => {
+        .then((passwordChangeRequired) => {
           if (passwordChangeRequired) {
             this.$router.push('/change-password');
           } else {
             this.$router.push('/');
           }
         })
-        .catch(error => console.log(error))
+        .catch((error) => console.log(error))
         .finally(() => (this.disableSubmitButton = false));
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/views/Overview/Overview.vue b/src/views/Overview/Overview.vue
index 27a599b..1313860 100644
--- a/src/views/Overview/Overview.vue
+++ b/src/views/Overview/Overview.vue
@@ -101,21 +101,22 @@
     OverviewEvents,
     OverviewNetwork,
     PageTitle,
-    PageSection
+    PageSection,
   },
   mixins: [LoadingBarMixin],
   data() {
     return {
       firmwareStoreModuleName: this.$store.hasModule('firmwareSingleImage')
         ? 'firmwareSingleImage'
-        : 'firmware'
+        : 'firmware',
     };
   },
   computed: {
     ...mapState({
-      server: state => state.system.systems[0],
-      powerCapValue: state => state.powerControl.powerCapValue,
-      powerConsumptionValue: state => state.powerControl.powerConsumptionValue,
+      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 '--';
@@ -131,23 +132,23 @@
       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 => {
+    const quicklinksPromise = new Promise((resolve) => {
       this.$root.$on('overview::quicklinks::complete', () => resolve());
     });
-    const networkPromise = new Promise(resolve => {
+    const networkPromise = new Promise((resolve) => {
       this.$root.$on('overview::network::complete', () => resolve());
     });
-    const eventsPromise = new Promise(resolve => {
+    const eventsPromise = new Promise((resolve) => {
       this.$root.$on('overview::events::complete', () => resolve());
     });
     Promise.all([
@@ -158,13 +159,9 @@
       this.$store.dispatch('powerControl/getPowerControl'),
       quicklinksPromise,
       networkPromise,
-      eventsPromise
+      eventsPromise,
     ]).finally(() => this.endLoader());
   },
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  }
 };
 </script>
 
diff --git a/src/views/Overview/OverviewEvents.vue b/src/views/Overview/OverviewEvents.vue
index ac39a2b..83aa677 100644
--- a/src/views/Overview/OverviewEvents.vue
+++ b/src/views/Overview/OverviewEvents.vue
@@ -20,11 +20,11 @@
       :fields="fields"
       :empty-text="$t('pageOverview.events.noHighEventsMsg')"
     >
-      <template v-slot:cell(severity)="{ value }">
+      <template #cell(severity)="{ value }">
         <status-icon status="danger" />
         {{ value }}
       </template>
-      <template v-slot:cell(date)="{ value }">
+      <template #cell(date)="{ value }">
         <p class="mb-0">{{ value | formatDate }}</p>
         <p class="mb-0">{{ value | formatTime }}</p>
       </template>
@@ -43,36 +43,36 @@
       fields: [
         {
           key: 'id',
-          label: this.$t('pageOverview.events.id')
+          label: this.$t('pageOverview.events.id'),
         },
         {
           key: 'severity',
-          label: this.$t('pageOverview.events.severity')
+          label: this.$t('pageOverview.events.severity'),
         },
         {
           key: 'type',
-          label: this.$t('pageOverview.events.type')
+          label: this.$t('pageOverview.events.type'),
         },
         {
           key: 'date',
-          label: this.$t('pageOverview.events.date')
+          label: this.$t('pageOverview.events.date'),
         },
         {
           key: 'description',
-          label: this.$t('pageOverview.events.description')
-        }
-      ]
+          label: this.$t('pageOverview.events.description'),
+        },
+      ],
     };
   },
   computed: {
     eventLogData() {
       return this.$store.getters['eventLog/highPriorityEvents'];
-    }
+    },
   },
   created() {
     this.$store.dispatch('eventLog/getEventLogData').finally(() => {
       this.$root.$emit('overview::events::complete');
     });
-  }
+  },
 };
 </script>
diff --git a/src/views/Overview/OverviewNetwork.vue b/src/views/Overview/OverviewNetwork.vue
index 14b4d4a..ec9fd6b 100644
--- a/src/views/Overview/OverviewNetwork.vue
+++ b/src/views/Overview/OverviewNetwork.vue
@@ -46,13 +46,13 @@
   computed: {
     ethernetData() {
       return this.$store.getters['networkSettings/ethernetData'];
-    }
+    },
   },
   created() {
     this.$store.dispatch('networkSettings/getEthernetData').finally(() => {
       this.$root.$emit('overview::network::complete');
     });
-  }
+  },
 };
 </script>
 
diff --git a/src/views/Overview/OverviewQuickLinks.vue b/src/views/Overview/OverviewQuickLinks.vue
index e0b4487..1cbc64d 100644
--- a/src/views/Overview/OverviewQuickLinks.vue
+++ b/src/views/Overview/OverviewQuickLinks.vue
@@ -62,7 +62,7 @@
 export default {
   name: 'QuickLinks',
   components: {
-    IconArrowRight: ArrowRight16
+    IconArrowRight: ArrowRight16,
   },
   mixins: [BVToastMixin],
   computed: {
@@ -75,13 +75,13 @@
       },
       set(value) {
         return value;
-      }
-    }
+      },
+    },
   },
   created() {
     Promise.all([
       this.$store.dispatch('global/getBmcTime'),
-      this.$store.dispatch('serverLed/getIndicatorValue')
+      this.$store.dispatch('serverLed/getIndicatorValue'),
     ]).finally(() => {
       this.$root.$emit('overview::quicklinks::complete');
     });
@@ -90,10 +90,10 @@
     onChangeServerLed(value) {
       this.$store
         .dispatch('serverLed/saveIndicatorLedValue', value)
-        .then(message => this.successToast(message))
+        .then((message) => this.successToast(message))
         .catch(({ message }) => this.errorToast(message));
-    }
-  }
+    },
+  },
 };
 </script>
 
diff --git a/src/views/PageNotFound/PageNotFound.vue b/src/views/PageNotFound/PageNotFound.vue
index be4b3c4..91341db 100644
--- a/src/views/PageNotFound/PageNotFound.vue
+++ b/src/views/PageNotFound/PageNotFound.vue
@@ -7,6 +7,6 @@
 import PageTitle from '@/components/Global/PageTitle';
 export default {
   name: 'PageNotFound',
-  components: { PageTitle }
+  components: { PageTitle },
 };
 </script>
diff --git a/src/views/ProfileSettings/ProfileSettings.vue b/src/views/ProfileSettings/ProfileSettings.vue
index 8c68839..65c722a 100644
--- a/src/views/ProfileSettings/ProfileSettings.vue
+++ b/src/views/ProfileSettings/ProfileSettings.vue
@@ -32,7 +32,7 @@
                 {{
                   $t('pageLocalUserManagement.modal.passwordMustBeBetween', {
                     min: passwordRequirements.minLength,
-                    max: passwordRequirements.maxLength
+                    max: passwordRequirements.maxLength,
                   })
                 }}
               </b-form-text>
@@ -51,13 +51,13 @@
                   <template
                     v-if="
                       !$v.form.newPassword.minLength ||
-                        !$v.form.newPassword.maxLength
+                      !$v.form.newPassword.maxLength
                     "
                   >
                     {{
                       $t('pageProfileSettings.newPassLabelTextInfo', {
                         min: passwordRequirements.minLength,
-                        max: passwordRequirements.maxLength
+                        max: passwordRequirements.maxLength,
                       })
                     }}
                   </template>
@@ -110,7 +110,7 @@
               >
                 {{
                   $t('pageProfileSettings.browserOffset', {
-                    timezone
+                    timezone,
                   })
                 }}
               </b-form-radio>
@@ -137,7 +137,7 @@
   maxLength,
   minLength,
   required,
-  sameAs
+  sameAs,
 } from 'vuelidate/lib/validators';
 import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
 import LocalTimezoneLabelMixin from '@/components/Mixins/LocalTimezoneLabelMixin';
@@ -152,15 +152,15 @@
     BVToastMixin,
     LocalTimezoneLabelMixin,
     LoadingBarMixin,
-    VuelidateMixin
+    VuelidateMixin,
   ],
   data() {
     return {
       form: {
         newPassword: '',
         confirmPassword: '',
-        isUtcDisplay: this.$store.getters['global/isUtcDisplay']
-      }
+        isUtcDisplay: this.$store.getters['global/isUtcDisplay'],
+      },
     };
   },
   computed: {
@@ -172,7 +172,7 @@
     },
     timezone() {
       return this.localOffset();
-    }
+    },
   },
   created() {
     this.startLoader();
@@ -186,12 +186,12 @@
         isUtcDisplay: { required },
         newPassword: {
           minLength: minLength(this.passwordRequirements.minLength),
-          maxLength: maxLength(this.passwordRequirements.maxLength)
+          maxLength: maxLength(this.passwordRequirements.maxLength),
         },
         confirmPassword: {
-          sameAsPassword: sameAs('newPassword')
-        }
-      }
+          sameAsPassword: sameAs('newPassword'),
+        },
+      },
     };
   },
   methods: {
@@ -201,12 +201,12 @@
       if (this.$v.$invalid) return;
       let userData = {
         originalUsername: this.username,
-        password: this.form.newPassword
+        password: this.form.newPassword,
       };
 
       this.$store
         .dispatch('localUsers/updateUser', userData)
-        .then(message => {
+        .then((message) => {
           (this.form.newPassword = ''), (this.form.confirmPassword = '');
           this.$v.$reset();
           this.successToast(message);
@@ -227,7 +227,7 @@
       if (this.$v.form.isUtcDisplay.$anyDirty) {
         this.saveTimeZonePrefrenceData();
       }
-    }
-  }
+    },
+  },
 };
 </script>