Maximilian Stubhan
2838919e42
Name every draft, and put Vertrag before Angehoerige Two things the dashboard and the hire wizard were getting wrong. The drafts card named the author only on other people's drafts. With foreign and own rows side by side that reads as an inconsistency, not as information: the eye has to work out that a missing name means "mine". Now every row says it, "von mir" on the own ones -- the same wording the notes in the bell already use. In the wizard, Angehoerige stood before Vertrag. What a contract is made of -- entry date, working days, a fixed term -- is on paper before the conversation happens; relatives the person brings along, often on the first day. The optional step came before the one the hire rests on. Swapping them meant touching the part that would have broken silently: the per-step validation was a positional list that had to line up with STEP_LABELS by hand. Reordered labels alone would have left the checks where they were -- "Weiter" on Vertrag would have validated the relatives and waved an empty entry date through, until the database refused it at the end. The checks are keyed by step name now, so they travel with the step. Drafts saved before this land on the step number they stored, which now points at a different page. Nothing is lost -- the payload carries every field -- but somebody resuming an older draft may open on Vertrag where they left Angehoerige. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> @
90 lines
3.7 KiB
TypeScript
90 lines
3.7 KiB
TypeScript
"use client";
|
||
|
||
import { Trash2 } from "lucide-react";
|
||
import { useRouter } from "next/navigation";
|
||
import { useTransition } from "react";
|
||
import { deleteHireDraft } from "@/actions/hireDrafts";
|
||
import { useHireWizard } from "@/components/hire/HireWizardContext";
|
||
import { useToast } from "@/components/ui/Toast";
|
||
import type { Entwurf } from "@/lib/entwuerfe";
|
||
import { fmtDate } from "@/lib/format";
|
||
|
||
// Angefangene Neueinstellungen — die eigenen und, wer in der Glocke
|
||
// hinzugewählt ist, auch dessen.
|
||
//
|
||
// Fremde Entwürfe stehen hier zum Ansehen. Fortsetzen und Löschen fehlen bei
|
||
// ihnen nicht aus Vorsicht, sondern weil die Datenbank sie ohnehin abwiese
|
||
// (hire_drafts_update, hire_drafts_delete): eine Schaltfläche anzubieten, die
|
||
// verlässlich in eine Fehlermeldung führt, wäre ein Versprechen ohne Deckung.
|
||
|
||
export function DraftsCard({ drafts }: { drafts: Entwurf[] }) {
|
||
const { openWizard } = useHireWizard();
|
||
const { showToast } = useToast();
|
||
const router = useRouter();
|
||
const [pending, startTransition] = useTransition();
|
||
|
||
if (drafts.length === 0) return null;
|
||
|
||
function handleDelete(id: string) {
|
||
startTransition(async () => {
|
||
const result = await deleteHireDraft(id);
|
||
if (result.success) {
|
||
showToast("Entwurf gelöscht.");
|
||
router.refresh();
|
||
} else {
|
||
showToast(result.error ?? "Fehler beim Löschen.", "error");
|
||
}
|
||
});
|
||
}
|
||
|
||
return (
|
||
<div className="rounded border border-border bg-white p-4">
|
||
<h2 className="mb-3 text-sm font-bold text-ink">Entwürfe – Neueinstellungen</h2>
|
||
<ul className="flex flex-col divide-y divide-border">
|
||
{drafts.map((d) => {
|
||
const firstName = typeof d.payload.firstName === "string" ? d.payload.firstName : "";
|
||
const lastName = typeof d.payload.lastName === "string" ? d.payload.lastName : "";
|
||
const name = [firstName, lastName].filter(Boolean).join(" ") || "Ohne Namen";
|
||
return (
|
||
<li key={d.id} className="flex items-center justify-between gap-3 py-2 text-sm">
|
||
<div>
|
||
<span className="font-semibold text-ink">{name}</span>
|
||
<span className="ml-2 text-xs text-ink-muted">Gespeichert am {fmtDate(d.updated_at)}</span>
|
||
{/* An jeder Zeile, wie an den Notizen in der Glocke: seit
|
||
fremde Entwürfe dazwischenstehen, ist ohne die Angabe nicht
|
||
zu sehen, welcher wessen ist. „von mir" statt des eigenen
|
||
Namens — den kennt man. */}
|
||
<span className="ml-2 text-xs text-ink-muted">{d.vonMir ? "von mir" : `von ${d.autor}`}</span>
|
||
</div>
|
||
{d.vonMir ? (
|
||
<div className="flex items-center gap-3">
|
||
<button
|
||
type="button"
|
||
onClick={() => openWizard({ draftId: d.id })}
|
||
className="text-xs font-semibold text-brand-700 hover:underline"
|
||
>
|
||
Fortsetzen
|
||
</button>
|
||
<button
|
||
type="button"
|
||
onClick={() => handleDelete(d.id)}
|
||
disabled={pending}
|
||
aria-label="Entwurf löschen"
|
||
className="text-ink-muted hover:text-danger-solid"
|
||
>
|
||
<Trash2 className="h-4 w-4" />
|
||
</button>
|
||
</div>
|
||
) : (
|
||
// Warum hier nichts steht, ist sonst nicht zu erraten: die
|
||
// Zeile sähe aus wie eine, an der die Schaltflächen fehlen.
|
||
<span className="shrink-0 text-xs text-ink-muted">Nur zur Ansicht</span>
|
||
)}
|
||
</li>
|
||
);
|
||
})}
|
||
</ul>
|
||
</div>
|
||
);
|
||
}
|