refactor(ui): single shared documentStatus map across offers/invoices/orders (fix issued color drift, add offers status chip)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

src/admin/pages/Offers.tsx

@@ -38,15 +38,19 @@ import {
   type DataColumn,
   type TabDef,
 } from "../ui";
+import { OFFER_STATUS, statusLabel, statusColor } from "../lib/documentStatus";
 
 const API_BASE = "/api/admin";
 const DRAFT_KEY = "boha_offer_draft";
 
+// Filter tabs cover only the real stored offer statuses (the `expired` entry
+// in OFFER_STATUS is a front-end-derived state, not a stored value).
 const STATUS_FILTERS = [
   { value: "", label: "Vše" },
-  { value: "active", label: "Aktivní" },
-  { value: "ordered", label: "Objednaná" },
-  { value: "invalidated", label: "Zneplatněná" },
+  ...(["active", "ordered", "invalidated"] as const).map((value) => ({
+    value,
+    label: statusLabel(OFFER_STATUS, value),
+  })),
 ];
 
 interface Quotation {
@@ -497,7 +501,7 @@ export default function Offers() {
     {
       key: "customer_name",
       header: "Zákazník",
-      width: "18%",
+      width: "13%",
       render: (q) => q.customer_name || "—",
     },
     {
@@ -511,22 +515,43 @@ export default function Offers() {
     {
       key: "valid_until",
       header: "Platnost",
-      width: "11%",
+      width: "10%",
       sortKey: "valid_until",
       mono: true,
       render: (q) => formatDate(q.valid_until),
     },
+    {
+      key: "status",
+      header: "Stav",
+      width: "10%",
+      sortKey: "status",
+      render: (q) => {
+        // The offer's own status is `active`/`ordered`/`invalidated`. When its
+        // linked order is completed, surface that as "Dokončená" (success) —
+        // matching the OfferDetail header chip and the completed row tint.
+        const completed =
+          q.status !== "invalidated" && q.order_status === "dokoncena";
+        return completed ? (
+          <StatusChip label="Dokončená" color="success" />
+        ) : (
+          <StatusChip
+            label={statusLabel(OFFER_STATUS, q.status)}
+            color={statusColor(OFFER_STATUS, q.status)}
+          />
+        );
+      },
+    },
     {
       key: "currency",
       header: "Měna",
-      width: "8%",
+      width: "7%",
       sortKey: "currency",
       render: (q) => <StatusChip label={q.currency} color="default" />,
     },
     {
       key: "total",
       header: "Celkem",
-      width: "12%",
+      width: "11%",
       align: "right",
       mono: true,
       bold: true,
@@ -535,7 +560,7 @@ export default function Offers() {
     {
       key: "actions",
       header: "Akce",
-      width: "16%",
+      width: "15%",
       align: "right",
       render: (q) => {
         const isInvalidated = q.status === "invalidated";