import { isNil } from 'lodash';
import { Store } from 'src/store';
import { createMemoryHistory, createRouter, createWebHashHistory, createWebHistory } from 'vue-router';
import routes from './routes';

interface PartialAuthState {
  token: string;
  currentUser: {
    permisos: number[];
  };
}

const getAuth = () => {
  const auth = (Store.state as any).auth as PartialAuthState;
  return {
    token: auth.token ?? null,
    ca: auth.currentUser?.permisos || [],
  };
};

const createHistory = process.env.SERVER ? createMemoryHistory : process.env.VUE_ROUTER_MODE === 'history' ? createWebHistory : createWebHashHistory;

const Router = createRouter({
  history: createHistory(),
  routes,
  scrollBehavior: () => ({ left: 0, top: 0 }),
});

const closeAllDialogs = () => {
  const dialogs = document.querySelectorAll('[id^="q-portal--dialog--"]');
  Array.from(dialogs).forEach((dialog) => {
    const el = dialog as HTMLElement;
    const parent = el.parentElement;
    if (parent) {
      parent.removeChild(el);
    }
  });
};

Router.beforeEach((to, from, next) => {
  closeAllDialogs();
  const token = getAuth().token;
  const requiresAuth = to.matched.some((record) => record.meta.requiresAuth);
  if (requiresAuth && !token) next('/login');
  else if (to.matched.some((record) => 'ca' in record.meta && !isNil(record.meta.ca))) {
    const userCa = getAuth().ca;
    const allow = userCa.some((ca) => (to.meta.ca as number[]).includes(ca));
    if (!allow) {
      next('/403');
    } else {
      next();
    }
  } else next();
});

export default Router;