import { createRouter, createWebHistory } from 'vue-router'

const MainLayout = () => import('../layouts/MainLayout.vue')
const DashboardView = () => import('../views/DashboardView.vue')
const LoginView = () => import('../views/LoginView.vue')
const SettingsView = () => import('../views/SettingsView.vue')
const ReleasesView = () => import('../views/ReleasesView.vue')
const VehiclesView = () => import('../views/VehiclesView.vue')
const TasksView = () => import('../views/TasksView.vue')
const AgentDebugView = () => import('../views/AgentDebugView.vue')

const router = createRouter({
  history: createWebHistory(),
  routes: [
    {
      path: '/login',
      name: 'login',
      component: LoginView
    },
    {
      path: '/',
      component: MainLayout,
      children: [
        {
          path: '',
          name: 'dashboard',
          component: DashboardView
        },
        {
          path: 'releases',
          name: 'releases',
          component: ReleasesView
        },
        {
          path: 'vehicles',
          name: 'vehicles',
          component: VehiclesView
        },
        {
          path: 'tasks',
          name: 'tasks',
          component: TasksView
        },
        {
          path: 'settings',
          name: 'settings',
          component: SettingsView
        },
        {
          path: 'agent-debug',
          name: 'agent-debug',
          component: AgentDebugView,
          meta: { roles: ['SUPER_ADMIN', 'ADMIN', 'AGENT'] }
        }
      ]
    }
  ]
})

router.beforeEach((to) => {
  const token = localStorage.getItem('ota-ui-token')
  const roles = JSON.parse(localStorage.getItem('ota-ui-roles') || '[]')
  const isLoggedIn = !!token
  if (to.path !== '/login' && !isLoggedIn) {
    return '/login'
  }
  if (to.path === '/login' && isLoggedIn) {
    return '/'
  }
  const requiredRoles = to.meta.roles || []
  if (requiredRoles.length && !requiredRoles.some((role) => roles.includes(role))) {
    return '/'
  }
})

export default router