feat(admin): Listen mit Status-Badges, Leerzustaenden und klaren Aktionen
Neue gemeinsame Bausteine in components/admin-list.tsx: Seitenkopf mit Hauptaktion, Suchleiste, Status-Badge (gleiche Form wie der Bestellstatus, wartende Eintraege mit pulsierendem Punkt), Leerzustand mit Wabe und naechstem Schritt sowie Zeilenaktionen mit einheitlichem Unterstrich- Hover (Loeschen rot, Sperren/Zurueckziehen gedaempft). Umgestellt: Bewertungen (SVG-Sterne statt Unicode), Benutzer, Gutscheine (neu: Status "Abgelaufen"), Versand, Ernten, Chargen (Anlegeformulare auf admin-form), Firmenanfragen (Status als Badge, beschriftete Auswahl) und Audit-Log. Zahlen und Daten in Tabellen mit tabular-nums. Co-Authored-By: Claude Opus 5.5 (1M context) <[email protected]>
This commit is contained in:
Nick SzaunigandClaude Opus 5.5 committed
1 parent
95b4b5953d
commit
a09057d960
12 files changed
+440
-300
No files matched your search
@@ -3,6 +3,15 @@ import { prisma } from "@/lib/prisma";
|
||||
import { BackLink } from "@/components/back-link";
|
||||
import { ConfirmForm } from "@/components/confirm-form";
|
||||
import { formatDate } from "@/lib/format";
|
||||
import { StarRating } from "@/components/star-rating";
|
||||
import {
|
||||
AdminActionButton,
|
||||
AdminBadge,
|
||||
AdminEmptyState,
|
||||
AdminPageHeader,
|
||||
AdminRowActions,
|
||||
AdminSearchForm,
|
||||
} from "@/components/admin-list";
|
||||
import { insensitiveContains } from "@/lib/prisma-search";
|
||||
import { approveReviewAction, deleteReviewAction } from "../actions";
|
||||
import { getLocale } from "@/i18n/locale";
|
||||
@@ -34,28 +43,16 @@ export default async function AdminBewertungenPage(props: PageProps<"/admin/bewe
|
||||
return (
|
||||
<div>
|
||||
<BackLink href="/admin" label={t.adminReviewsPage.backToDashboard} />
|
||||
<h1 className="text-2xl text-forest mb-8">{t.adminReviewsPage.title}</h1>
|
||||
<AdminPageHeader title={t.adminReviewsPage.title} />
|
||||
|
||||
<form method="GET" className="flex flex-wrap items-end gap-3 mb-6">
|
||||
<label className="text-sm">
|
||||
<span className="block text-ink/65 text-xs mb-1">{t.adminReviewsPage.searchLabel}</span>
|
||||
<input
|
||||
type="text"
|
||||
name="q"
|
||||
defaultValue={query}
|
||||
placeholder={t.adminReviewsPage.searchPlaceholder}
|
||||
className="border border-ink/20 bg-background px-3 py-2 text-sm w-64"
|
||||
/>
|
||||
</label>
|
||||
<button type="submit" className="bg-forest text-cream px-4 py-2 text-sm">
|
||||
{t.adminReviewsPage.filterButton}
|
||||
</button>
|
||||
{query ? (
|
||||
<Link href="/admin/bewertungen" className="text-sm text-ink/65 underline">
|
||||
{t.adminReviewsPage.resetFilter}
|
||||
</Link>
|
||||
) : null}
|
||||
</form>
|
||||
<AdminSearchForm
|
||||
query={query}
|
||||
label={t.adminReviewsPage.searchLabel}
|
||||
placeholder={t.adminReviewsPage.searchPlaceholder}
|
||||
submitLabel={t.adminReviewsPage.filterButton}
|
||||
resetHref="/admin/bewertungen"
|
||||
resetLabel={t.adminReviewsPage.resetFilter}
|
||||
/>
|
||||
|
||||
<div className="overflow-x-auto bg-background border border-ink/10">
|
||||
<table className="w-full text-sm">
|
||||
@@ -74,34 +71,34 @@ export default async function AdminBewertungenPage(props: PageProps<"/admin/bewe
|
||||
{reviews.map((review) => (
|
||||
<tr key={review.id} className="transition-colors hover:bg-ink/[0.03]">
|
||||
<td className="p-4">
|
||||
<Link href={`/honig/${review.product.slug}`} className="text-forest underline">
|
||||
<Link href={`/honig/${review.product.slug}`} className="link-draw text-forest">
|
||||
{review.product.name}
|
||||
</Link>
|
||||
</td>
|
||||
<td className="p-4">
|
||||
{review.customer.firstName} {review.customer.lastName}
|
||||
</td>
|
||||
<td className="p-4 text-honey-dark whitespace-nowrap">
|
||||
{"★".repeat(review.rating)}
|
||||
{"☆".repeat(5 - review.rating)}
|
||||
<td className="p-4 whitespace-nowrap">
|
||||
<StarRating value={review.rating} />
|
||||
<span className="sr-only">{review.rating} / 5</span>
|
||||
</td>
|
||||
<td className="p-4 max-w-xs">{review.comment ?? "—"}</td>
|
||||
<td className="p-4 whitespace-nowrap">{formatDate(review.createdAt)}</td>
|
||||
<td className="p-4">
|
||||
{review.isApproved ? (
|
||||
<span className="text-forest">{t.adminReviewsPage.statusPublished}</span>
|
||||
<AdminBadge tone="positive">{t.adminReviewsPage.statusPublished}</AdminBadge>
|
||||
) : (
|
||||
<span className="text-honey-dark">{t.adminReviewsPage.statusPending}</span>
|
||||
<AdminBadge tone="pending" pulse>
|
||||
{t.adminReviewsPage.statusPending}
|
||||
</AdminBadge>
|
||||
)}
|
||||
</td>
|
||||
<td className="p-4">
|
||||
<div className="flex items-center gap-3 whitespace-nowrap">
|
||||
<AdminRowActions>
|
||||
{!review.isApproved ? (
|
||||
<form action={approveReviewAction}>
|
||||
<input type="hidden" name="id" value={review.id} />
|
||||
<button type="submit" className="text-forest underline">
|
||||
{t.adminReviewsPage.approve}
|
||||
</button>
|
||||
<AdminActionButton>{t.adminReviewsPage.approve}</AdminActionButton>
|
||||
</form>
|
||||
) : null}
|
||||
<ConfirmForm
|
||||
@@ -109,20 +106,18 @@ export default async function AdminBewertungenPage(props: PageProps<"/admin/bewe
|
||||
confirmMessage={t.adminReviewsPage.deleteConfirm}
|
||||
>
|
||||
<input type="hidden" name="id" value={review.id} />
|
||||
<button type="submit" className="text-red-700 underline">
|
||||
{t.adminReviewsPage.delete}
|
||||
</button>
|
||||
<AdminActionButton tone="danger">{t.adminReviewsPage.delete}</AdminActionButton>
|
||||
</ConfirmForm>
|
||||
</div>
|
||||
</AdminRowActions>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
{reviews.length === 0 ? (
|
||||
<p className="p-6 text-ink/65">
|
||||
{query ? t.adminReviewsPage.noResultsFiltered : t.adminReviewsPage.noReviewsYet}
|
||||
</p>
|
||||
<AdminEmptyState
|
||||
message={query ? t.adminReviewsPage.noResultsFiltered : t.adminReviewsPage.noReviewsYet}
|
||||
/>
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in new issue
Block a user