X-Git-Url: https://git.piment-noir.org/?a=blobdiff_plain;f=ui%2Fweb%2Fsrc%2Fmain.ts;h=a39c049ba99052c4e48a2898fe3039508f1aab15;hb=29fe6fd834029f21b22a23a3342f86b43c277c56;hp=97f0167a740f8b5390eee6c1882f31933d287101;hpb=c25a4046983ef80409cbc4546f944231e8655604;p=e-mobility-charging-stations-simulator.git

diff --git a/ui/web/src/main.ts b/ui/web/src/main.ts
index 97f0167a..a39c049b 100644
--- a/ui/web/src/main.ts
+++ b/ui/web/src/main.ts
@@ -1,47 +1,71 @@
-import { createApp } from 'vue'
+import 'vue-toast-notification/dist/theme-bootstrap.css'
+
+import { type App as AppType, createApp, ref } from 'vue'
 import ToastPlugin from 'vue-toast-notification'
-import type { ConfigurationData, ResponsePayload } from './types'
-import { router } from '@/router'
-import { UIClient } from '@/composables'
+
 import App from '@/App.vue'
-import 'vue-toast-notification/dist/theme-bootstrap.css'
+import { getFromLocalStorage, setToLocalStorage, UIClient } from '@/composables'
+import { router } from '@/router'
+import type { ChargingStationData, ConfigurationData, UIServerConfigurationSection } from '@/types'
 
-const initializeApp = (config: ConfigurationData) => {
-  const app = createApp(App)
+const app = createApp(App)
+
+const initializeApp = (app: AppType, config: ConfigurationData) => {
   app.config.errorHandler = (error, instance, info) => {
     console.error('Error:', error)
     console.info('Vue instance:', instance)
     console.info('Error info:', info)
     // TODO: add code for UI notifications or other error handling logic
   }
-  app.config.globalProperties.$uiClient = UIClient.getInstance(config.uiServer)
-  app.config.globalProperties.$uiClient.registerWSEventListener('open', () => {
-    app.config.globalProperties.$uiClient
-      .listChargingStations()
-      .then((response: ResponsePayload) => {
-        app.config.globalProperties.$chargingStations = response.chargingStations
+  if (!Array.isArray(config.uiServer)) {
+    config.uiServer = [config.uiServer]
+  }
+  if (app.config.globalProperties.$configuration == null) {
+    app.config.globalProperties.$configuration = ref<ConfigurationData>(config)
+  }
+  if (!Array.isArray(app.config.globalProperties.$templates?.value)) {
+    app.config.globalProperties.$templates = ref<string[]>([])
+  }
+  if (!Array.isArray(app.config.globalProperties.$chargingStations?.value)) {
+    app.config.globalProperties.$chargingStations = ref<ChargingStationData[]>([])
+  }
+  if (
+    getFromLocalStorage<number | undefined>('uiServerConfigurationIndex', undefined) == null ||
+    getFromLocalStorage<number>('uiServerConfigurationIndex', 0) >
+      (app.config.globalProperties.$configuration.value.uiServer as UIServerConfigurationSection[])
+        .length -
+        1
+  ) {
+    setToLocalStorage<number>('uiServerConfigurationIndex', 0)
+  }
+  if (app.config.globalProperties.$uiClient == null) {
+    app.config.globalProperties.$uiClient = UIClient.getInstance(
+      (app.config.globalProperties.$configuration.value.uiServer as UIServerConfigurationSection[])[
+        getFromLocalStorage<number>('uiServerConfigurationIndex', 0)
+      ]
+    )
+  }
+  app.use(router).use(ToastPlugin).mount('#app')
+}
+
+fetch('/config.json')
+  .then(response => {
+    if (!response.ok) {
+      // TODO: add code for UI notifications or other error handling logic
+      console.error('Failed to fetch app configuration')
+      return
+    }
+    response
+      .json()
+      .then(config => {
+        initializeApp(app, config)
       })
-      .catch((error: Error) => {
+      .catch(error => {
         // TODO: add code for UI notifications or other error handling logic
-        console.error('Error at fetching charging stations:', error)
-        throw error
-      })
-      .finally(() => {
-        app.use(router).use(ToastPlugin).mount('#app')
+        console.error('Error at deserializing JSON app configuration:', error)
       })
   })
-}
-
-fetch('/config.json')
-  .then(response => response.json())
   .catch(error => {
+    // TODO: add code for UI notifications or other error handling logic
     console.error('Error at fetching app configuration:', error)
-    throw error
-  })
-  .then(config => {
-    initializeApp(config)
-  })
-  .catch(error => {
-    console.error('Error at initializing app:', error)
-    throw error
   })