ui/web/src/main.ts

   1 import { type App as AppType, createApp } from 'vue'
   2 import ToastPlugin from 'vue-toast-notification'
   3 import type { ConfigurationData, ResponsePayload } from '@/types'
   4 import { router } from '@/router'
   5 import { UIClient, getFromLocalStorage, setToLocalStorage } from '@/composables'
   6 import App from '@/App.vue'
   7 import 'vue-toast-notification/dist/theme-bootstrap.css'
   8
   9 const app = createApp(App)
  10
  11 const initializeApp = (app: AppType, config: ConfigurationData) => {
  12   app.config.errorHandler = (error, instance, info) => {
  13     console.error('Error:', error)
  14     console.info('Vue instance:', instance)
  15     console.info('Error info:', info)
  16     // TODO: add code for UI notifications or other error handling logic
  17   }
  18   if (!Array.isArray(config.uiServer)) {
  19     config.uiServer = [config.uiServer]
  20   }
  21   if (app.config.globalProperties.$configuration == null) {
  22     app.config.globalProperties.$configuration = config
  23   }
  24   if (!Array.isArray(app.config.globalProperties.$chargingStations)) {
  25     app.config.globalProperties.$chargingStations = []
  26   }
  27   if (
  28     getFromLocalStorage<number | undefined>('uiServerConfigurationIndex', undefined) == null ||
  29     getFromLocalStorage<number>('uiServerConfigurationIndex', 0) >
  30       app.config.globalProperties.$configuration.uiServer.length - 1
  31   ) {
  32     setToLocalStorage<number>('uiServerConfigurationIndex', 0)
  33   }
  34   if (app.config.globalProperties.$uiClient == null) {
  35     app.config.globalProperties.$uiClient = UIClient.getInstance(
  36       app.config.globalProperties.$configuration.uiServer[
  37         getFromLocalStorage<number>('uiServerConfigurationIndex', 0)
  38       ]
  39     )
  40     app.config.globalProperties.$uiClient.registerWSEventListener(
  41       'open',
  42       () => {
  43         app.config.globalProperties.$uiClient
  44           .listChargingStations()
  45           .then((response: ResponsePayload) => {
  46             app.config.globalProperties.$chargingStations = response.chargingStations
  47           })
  48           .catch((error: Error) => {
  49             // TODO: add code for UI notifications or other error handling logic
  50             console.error('Error at fetching charging stations:', error)
  51           })
  52           .finally(() => {
  53             app.use(router).use(ToastPlugin).mount('#app')
  54           })
  55       },
  56       { once: true }
  57     )
  58   }
  59 }
  60
  61 fetch('/config.json')
  62   .then(response => {
  63     if (!response.ok) {
  64       // TODO: add code for UI notifications or other error handling logic
  65       console.error('Failed to fetch app configuration')
  66       return
  67     }
  68     response
  69       .json()
  70       .then(config => {
  71         try {
  72           initializeApp(app, config)
  73         } catch (error) {
  74           // TODO: add code for UI notifications or other error handling logic
  75           console.error('Error at initializing app:', error)
  76         }
  77       })
  78       .catch(error => {
  79         // TODO: add code for UI notifications or other error handling logic
  80         console.error('Error at deserializing JSON app configuration:', error)
  81       })
  82   })
  83   .catch(error => {
  84     // TODO: add code for UI notifications or other error handling logic
  85     console.error('Error at fetching app configuration:', error)
  86   })