ff-admin/src/stores/admin/navigation.ts

import { defineStore } from "pinia";
import { useAbilityStore } from "@/stores/ability";
import router from "@/router";

export interface navigationModel {
  club: navigationSplitModel;
  settings: navigationSplitModel;
  user: navigationSplitModel;
}

export interface navigationSplitModel {
  topTitle?: string;
  top?: Array<navigationLinkModel>;
  mainTitle: string;
  main: Array<navigationLinkModel>;
}

export type topLevelNavigationType = "club" | "settings" | "user";

export interface topLevelNavigationModel {
  key: topLevelNavigationType;
  title: string;
  levelDefault: string;
}

export interface navigationLinkModel {
  key: string;
  title: string;
}

export const useNavigationStore = defineStore("navigation", {
  state: () => {
    return {
      activeNavigation: "club" as topLevelNavigationType,
      activeLink: null as null | string,
      topLevel: [] as Array<topLevelNavigationModel>,
      navigation: {} as navigationModel,
    };
  },
  getters: {
    activeNavigationObject: (state) => (state.navigation[state.activeNavigation] ?? {}) as navigationSplitModel,
    activeTopLevelObject: (state) =>
      (state.topLevel.find((elem) => elem.key == state.activeNavigation) ?? {}) as topLevelNavigationModel,
  },
  actions: {
    resetNavigation() {
      this.$reset();
    },
    updateTopLevel() {
      const abilityStore = useAbilityStore();
      this.topLevel = [
        ...(abilityStore.canSection("read", "club")
          ? [
              {
                key: "club",
                title: "Verein",
                levelDefault: "member",
              } as topLevelNavigationModel,
            ]
          : []),
        ...(abilityStore.canSection("read", "settings")
          ? [
              {
                key: "settings",
                title: "Einstellungen",
                levelDefault: "salutation",
              } as topLevelNavigationModel,
            ]
          : []),
        ...(abilityStore.canSection("read", "user")
          ? [
              {
                key: "user",
                title: "Benutzer",
                levelDefault: "user",
              } as topLevelNavigationModel,
            ]
          : []),
      ];
      if (this.topLevel.findIndex((e) => e.key == this.activeNavigation) == -1) {
        this.activeNavigation = this.topLevel[0]?.key ?? "club";
        router.push({ name: `admin-${this.topLevel[0]?.key ?? "club"}-default` });
      }
    },
    updateNavigation() {
      const abilityStore = useAbilityStore();
      this.navigation = {
        club: {
          mainTitle: "Verein",
          main: [
            ...(abilityStore.can("read", "club", "member") ? [{ key: "member", title: "Mitglieder" }] : []),
            ...(abilityStore.can("read", "club", "calendar") ? [{ key: "calendar", title: "Kalender" }] : []),
            ...(abilityStore.can("read", "club", "protocol") ? [{ key: "protocol", title: "Protokolle" }] : []),
            ...(abilityStore.can("read", "club", "newsletter") ? [{ key: "newsletter", title: "Newsletter" }] : []),
            ...(abilityStore.can("read", "club", "query") ? [{ key: "query_builder", title: "Query Builder" }] : []),
          ],
        },
        settings: {
          mainTitle: "Einstellungen",
          main: [
            { key: "divider1", title: "Mitgliederdaten" },
            ...(abilityStore.can("read", "settings", "salutation") ? [{ key: "salutation", title: "Anrede" }] : []),
            ...(abilityStore.can("read", "settings", "award") ? [{ key: "award", title: "Auszeichnungen" }] : []),
            ...(abilityStore.can("read", "settings", "communication_type")
              ? [{ key: "communication_type", title: "Kommunikationsarten" }]
              : []),
            ...(abilityStore.can("read", "settings", "membership_status")
              ? [{ key: "membership_status", title: "Mitgliedsstatus" }]
              : []),
            ...(abilityStore.can("read", "settings", "qualification")
              ? [{ key: "qualification", title: "Qualifikationen" }]
              : []),
            ...(abilityStore.can("read", "settings", "executive_position")
              ? [{ key: "executive_position", title: "Vereinsämter" }]
              : []),
            { key: "divider2", title: "Einstellungen" },
            ...(abilityStore.can("read", "settings", "newsletter_config")
              ? [{ key: "newsletter_config", title: "Newsletter Konfiguration" }]
              : []),
            ...(abilityStore.can("read", "settings", "template") ? [{ key: "template", title: "Templates" }] : []),
            ...(abilityStore.can("read", "settings", "template_usage")
              ? [{ key: "template_usage", title: "Template-Verwendung" }]
              : []),
            ...(abilityStore.can("read", "settings", "calendar_type")
              ? [{ key: "calendar_type", title: "Terminarten" }]
              : []),
            ...(abilityStore.can("read", "settings", "query") ? [{ key: "query_store", title: "Query Store" }] : []),
          ],
        },
        user: {
          mainTitle: "Benutzer",
          main: [
            ...(abilityStore.can("read", "user", "user") ? [{ key: "user", title: "Benutzer" }] : []),
            ...(abilityStore.can("read", "user", "role") ? [{ key: "role", title: "Rollen" }] : []),
            ...(abilityStore.can("read", "user", "webapi") ? [{ key: "webapi", title: "Webapi-Token" }] : []),
            ...(abilityStore.can("read", "user", "backup") ? [{ key: "backup", title: "Backups" }] : []),
          ],
        },
      } as navigationModel;
      if (
        this.activeNavigationObject.main.findIndex((e) => e.key == this.activeLink) == -1 ||
        this.activeLink == "default"
      ) {
        let link = this.activeNavigationObject.main[0].key;
        router.push({ name: `admin-${this.activeNavigation}-${link}` });
      }
    },
  },
});