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

export interface Label {
  id: string;
  name: string;
  color: string;
}

export const useLabelsStore = defineStore("labels", () => {
  const items = ref<Label[]>([]);
  const loaded = ref(false);

  function sort() {
    items.value.sort((a, b) => a.name.localeCompare(b.name));
  }

  async function load(): Promise<void> {
    const res = await api.get<{ labels: Label[] }>("/api/labels");
    items.value = res.labels;
    loaded.value = true;
  }

  async function create(name: string): Promise<Label> {
    const label = await api.post<Label>("/api/labels", { name });
    if (!items.value.some((lb) => lb.id === label.id)) {
      items.value.push(label);
      sort();
    }
    return label;
  }

  async function rename(id: string, name: string): Promise<void> {
    const updated = await api.patch<Label>(`/api/labels/${id}`, { name });
    const idx = items.value.findIndex((lb) => lb.id === id);
    if (idx >= 0) items.value[idx] = updated;
    sort();
  }

  async function setColor(id: string, color: string): Promise<void> {
    const updated = await api.patch<Label>(`/api/labels/${id}`, { color });
    const idx = items.value.findIndex((lb) => lb.id === id);
    if (idx >= 0) items.value[idx] = updated;
  }

  async function remove(id: string): Promise<void> {
    await api.del(`/api/labels/${id}`);
    items.value = items.value.filter((lb) => lb.id !== id);
  }

  return { items, loaded, load, create, rename, setColor, remove };
});