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>