Give labels a color (migration 0011 adds labels.color, server_default 'default' so existing labels keep the neutral chip). The PATCH endpoint now updates name and/or color; note serialization carries each label's color. Frontend: a swatch picker per label in the Edit-labels modal, colored chips on cards + in the editor (LABEL_CHIP_CLASSES), and a color dot on each sidebar label. Reuses the note color vocabulary. (Graph node coloring rides this in the graph-liveliness task.) Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01FRgehjoz7Yv8LkUfADxACm
54 lines
1.5 KiB
TypeScript
54 lines
1.5 KiB
TypeScript
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 };
|
|
});
|