export type SettingsButton =
  | "options"
  | "optionsLanguage"
  | "options2048"
  | "optionsStartUp"
  | "clock"
  | "clockAchievements"
  | "clockTime"
  | "clockDate"
  | "user"
  | "userBirthday"
  | "userUserName"
  | "userSnake"
  | "userColor"
  | "touchScreen";

export const useSettingsStore = defineStore("settings", {
  state: () => ({
    currentMenu: null as SettingsMenu | null,
    currentSubMenu: null as SettingsSubMenu | null,
    menuExpanded: false,
    selectedButton: "options" as SettingsButton,
  }),

  actions: {
    openMenu(menu: SettingsMenu, expanded: boolean = false) {
      this.currentMenu = menu;
      this.menuExpanded = expanded;
      this.currentSubMenu = null;
    },

    openSubMenu(submenu: SettingsSubMenu) {
      this.currentSubMenu = submenu;

      const achievements = useAchievementsStore();
      if (!achievements.advancement.visitedSettings.includes(submenu)) {
        achievements.advancement.visitedSettings.push(submenu);
      }
      if (
        achievements.advancement.visitedSettings.length ===
        SETTINGS_SUB_MENUS.length
      ) {
        achievements.unlock("settings_visit_all");
      }
    },

    closeSubMenu() {
      this.currentSubMenu = null;
    },
  },
});