import {
  createRouter,
  createWebHistory,
  NavigationGuardNext,
  RouteLocationNormalized,
  RouteRecordRaw,
} from "vue-router";
import { accountsDB } from "@/db/index";

/**
 *
 * @param to :RouteLocationNormalized
 * @param from :RouteLocationNormalized
 * @param next :NavigationGuardNext
 */
const enterOrStart = async (
  to: RouteLocationNormalized,
  from: RouteLocationNormalized,
  next: NavigationGuardNext,
) => {
  await accountsDB.open();
  const num_accounts = await accountsDB.accounts.count();
  if (num_accounts > 0) {
    next();
  } else {
    next({ name: "start" });
  }
};

const routes: Array<RouteRecordRaw> = [
  {
    path: "/account",
    name: "account",
    component: () => import("../views/AccountViewView.vue"),
  },
  {
    path: "/claim/:id?",
    name: "claim",
    component: () => import("../views/ClaimView.vue"),
  },
  {
    path: "/claim-add-raw/:id?",
    name: "claim-add-raw",
    component: () => import("../views/ClaimAddRawView.vue"),
  },
  {
    path: "/confirm-contact",
    name: "confirm-contact",
    component: () => import("../views/ConfirmContactView.vue"),
  },
  {
    path: "/confirm-gift/:id?",
    name: "confirm-gift",
    component: () => import("@/views/ConfirmGiftView.vue"),
  },
  {
    path: "/contact-amounts",
    name: "contact-amounts",
    component: () => import("../views/ContactAmountsView.vue"),
  },
  {
    path: "/contact-gift",
    name: "contact-gift",
    component: () => import("../views/ContactGiftingView.vue"),
  },
  {
    path: "/contact-import",
    name: "contact-import",
    component: () => import("../views/ContactImportView.vue"),
  },
  {
    path: "/contact-qr",
    name: "contact-qr",
    component: () => import("../views/ContactQRScanShowView.vue"),
  },
  {
    path: "/contacts",
    name: "contacts",
    component: () => import("../views/ContactsView.vue"),
  },
  {
    path: "/did/:did?",
    name: "did",
    component: () => import("../views/DIDView.vue"),
  },
  {
    path: "/discover",
    name: "discover",
    component: () => import("../views/DiscoverView.vue"),
  },
  {
    path: "/gifted-details",
    name: "gifted-details",
    component: () => import("../views/GiftedDetails.vue"),
  },
  {
    path: "/help",
    name: "help",
    component: () => import("../views/HelpView.vue"),
  },
  {
    path: "/help-notifications",
    name: "help-notifications",
    component: () => import("../views/HelpNotificationsView.vue"),
  },
  {
    path: "/help-onboarding",
    name: "help-onboarding",
    component: () => import("../views/HelpOnboardingView.vue"),
  },
  {
    path: "/",
    name: "home",
    component: () => import("../views/HomeView.vue"),
  },
  {
    path: "/identity-switcher",
    name: "identity-switcher",
    component: () => import("../views/IdentitySwitcherView.vue"),
  },
  {
    path: "/import-account",
    name: "import-account",
    component: () => import("../views/ImportAccountView.vue"),
  },
  {
    path: "/import-derive",
    name: "import-derive",
    component: () => import("../views/ImportDerivedAccountView.vue"),
  },
  {
    path: "/new-edit-account",
    name: "new-edit-account",
    component: () => import("../views/NewEditAccountView.vue"),
  },
  {
    path: "/new-edit-project",
    name: "new-edit-project",
    component: () => import("../views/NewEditProjectView.vue"),
  },
  {
    path: "/new-identifier",
    name: "new-identifier",
    component: () => import("../views/NewIdentifierView.vue"),
  },
  {
    path: "/project/:id?",
    name: "project",
    component: () => import("../views/ProjectViewView.vue"),
  },
  {
    path: "/projects",
    name: "projects",
    component: () => import("../views/ProjectsView.vue"),
    beforeEnter: enterOrStart,
  },
  {
    path: "/quick-action-bvc",
    name: "quick-action-bvc",
    component: () => import("../views/QuickActionBvcView.vue"),
  },
  {
    path: "/quick-action-bvc-begin",
    name: "quick-action-bvc-begin",
    component: () => import("../views/QuickActionBvcBeginView.vue"),
  },
  {
    path: "/quick-action-bvc-end",
    name: "quick-action-bvc-end",
    component: () => import("../views/QuickActionBvcEndView.vue"),
  },
  {
    path: "/scan-contact",
    name: "scan-contact",
    component: () => import("../views/ContactScanView.vue"),
  },
  {
    path: "/search-area",
    name: "search-area",
    component: () => import("../views/SearchAreaView.vue"),
  },
  {
    path: "/seed-backup",
    name: "seed-backup",
    component: () => import("../views/SeedBackupView.vue"),
  },
  {
    path: "/shared-photo",
    name: "shared-photo",
    component: () => import("@/views/SharedPhotoView.vue"),
  },

  // /share-target is also an endpoint in the service worker

  {
    path: "/start",
    name: "start",
    component: () => import("../views/StartView.vue"),
  },
  {
    path: "/statistics",
    name: "statistics",
    component: () => import("../views/StatisticsView.vue"),
  },
  {
    path: "/test",
    name: "test",
    component: () => import("../views/TestView.vue"),
  },
];

/** @type {*} */
const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes,
});

const errorHandler = (
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
  error: any,
  to: RouteLocationNormalized,
  from: RouteLocationNormalized,
) => {
  // Handle the error here
  console.error("Caught in top level error handler:", error, to, from);

  // You can also perform additional actions, such as displaying an error message or redirecting the user to a specific page
};

router.onError(errorHandler); // Assign the error handler to the router instance

export default router;
