import { Credentials } from "@/lib/api";
import { ADVENT22 } from "@/plugins/advent22";
import { AxiosBasicCredentials } from "axios";
import { acceptHMRUpdate, defineStore } from "pinia";

const check_touch_device = () => window.matchMedia("(any-hover: none)").matches;
const empty_creds = () => ["", ""] as Credentials;

export const advent22Store = defineStore({
  id: "advent22",

  state: () => {
    ADVENT22.api_get_blob("user/favicon")
      .then((favicon_src) => {
        const link: HTMLLinkElement =
          document.querySelector("link[rel*='icon']") ||
          document.createElement("link");
        link.rel = "shortcut icon";
        link.type = "image/x-icon";
        link.href = favicon_src;

        if (link.parentElement === null)
          document.getElementsByTagName("head")[0].appendChild(link);
      })
      .catch(() => {});

    return {
      api_creds: empty_creds(),
      is_admin: false,
      is_touch_device: check_touch_device(),
    };
  },

  getters: {
    axios_creds: (state): AxiosBasicCredentials => {
      const [username, password] = state.api_creds;
      return { username: username, password: password };
    },
  },

  actions: {
    login(creds: Credentials = empty_creds()): Promise<boolean> {
      this.api_creds = creds;

      return new Promise<boolean>((resolve, reject) => {
        ADVENT22.api_get<boolean>("admin/is_admin")
          .then((is_admin) => {
            this.is_admin = is_admin;
            resolve(is_admin);
          })
          .catch(reject);
      });
    },

    logout(): Promise<boolean> {
      return this.login();
    },

    set_touch_device(state: boolean = check_touch_device()): void {
      this.is_touch_device = state;
    },

    toggle_touch_device(): void {
      this.is_touch_device = !this.is_touch_device;
    },
  },
});

if (import.meta.webpackHot) {
  import.meta.webpackHot.accept(
    acceptHMRUpdate(advent22Store, import.meta.webpackHot),
  );
}