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

import 'gnexus-ui-kit/dist/css/kit.css'
import 'gnexus-ui-kit/dist/assets/fonts/phosphor-icons/src/css/icons.css'
import { GnexusUiVue } from 'gnexus-ui-kit/vue'

import App from './App.vue'
import i18n from './i18n'
import { setPageTitle } from './taskui'
import ListView from './views/ListView.vue'
import OptionsView from './views/OptionsView.vue'
import ProjectView from './views/ProjectView.vue'
import ProjectsView from './views/ProjectsView.vue'
import SettingsView from './views/SettingsView.vue'
import StackView from './views/StackView.vue'
import TaskView from './views/TaskView.vue'

const router = createRouter({
  history: createWebHistory(),
  routes: [
    { path: '/', redirect: '/stack' },
    { path: '/stack', component: StackView, meta: { title: 'nav.home' } },
    { path: '/list', component: ListView, meta: { title: 'nav.list' } },
    { path: '/projects', component: ProjectsView, meta: { title: 'nav.projects' } },
    // название проекта/задачи в тайтл подставляет вид после загрузки данных
    { path: '/projects/:id', component: ProjectView, meta: { title: 'nav.projects' } },
    { path: '/tasks/:id', component: TaskView, meta: { title: 'nav.task' } },
    { path: '/options', component: OptionsView, meta: { title: 'nav.options' } },
    { path: '/settings', component: SettingsView, meta: { title: 'nav.settings' } },
  ],
})

// Тайтл вкладки из meta маршрута (виды задач/проектов уточняют его после загрузки)
router.afterEach((to) => {
  const key = to.meta.title as string | undefined
  setPageTitle(key ? i18n.global.t(key) : undefined)
})

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