import { createRouter, createWebHistory } from "vue-router"; import HomePage from "@/views/HomePage.vue"; import LoginPage from "@/views/LoginPage.vue"; import SignupPage from "@/views/SignupPage.vue"; import CheckEmailPage from "@/views/CheckEmailPage.vue"; import ConfirmEmailPage from "@/views/ConfirmEmailPage.vue"; import ProfilePage from "@/views/ProfilePage.vue"; import PostPage from "@/views/PostPage.vue"; import NewPostPage from "@/views/NewPostPage.vue"; import { useAuthStore } from "@/stores/auth"; const router = createRouter({ history: createWebHistory(import.meta.env.BASE_URL), routes: [ { path: "/", name: "home", component: HomePage }, { path: "/login", name: "login", component: LoginPage, beforeEnter: requireGuest, }, { path: "/signup", name: "signup", component: SignupPage, beforeEnter: requireGuest, }, { path: "/check-email", name: "check-email", component: CheckEmailPage, }, { path: "/confirm-email", name: "confirm-email", component: ConfirmEmailPage, beforeEnter: (to) => { if (!to.query.token) return { name: "login" }; }, }, { path: "/users/:displayName", name: "profile", component: ProfilePage, props: true, }, { path: "/users/:displayName/posts/new", name: "new-post", component: NewPostPage, props: true, beforeEnter: requireAuth, }, { path: "/posts/:id", name: "post", component: PostPage, props: true, }, ], }); router.beforeEach(async () => { const auth = useAuthStore(); if (!auth.checked) { await auth.fetchMe(); } auth.clearError(); }); async function requireGuest() { const auth = useAuthStore(); if (!auth.checked) await auth.fetchMe(); if (auth.user) return { name: "home" }; } async function requireAuth() { const auth = useAuthStore(); if (!auth.checked) await auth.fetchMe(); if (!auth.user) return { name: "login" }; } export default router;