import type { RouteRecordRaw } from "vue-router";
const Error404NotFound = () => import("@/views/Error404NotFound.vue");
const data = await fetch("/toc.json").then((r) => r.json());

const manual = data.filter((v: any) => v.children);

const mergeManual: any[] = [];

manual.forEach((v: any) => mergeManual.push(...v.children));

const manualRoute = mergeManual.map(
  (v): { path: string; name: string; component: Function } => {
    return {
      path: v.path,
      name: "Manual",
      component: () => import("@/modules/01_manual/MainPage.vue"),
    };
  }
);

const route: RouteRecordRaw[] = [
  {
    path: "/manual/:name",
    name: "Manual",
    component: () => import("@/modules/01_manual/MainPage.vue"),
    beforeEnter: (to, from, next) => {
      const itemExists = manualRoute.some((item) => item.path === to.fullPath);

      if (itemExists) {
        next();
      } else {
        next({
          name: "Error404NotFound",
          params: { pathMatch: to.path.substring(1).split("/") },
        });
      }
    },
  },
  {
    path: "/build-and-deploy",
    name: "BuildAndDeploy",
    component: () => import("@/modules/02_pages/MainPage.vue"),
  },
  {
    path: "/debug",
    name: "Debug",
    component: () => import("@/modules/02_pages/MainPage.vue"),
  },
  // {
  //   path: "/:name",
  //   name: "Pages",
  //   component: () => import("@/modules/02_pages/MainPage.vue"),
  // },
  {
    path: "/:pathMatch(.*)*",
    name: "Error404NotFound",
    component: Error404NotFound,
    props: true,
  },
];

export default route;