import { createRouter, createWebHistory } from 'vue-router'
import { useAuthStore } from '@s/useAuthStore';


// 초기 렌더링 속도를 위해 지연 로딩 사용
const routes = [
    {
        path: '/',
        name: "Home",
        component: () => import('@v/MainView.vue'),
        // meta: { requiresAuth: true }
    },
    {
        path: '/board',
        component: () => import('@v/board/TheBoard.vue'),
        children: [
            {
                path: '',
                name: 'BoardList',
                component: () => import('@v/board/BoardList.vue')
            },
            {
                path: 'write',
                component: () => import('@v/board/BoardWrite.vue')
            },
            {
                path: ':id',
                name: 'BoardDetail',
                component: () => import('@v/board/BoardView.vue')
            },
            {
                path: 'edit/:id',
                name: 'BoardEdit',
                component: () => import('@v/board/BoardEdit.vue')
            }
        ]
    },
    {
        path: '/wordDict',
        component: () => import('@v/wordDict/wordDict.vue'),
    },
    {
        path: '/login',
        name: 'Login',
        component: () => import('@v/user/TheLogin.vue'),
        meta: { layout: 'NoLayout', requiresGuest: true },
    },
    {
        path: '/register',
        name: 'Register',
        component: () => import('@v/user/TheRegister.vue'),
        meta: { layout: 'NoLayout', requiresGuest: true },
    },
    {
        path: '/pw',
        name: 'Password',
        component: () => import('@v/user/ThePassword.vue'),
        meta: { layout: 'NoLayout', requiresGuest: true },
    },
    {
        path: '/vacation',
        component: () => import('@v/vacation/VacationManagement.vue'),
    },
    {
        path: '/voteboard',
        component: () => import('@v/voteboard/TheVoteBoard.vue'),
        children: [
            {
                path: '',
                component: () => import('@v/voteboard/voteBoardList.vue')
            },
            {
                path: 'write',
                component: () => import('@v/voteboard/voteboardWrite.vue')
            },

        ]
    },
    {
        path: '/projectlist',
        component: () => import('@v/projectlist/TheProjectList.vue'),
    },
    {
        path: '/commuters',
        component: () => import('@v/commuters/TheCommuters.vue'),
    },
    {
        path: '/sample',
        component: () => import('@c/calendar/SampleCalendar.vue'),
    },
    {
        path: "/:anything(.*)",
        component: () => import('@v/ErrorPage.vue'),
    }
];

const router = createRouter({
    history: createWebHistory(import.meta.env.BASE_URL),
    routes: routes,
})

router.beforeEach(async (to, from, next) => {
    const authStore = useAuthStore();
    await authStore.checkAuthStatus(); // 로그인 상태 확인

    if (to.meta.requiresAuth && !authStore.isAuthenticated) {
        // 로그인이 필요한 페이지인데 로그인되지 않은 경우 → 로그인 페이지로 이동
        next({ name: 'Login' });
    } else if (to.meta.requiresGuest && authStore.isAuthenticated) {
        // 비로그인 사용자만 접근 가능한 페이지인데 로그인된 경우 → 홈으로 이동
        next({ name: 'Home' });
    } else {
        next();
    }
});


router.beforeEach(async (to, from, next) => {
    const authStore = useAuthStore()

    // 최초 앱 로드 시 인증 상태 체크
    await authStore.checkAuthStatus()

    // 현재 라우트에 인증이 필요한지 확인
    const requiresAuth = to.meta.requiresAuth === true

    if (requiresAuth && !authStore.isAuthenticated) {
        // 인증되지 않은 사용자를 로그인 페이지로 리다이렉트
        // 원래 가려던 페이지를 쿼리 파라미터로 전달
        next({
            name: 'Login',
            query: { redirect: to.fullPath }
        })
    } else {
        next()
    }
})

export default router