import './assets/normalize.css'
import './assets/main.css'
import 'leaflet/dist/leaflet.css'
import { createApp } from 'vue'
import { createRouter, createWebHistory } from 'vue-router'

export const BASE_URL = '/api/v1'
export const ALARMS_ENDPOINT = `${BASE_URL}/alarms`
export const ROBOTS_ENDPOINT = `${BASE_URL}/robots`
export const CELLSITES_ENDPOINT = `${BASE_URL}/cellsites`
export const INCIDENTS_ENDPOINT = `${BASE_URL}/incidents`

export const SEVERITY_COLORS: Record<number, string> = {
    1: 'rgb(220, 30, 30)',
    2: 'rgb(220, 120, 30)',
    3: 'rgb(200, 180, 30)',
    4: 'rgb(60, 140, 200)',
    5: 'rgb(80, 160, 180)',
}

const router = createRouter({
  history: createWebHistory(),
  routes: [
    {
        path: '/',
        component: () => import('./pages/Home.vue'),
        // meta: { requiresAuth: true }
    },
    // {
    //     path: '/login',
    //     // component: () => import ('./pages/Login.vue')
    // },
    {
        path: '/cellsites/:id',
        component: () => import('./pages/Cellsite.vue')
        // meta: { requiresAuth: true }
    },
    { path: '/incidents/:id', 
      component: () => import('./pages/Incident.vue') 
    },
    { path: '/robots/:id', 
      component: () => import('./pages/Robots.vue') 
    }
  ]
})

// FIXME: Disabling for demo, not hoooked up anyway
// router.beforeEach((to, from, next) => {
//   const isAuthenticated = !!localStorage.getItem('token')
//   if (to.meta.requiresAuth && !isAuthenticated) {
//     next('/login')
//   } else {
//     next()
//   }
// })

import App from './App.vue'

createApp(App).use(router).mount('#app')
