feat(frontend): Icon-Badges auf Detailseiten-Karten (Volk/Bienenstand/Königin)

Header von ColonyEditCard, ApiaryEditCard und QueenEditCard um Icon-Badge
im Honig-/Salbei-Gradient ergänzt, passend zum bereits überarbeiteten
Look der Listen- und Übersichtsseiten.

Zusätzlich Bug behoben: ColonyEditCard und QueenEditCard nutzten bislang
ein hartcodiertes ACTIVE-Ternary statt der gemeinsamen statusTone()-Hilfsfunktion,
wodurch z. B. WEAK/CONSPICUOUS/DISSOLVED-Völker und LOST/DECEASED-Königinnen
auf der eigenen Detailseite nur als neutrales "secondary"-Badge statt in
Warn-/Fehlerfarbe erschienen.
This commit is contained in:
Nick Szaunig committed 2026-08-23 20:57:01 +02:00
1 parent 6c764bf885
commit 5be352c4a0
3 files changed
+34 -9

No files matched your search

@@ -1,6 +1,7 @@
"use client";
import { FormEvent, useState } from "react";
import { MapPin } from "lucide-react";
import { useMutation, useQueryClient } from "@tanstack/react-query";
import { toast } from "sonner";
import { deactivateApiary, reactivateApiary, updateApiary } from "@/lib/apiaries/api";
@@ -66,7 +67,15 @@ export function ApiaryEditCard({ apiary }: { apiary: Apiary }) {
return (
<Card className="max-w-lg">
<CardHeader className="flex flex-row items-center justify-between">
<CardTitle>{apiary.name}</CardTitle>
<div className="flex items-center gap-2.5">
<span
className="flex size-8 items-center justify-center rounded-lg text-white shadow-[var(--shadow-soft)]"
style={{ background: "var(--gradient-honey)" }}
>
<MapPin className="size-4" />
</span>
<CardTitle>{apiary.name}</CardTitle>
</div>
<Badge variant={apiary.status === "ACTIVE" ? "default" : "secondary"}>
{apiary.status === "ACTIVE" ? "Aktiv" : "Inaktiv"}
</Badge>