import { defineStore } from "pinia";
import { ref } from "vue";
import api from "@/api/client";

export interface AppSettings {
  syncIntervalMs: number;
  maxDevices: number;
  autoSync: boolean;
  theme: "light" | "dark" | "system";
}

const DEFAULT_SETTINGS: AppSettings = {
  syncIntervalMs: 30_000,
  maxDevices: 10,
  autoSync: true,
  theme: "system",
};

export const useSettingsStore = defineStore("settings", () => {
  const settings = ref<AppSettings>({ ...DEFAULT_SETTINGS });
  const loading = ref(false);

  async function fetchSettings(): Promise<void> {
    loading.value = true;
    try {
      const { data } = await api.get("/settings");
      settings.value = { ...DEFAULT_SETTINGS, ...data };
    } catch {
      // Use defaults if settings endpoint doesn't exist yet
    } finally {
      loading.value = false;
    }
  }

  async function updateSettings(patch: Partial<AppSettings>): Promise<void> {
    const { data } = await api.patch("/settings", patch);
    settings.value = { ...settings.value, ...data };
  }

  return { settings, loading, fetchSettings, updateSettings };
});