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: "/",
    name: "home",
    component: () =>
      import(/* webpackChunkName: "home" */ "../views/HomeView.vue"),
  },
  {
    path: "/account",
    name: "account",
    component: () =>
      import(/* webpackChunkName: "account" */ "../views/AccountViewView.vue"),
    beforeEnter: enterOrStart,
  },
  {
    path: "/confirm-contact",
    name: "confirm-contact",
    component: () =>
      import(
        /* webpackChunkName: "confirm-contact" */ "../views/ConfirmContactView.vue"
      ),
  },
  {
    path: "/contact-amounts",
    name: "contact-amounts",
    component: () =>
      import(
        /* webpackChunkName: "contact-amounts" */ "../views/ContactAmountsView.vue"
      ),
  },
  {
    path: "/contact-gives",
    name: "contact-gives",
    component: () =>
      import(
        /* webpackChunkName: "contact-gives" */ "../views/ContactGiftingView.vue"
      ),
  },
  {
    path: "/contact-qr",
    name: "contact-qr",
    component: () =>
      import(
        /* webpackChunkName: "contact-qr" */ "../views/ContactQRScanShowView.vue"
      ),
  },
  {
    path: "/contacts",
    name: "contacts",
    component: () =>
      import(/* webpackChunkName: "contacts" */ "../views/ContactsView.vue"),
  },
  {
    path: "/scan-contact",
    name: "scan-contact",
    component: () =>
      import(
        /* webpackChunkName: "scan-contact" */ "../views/ContactScanView.vue"
      ),
  },
  {
    path: "/discover",
    name: "discover",
    component: () =>
      import(/* webpackChunkName: "discover" */ "../views/DiscoverView.vue"),
  },
  {
    path: "/help",
    name: "help",
    component: () =>
      import(/* webpackChunkName: "help" */ "../views/HelpView.vue"),
  },
  {
    path: "/import-account",
    name: "import-account",
    component: () =>
      import(
        /* webpackChunkName: "import-account" */ "../views/ImportAccountView.vue"
      ),
  },
  {
    path: "/import-derive",
    name: "import-derive",
    component: () =>
      import(
        /* webpackChunkName: "import-derive" */ "../views/ImportDerivedAccountView.vue"
      ),
  },
  {
    path: "/new-edit-account",
    name: "new-edit-account",
    component: () =>
      import(
        /* webpackChunkName: "new-edit-account" */ "../views/NewEditAccountView.vue"
      ),
  },
  {
    path: "/new-edit-commitment",
    name: "new-edit-commitment",
    component: () =>
      import(
        /* webpackChunkName: "new-edit-commitment" */ "../views/NewEditCommitmentView.vue"
      ),
  },
  {
    path: "/new-edit-project",
    name: "new-edit-project",
    component: () =>
      import(
        /* webpackChunkName: "new-edit-project" */ "../views/NewEditProjectView.vue"
      ),
  },
  {
    path: "/new-identifier",
    name: "new-identifier",
    component: () =>
      import(
        /* webpackChunkName: "new-identifier" */ "../views/NewIdentifierView.vue"
      ),
  },
  {
    path: "/identity-switcher",
    name: "identity-switcher",
    component: () =>
      import(
        /* webpackChunkName: "identity-switcher" */ "../views/IdentitySwitcherView.vue"
      ),
  },
  {
    path: "/project",
    name: "project",
    component: () =>
      import(/* webpackChunkName: "project" */ "../views/ProjectViewView.vue"),
  },
  {
    path: "/projects",
    name: "projects",
    component: () =>
      import(/* webpackChunkName: "projects" */ "../views/ProjectsView.vue"),
    beforeEnter: enterOrStart,
  },
  {
    path: "/seed-backup",
    name: "seed-backup",
    component: () =>
      import(
        /* webpackChunkName: "seed-backup" */ "../views/SeedBackupView.vue"
      ),
  },
  {
    path: "/start",
    name: "start",
    component: () =>
      import(/* webpackChunkName: "start" */ "../views/StartView.vue"),
  },
  {
    path: "/statistics",
    name: "statistics",
    component: () =>
      import(
        /* webpackChunkName: "statistics" */ "../views/StatisticsView.vue"
      ),
  },
  {
    path: "/test",
    name: "test",
    component: () =>
      import(/* webpackChunkName: "test" */ "../views/TestView.vue"),
  },
];

/** @type {*} */
const router = createRouter({
  history: createWebHistory(process.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;