first commit

frontend/src/composables/useSegments.ts

@@ -0,0 +1,38 @@
+import { ref, onMounted } from "vue";
+import type { Segment, SiteInfo } from "@/types/segment";
+
+export function useSegments() {
+  const segments = ref<Segment[]>([]);
+  const siteTitle = ref("Handin");
+  const loading = ref(true);
+  const error = ref<string | null>(null);
+
+  async function refresh(): Promise<void> {
+    loading.value = true;
+    error.value = null;
+    try {
+      const [siteRes, segmentsRes] = await Promise.all([
+        fetch("/api/site/"),
+        fetch("/api/segments/"),
+      ]);
+      if (!siteRes.ok) throw new Error(`Site fetch failed: ${siteRes.status}`);
+      if (!segmentsRes.ok) throw new Error(`Segments fetch failed: ${segmentsRes.status}`);
+
+      const siteData = (await siteRes.json()) as SiteInfo;
+      const segmentsData = (await segmentsRes.json()) as Segment[];
+
+      siteTitle.value = siteData.title;
+      segments.value = segmentsData.sort((a, b) => a.sort_order - b.sort_order);
+    } catch (e) {
+      error.value = e instanceof Error ? e.message : "Unknown error";
+    } finally {
+      loading.value = false;
+    }
+  }
+
+  onMounted(() => {
+    void refresh();
+  });
+
+  return { segments, siteTitle, loading, error, refresh };
+}