import { createWebHistory, createRouter } from "vue-router";
import Home from "../views/Home.vue";
import Notifications from "../views/Notifications.vue";
import Reunions from "../views/Reunions.vue";
import Inspirations from "../views/Inspirations.vue";
import Project from "../views/Project.vue";
import { useApiStore } from "../stores/api";
import { usePageStore } from "../stores/page";
import { getActivePinia } from "pinia";

const routes = [
  {
    path: "/",
    component: Home,
  },
  {
    path: "/notifications",
    component: Notifications,
  },
  {
    path: "/reunions",
    component: Reunions,
  },
  {
    path: "/inspirations",
    component: Inspirations,
  },
  {
    path: "/projects/:id",
    component: Project,
  },
];

const router = createRouter({
  history: createWebHistory(),
  routes,
});

router.beforeEach(async (to, from, next) => {
  const pinia = getActivePinia();
  const api = useApiStore(pinia);
  const page = usePageStore(pinia);

  try {
    const res = await api.fetchPageData(to.path);

    page.page = res;
    next();
  } catch (error) {
    console.error(error);
    next(false);
  }
});

export { router };