refactor(ui): trivial code cleanups
[e-mobility-charging-stations-simulator.git] / ui / web / src / views / ChargingStationsView.vue
index fa313d6ec54b002e7c676eca395a499b0f215410..cbd8a34ba64bf13ad17f8e57a679cb67aa455c63 100644 (file)
                 'open',
                 () => {
                   setToLocalStorage<number>('uiServerConfigurationIndex', state.uiServerIndex)
-                  for (const key in getLocalStorage()) {
-                    if (key.includes('toggle-button')) {
-                      removeFromLocalStorage(key)
-                    }
-                  }
                   $router.currentRoute.value.name !== 'charging-stations' &&
                     $router.push({ name: 'charging-stations' })
                 },
@@ -60,6 +55,7 @@
       <Button @click="stopSimulator()">Stop Simulator</Button>
       <ToggleButton
         :id="'add-charging-stations'"
+        :key="state.renderAddChargingStations"
         :shared="true"
         :on="
           () => {
       <ReloadButton
         id="reload-button"
         :loading="state.loading"
-        @click="loadChargingStations(() => (state.renderChargingStationsList = randomUUID()))"
+        @click="loadChargingStations(() => (state.renderChargingStations = randomUUID()))"
       />
     </Container>
     <CSTable
       v-show="
         Array.isArray(app?.appContext.config.globalProperties.$chargingStations) &&
-        app?.appContext.config.globalProperties.$chargingStations.length > 0
+        app.appContext.config.globalProperties.$chargingStations.length > 0
       "
-      :key="state.renderChargingStationsList"
+      :key="state.renderChargingStations"
       :charging-stations="app?.appContext.config.globalProperties.$chargingStations"
     />
   </Container>
@@ -110,6 +106,21 @@ import ToggleButton from '@/components/buttons/ToggleButton.vue'
 
 const app = getCurrentInstance()
 
+const clearToggleButtons = (): void => {
+  for (const key in getLocalStorage()) {
+    if (key.includes('toggle-button')) {
+      removeFromLocalStorage(key)
+    }
+  }
+}
+
+const clearChargingStations = (): void => {
+  clearToggleButtons()
+  app!.appContext.config.globalProperties.$chargingStations = []
+  state.value.renderAddChargingStations = randomUUID()
+  state.value.renderChargingStations = randomUUID()
+}
+
 const initializeWSEventListeners = () => {
   app?.appContext.config.globalProperties.$uiClient.registerWSEventListener('open', () => {
     uiClient
@@ -126,16 +137,19 @@ const initializeWSEventListeners = () => {
         $toast.error('Error at fetching charging station templates')
         console.error('Error at fetching charging station templates:', error)
       })
-    loadChargingStations(() => (state.value.renderChargingStationsList = randomUUID()))
-  })
-  app?.appContext.config.globalProperties.$uiClient.registerWSEventListener('error', () => {
-    app.appContext.config.globalProperties.$chargingStations = []
-    state.value.renderChargingStationsList = randomUUID()
-  })
-  app?.appContext.config.globalProperties.$uiClient.registerWSEventListener('close', () => {
-    app.appContext.config.globalProperties.$chargingStations = []
-    state.value.renderChargingStationsList = randomUUID()
+    loadChargingStations(() => {
+      state.value.renderAddChargingStations = randomUUID()
+      state.value.renderChargingStations = randomUUID()
+    })
   })
+  app?.appContext.config.globalProperties.$uiClient.registerWSEventListener(
+    'error',
+    clearChargingStations
+  )
+  app?.appContext.config.globalProperties.$uiClient.registerWSEventListener(
+    'close',
+    clearChargingStations
+  )
 }
 
 onMounted(() => {
@@ -143,7 +157,8 @@ onMounted(() => {
 })
 
 const state = ref({
-  renderChargingStationsList: randomUUID(),
+  renderAddChargingStations: randomUUID(),
+  renderChargingStations: randomUUID(),
   loading: false,
   uiServerIndex: getFromLocalStorage<number>('uiServerConfigurationIndex', 0)
 })