import { reactive } from "vue";
import { apiGet, apiPut } from "./api";
import type { NavigationMode, UserNavigationSettings } from "./types";

export const userSettings = reactive({
  navigationMode: "scroll" as NavigationMode,
  status: "",
  loaded: false
});

export async function loadUserSettings() {
  const result = await apiGet<UserNavigationSettings>("/api/v1/users/me/settings/navigation");
  userSettings.loaded = true;
  if (result.ok) {
    userSettings.navigationMode = result.data.mode;
    userSettings.status = "";
  } else {
    userSettings.status = result.message;
  }
}

export async function saveNavigationMode(mode: NavigationMode) {
  userSettings.navigationMode = mode;
  userSettings.status = "Speichere Menü...";
  const result = await apiPut<UserNavigationSettings>("/api/v1/users/me/settings/navigation", { mode });
  if (result.ok) {
    userSettings.navigationMode = result.data.mode;
    userSettings.status = "Menü gespeichert.";
  } else {
    userSettings.status = result.message;
  }
}
