import { defineStore } from "pinia";
import { ref, computed, watch } from "vue";
import { Cookies } from "quasar";
import { permissionStore } from "src/stores/permission";
import { userStore } from "src/stores/user";

export const navigationStore = defineStore("navigation", () => {
  const miniState = ref(Cookies.get("miniState") === "true");

  const toggleMini = () => {
    miniState.value = !miniState.value;
  };

  watch(miniState, (val) => {
    Cookies.set("miniState", val, { path: "/", sameSite: "Lax" });
  });

  const navigationStructure = Object.freeze([
    //ADMINISTRADOR
    {
      type: "single",
      title: "ui.navigation.dashboard",
      name: "DashboardPage",
      icon: "mdi-view-dashboard-outline",
      permission: false,
      permissionScope: "dashboard",
      allowedTypes: ["administrador"],
    },
    {
      type: "single",
      title: "ui.navigation.associados",
      name: "GestaoAssociadosPage",
      icon: "mdi-account-group-outline",
      permission: false,
      permissionScope: "associado",
      allowedTypes: ["administrador"],
    },
    {
      type: "single",
      title: "ui.navigation.partners",
      name: "ParceirosPage",
      icon: "mdi-handshake-outline",
      permission: false,
      permissionScope: "parceiro",
      allowedTypes: ["administrador"],
    },
    {
      type: "single",
      title: "ui.navigation.convenios_medicos",
      name: "ConveniosMedicosPage",
      icon: "mdi-hospital-box-outline",
      permission: false,
      permissionScope: "parceiro",
      allowedTypes: ["administrador"],
    },
    {
      type: "single",
      title: "ui.navigation.store",
      name: "LojaPage",
      icon: "mdi-cart-outline",
      permission: false,
      permissionScope: "loja",
      allowedTypes: ["administrador"],
    },
    {
      type: "single",
      title: "ui.navigation.appointments",
      name: "AppointmentsPage",
      icon: "mdi-calendar-check-outline",
      permission: false,
      permissionScope: "agendamento",
      allowedTypes: ["administrador"],
    },
    {
      type: "single",
      title: "ui.navigation.notifications",
      name: "NotificationsAdminPage",
      icon: "mdi-bell-outline",
      permission: false,
      permissionScope: "notificacao",
      allowedTypes: ["administrador"],
    },
    {
      type: "single",
      title: "ui.navigation.relatorios",
      name: "RelatoriosPage",
      icon: "mdi-chart-bar",
      permission: false,
      permissionScope: "relatorio",
      allowedTypes: ["administrador"],
    },

    //ASSOCIADO
    {
      type: "single",
      title: "ui.navigation.meu_perfil",
      name: "MeuPerfilPage",
      icon: "mdi-account-outline",
      permission: false,
      permissionScope: "associado.perfil",
      allowedTypes: ["associado"],
    },
    {
      type: "single",
      title: "ui.navigation.carteirinha",
      name: "CarteirinhaPage",
      icon: "mdi-card-account-details-outline",
      permission: false,
      permissionScope: "associado.carteirinha",
      allowedTypes: ["associado"],
    },
    {
      type: "single",
      title: "ui.navigation.convenios",
      name: "ConveniosPage",
      icon: "mdi-heart-outline",
      permission: false,
      permissionScope: "associado.convenio",
      allowedTypes: ["associado"],
    },
    {
      type: "single",
      title: "ui.navigation.loja",
      name: "AssociadoLojaPage",
      icon: "mdi-cart-outline",
      permission: false,
      permissionScope: "associado.loja",
      allowedTypes: ["associado"],
    },
    {
      type: "single",
      title: "ui.navigation.meus_interesses",
      name: "AssociadoInteressesPage",
      icon: "mdi-heart-outline",
      permission: false,
      permissionScope: "associado.interesses",
      allowedTypes: ["associado"],
    },
    {
      type: "single",
      title: "ui.navigation.meus_agendamentos",
      name: "AssociadoAgendamentosPage",
      icon: "mdi-calendar-clock-outline",
      permission: false,
      permissionScope: "associado.agendamento",
      allowedTypes: ["associado"],
    },
    {
      type: "single",
      title: "ui.navigation.notifications",
      name: "NotificacoesAssociadoPage",
      icon: "mdi-bell-outline",
      permission: false,
      permissionScope: "associado.notificacao",
      allowedTypes: ["associado"],
    },

    //PARCEIRO
    {
      type: "single",
      title: "ui.navigation.dashboard",
      name: "ParceiroHomePage",
      icon: "mdi-view-dashboard-outline",
      permission: false,
      permissionScope: "dashboard",
      allowedTypes: ["parceiro"],
    },
    {
      type: "single",
      title: "ui.navigation.validar_carteirinha",
      name: "ValidarCarteirinhaPage",
      icon: "mdi-check",
      permission: false,
      permissionScope: "parceiro.carteirinha",
      allowedTypes: ["parceiro"],
    },
    {
      type: "single",
      title: "ui.navigation.appointments",
      name: "AgendamentosPage",
      icon: "mdi-calendar-clock-outline",
      permission: false,
      permissionScope: "parceiro.agendamento",
      allowedTypes: ["parceiro"],
    },
    {
      type: "single",
      title: "ui.navigation.meus_dados",
      name: "MeusDadosPage",
      icon: "mdi-account-box-outline",
      permission: false,
      permissionScope: "parceiro.dados",
      allowedTypes: ["parceiro"],
    },
    {
      type: "single",
      title: "ui.navigation.notifications",
      name: "NotificacoesPage",
      icon: "mdi-bell-outline",
      permission: false,
      permissionScope: "parceiro.notificacao",
      allowedTypes: ["parceiro"],
    },
  ]);

  const getNavigationAccess = () => {
    const { getAccess } = permissionStore();
    const { userTipo } = userStore();

    return navigationStructure
      .filter((menu) => {
        if (!menu.allowedTypes || menu.allowedTypes.length === 0) return true;
        return menu.allowedTypes.includes(userTipo);
      })
      .map((menu) => {
        if (menu.type === "expansive") {
          if (getAccess(menu.permissionScope, "menu")) menu.permission = true;
          menu.childrens = menu.childrens.filter((child) => {
            if (!child?.permissionScope) return true;
            child.permission = getAccess(child.permissionScope, "menu");
            return child.permission;
          });
          return menu.childrens.length > 0 ? menu : null;
        } else {
          if (!menu?.permissionScope) return menu;
          menu.permission = getAccess(menu.permissionScope, "menu");
          return menu;
        }
      })
      .filter((menu) => menu !== null && menu.permission);
  };

  const navigationItems = computed(() => getNavigationAccess());

  return {
    miniState,
    toggleMini,
    navigationItems,
  };
});
