style: format code biome
Local Build and Deploy / deploy (push) Failing after 46s

This commit is contained in:
openhands committed 2026-07-13 21:57:41 +02:00
1 parent 8efd032cc6
commit df38dccbf1
735 files changed
+128321 -120870

No files matched your search

+186 -137
View File
@@ -8,154 +8,203 @@ import { Button } from "@/components/ui/button";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
import { useServerAction } from "@/hooks/use-server-action";
interface Prize {
id: number;
position: number;
prizeType: string;
badgeCode: string | null;
credits: number;
pixels: number;
points: number;
itemId: number | null;
description: string;
id: number;
position: number;
prizeType: string;
badgeCode: string | null;
credits: number;
pixels: number;
points: number;
itemId: number | null;
description: string;
}
interface Props {
eventId: number;
prizes: Prize[];
eventId: number;
prizes: Prize[];
}
export function EventPrizesManager({ eventId, prizes }: Props) {
const { run, isPending } = useServerAction();
const [showForm, setShowForm] = useState(false);
const [form, setForm] = useState({
position: prizes.length + 1,
prizeType: "badge" as string,
badgeCode: "",
credits: 0,
pixels: 0,
points: 0,
description: "",
});
const { run, isPending } = useServerAction();
const [showForm, setShowForm] = useState(false);
const [form, setForm] = useState({
position: prizes.length + 1,
prizeType: "badge" as string,
badgeCode: "",
credits: 0,
pixels: 0,
points: 0,
description: "",
});
function handleAdd(e: React.FormEvent) {
e.preventDefault();
// biome-ignore lint/suspicious/noExplicitAny: explicitly chosen here, see surrounding code
run(() => addEventPrize({ eventId, ...form } as any), {
successMessage: "Prize added!",
onSuccess: () => {
setShowForm(false);
setForm({ ...form, position: form.position + 1, badgeCode: "", description: "" });
},
});
}
function handleAdd(e: React.FormEvent) {
e.preventDefault();
// biome-ignore lint/suspicious/noExplicitAny: explicitly chosen here, see surrounding code
run(() => addEventPrize({ eventId, ...form } as any), {
successMessage: "Prize added!",
onSuccess: () => {
setShowForm(false);
setForm({
...form,
position: form.position + 1,
badgeCode: "",
description: "",
});
},
});
}
return (
<Card>
<CardHeader className="flex flex-row items-center justify-between">
<CardTitle>Prizes</CardTitle>
<Button size="sm" onClick={() => setShowForm(!showForm)}>
<Plus className="h-4 w-4 mr-1" /> Add Prize
</Button>
</CardHeader>
<CardContent className="space-y-4">
{showForm && (
<form onSubmit={handleAdd} className="border rounded-lg p-4 space-y-3">
<div className="grid grid-cols-2 md:grid-cols-4 gap-3">
<div className="space-y-1">
<Label>Position</Label>
<Input
type="number"
value={form.position}
onChange={(e) => setForm({ ...form, position: Number(e.target.value) })}
/>
</div>
<div className="space-y-1">
<Label>Type</Label>
<Select value={form.prizeType} onValueChange={(v) => setForm({ ...form, prizeType: v })}>
<SelectTrigger>
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="badge">Badge</SelectItem>
<SelectItem value="credits">Credits</SelectItem>
<SelectItem value="pixels">Pixels</SelectItem>
<SelectItem value="points">Points</SelectItem>
<SelectItem value="item">Item</SelectItem>
</SelectContent>
</Select>
</div>
<div className="space-y-1">
<Label>Badge Code</Label>
<Input
value={form.badgeCode}
onChange={(e) => setForm({ ...form, badgeCode: e.target.value })}
placeholder="ACH_..."
/>
</div>
<div className="space-y-1">
<Label>Credits</Label>
<Input
type="number"
value={form.credits}
onChange={(e) => setForm({ ...form, credits: Number(e.target.value) })}
/>
</div>
</div>
<div className="space-y-1">
<Label>Description</Label>
<Input
value={form.description}
onChange={(e) => setForm({ ...form, description: e.target.value })}
/>
</div>
<div className="flex gap-2 justify-end">
<Button type="button" variant="outline" size="sm" onClick={() => setShowForm(false)}>
Cancel
</Button>
<Button type="submit" size="sm" disabled={isPending}>
Add
</Button>
</div>
</form>
)}
return (
<Card>
<CardHeader className="flex flex-row items-center justify-between">
<CardTitle>Prizes</CardTitle>
<Button size="sm" onClick={() => setShowForm(!showForm)}>
<Plus className="h-4 w-4 mr-1" /> Add Prize
</Button>
</CardHeader>
<CardContent className="space-y-4">
{showForm && (
<form
onSubmit={handleAdd}
className="border rounded-lg p-4 space-y-3"
>
<div className="grid grid-cols-2 md:grid-cols-4 gap-3">
<div className="space-y-1">
<Label>Position</Label>
<Input
type="number"
value={form.position}
onChange={(e) =>
setForm({ ...form, position: Number(e.target.value) })
}
/>
</div>
<div className="space-y-1">
<Label>Type</Label>
<Select
value={form.prizeType}
onValueChange={(v) => setForm({ ...form, prizeType: v })}
>
<SelectTrigger>
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="badge">Badge</SelectItem>
<SelectItem value="credits">Credits</SelectItem>
<SelectItem value="pixels">Pixels</SelectItem>
<SelectItem value="points">Points</SelectItem>
<SelectItem value="item">Item</SelectItem>
</SelectContent>
</Select>
</div>
<div className="space-y-1">
<Label>Badge Code</Label>
<Input
value={form.badgeCode}
onChange={(e) =>
setForm({ ...form, badgeCode: e.target.value })
}
placeholder="ACH_..."
/>
</div>
<div className="space-y-1">
<Label>Credits</Label>
<Input
type="number"
value={form.credits}
onChange={(e) =>
setForm({ ...form, credits: Number(e.target.value) })
}
/>
</div>
</div>
<div className="space-y-1">
<Label>Description</Label>
<Input
value={form.description}
onChange={(e) =>
setForm({ ...form, description: e.target.value })
}
/>
</div>
<div className="flex gap-2 justify-end">
<Button
type="button"
variant="outline"
size="sm"
onClick={() => setShowForm(false)}
>
Cancel
</Button>
<Button type="submit" size="sm" disabled={isPending}>
Add
</Button>
</div>
</form>
)}
{prizes.length === 0 && !showForm && (
<p className="text-sm text-muted-foreground text-center py-4">No prizes configured yet.</p>
)}
{prizes.length === 0 && !showForm && (
<p className="text-sm text-muted-foreground text-center py-4">
No prizes configured yet.
</p>
)}
{prizes.map((prize) => (
<div key={prize.id} className="flex items-center justify-between border rounded-lg px-4 py-3">
<div className="flex items-center gap-3">
<span className="flex h-8 w-8 items-center justify-center rounded-full bg-accent font-bold text-sm">
#{prize.position}
</span>
<div>
<div className="flex items-center gap-2">
<Badge variant="secondary">{prize.prizeType}</Badge>
{prize.badgeCode && <span className="text-sm font-mono">{prize.badgeCode}</span>}
{prize.credits > 0 && <span className="text-sm">{prize.credits} credits</span>}
{prize.pixels > 0 && <span className="text-sm">{prize.pixels} pixels</span>}
{prize.points > 0 && <span className="text-sm">{prize.points} points</span>}
</div>
{prize.description && <p className="text-xs text-muted-foreground">{prize.description}</p>}
</div>
</div>
<Button
variant="ghost"
size="icon"
onClick={() =>
run(() => deleteEventPrize({ id: prize.id }), { successMessage: "Prize removed" })
}
>
<Trash2 className="h-4 w-4 text-destructive" />
</Button>
</div>
))}
</CardContent>
</Card>
);
{prizes.map((prize) => (
<div
key={prize.id}
className="flex items-center justify-between border rounded-lg px-4 py-3"
>
<div className="flex items-center gap-3">
<span className="flex h-8 w-8 items-center justify-center rounded-full bg-accent font-bold text-sm">
#{prize.position}
</span>
<div>
<div className="flex items-center gap-2">
<Badge variant="secondary">{prize.prizeType}</Badge>
{prize.badgeCode && (
<span className="text-sm font-mono">{prize.badgeCode}</span>
)}
{prize.credits > 0 && (
<span className="text-sm">{prize.credits} credits</span>
)}
{prize.pixels > 0 && (
<span className="text-sm">{prize.pixels} pixels</span>
)}
{prize.points > 0 && (
<span className="text-sm">{prize.points} points</span>
)}
</div>
{prize.description && (
<p className="text-xs text-muted-foreground">
{prize.description}
</p>
)}
</div>
</div>
<Button
variant="ghost"
size="icon"
onClick={() =>
run(() => deleteEventPrize({ id: prize.id }), {
successMessage: "Prize removed",
})
}
>
<Trash2 className="h-4 w-4 text-destructive" />
</Button>
</div>
))}
</CardContent>
</Card>
);
}
@@ -3,38 +3,43 @@
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
interface Registration {
id: number;
userId: number;
username: string;
createdAt: Date;
id: number;
userId: number;
username: string;
createdAt: Date;
}
interface Props {
registrations: Registration[];
registrations: Registration[];
}
export function EventRegistrations({ registrations }: Props) {
return (
<Card>
<CardHeader>
<CardTitle>Registrations ({registrations.length})</CardTitle>
</CardHeader>
<CardContent>
{registrations.length === 0 ? (
<p className="text-sm text-muted-foreground text-center py-4">No registrations yet.</p>
) : (
<div className="divide-y max-h-[400px] overflow-y-auto">
{registrations.map((r) => (
<div key={r.id} className="flex items-center justify-between py-2">
<span className="text-sm font-medium">{r.username}</span>
<span className="text-xs text-muted-foreground">
{new Date(r.createdAt).toLocaleString()}
</span>
</div>
))}
</div>
)}
</CardContent>
</Card>
);
return (
<Card>
<CardHeader>
<CardTitle>Registrations ({registrations.length})</CardTitle>
</CardHeader>
<CardContent>
{registrations.length === 0 ? (
<p className="text-sm text-muted-foreground text-center py-4">
No registrations yet.
</p>
) : (
<div className="divide-y max-h-[400px] overflow-y-auto">
{registrations.map((r) => (
<div
key={r.id}
className="flex items-center justify-between py-2"
>
<span className="text-sm font-medium">{r.username}</span>
<span className="text-xs text-muted-foreground">
{new Date(r.createdAt).toLocaleString()}
</span>
</div>
))}
</div>
)}
</CardContent>
</Card>
);
}
+81 -76
View File
@@ -10,90 +10,95 @@ import { Label } from "@/components/ui/label";
import { useServerAction } from "@/hooks/use-server-action";
interface Winner {
id: number;
userId: number;
position: number;
username: string;
createdAt: Date;
id: number;
userId: number;
position: number;
username: string;
createdAt: Date;
}
interface Props {
eventId: number;
winners: Winner[];
eventId: number;
winners: Winner[];
}
export function EventWinnersManager({ eventId, winners }: Props) {
const { run, isPending } = useServerAction();
const [showForm, setShowForm] = useState(false);
const [userId, setUserId] = useState("");
const [position, setPosition] = useState(winners.length + 1);
const { run, isPending } = useServerAction();
const [showForm, setShowForm] = useState(false);
const [userId, setUserId] = useState("");
const [position, setPosition] = useState(winners.length + 1);
function handleAdd(e: React.FormEvent) {
e.preventDefault();
run(() => addEventWinner({ eventId, userId: Number(userId), position }), {
successMessage: "Winner added!",
onSuccess: () => {
setShowForm(false);
setUserId("");
setPosition(position + 1);
},
});
}
function handleAdd(e: React.FormEvent) {
e.preventDefault();
run(() => addEventWinner({ eventId, userId: Number(userId), position }), {
successMessage: "Winner added!",
onSuccess: () => {
setShowForm(false);
setUserId("");
setPosition(position + 1);
},
});
}
return (
<Card>
<CardHeader className="flex flex-row items-center justify-between">
<CardTitle>Winners</CardTitle>
<Button size="sm" onClick={() => setShowForm(!showForm)}>
<Plus className="h-4 w-4 mr-1" /> Add Winner
</Button>
</CardHeader>
<CardContent className="space-y-3">
{showForm && (
<form onSubmit={handleAdd} className="border rounded-lg p-4 flex gap-3 items-end">
<div className="space-y-1">
<Label>User ID</Label>
<Input
type="number"
value={userId}
onChange={(e) => setUserId(e.target.value)}
required
placeholder="12345"
/>
</div>
<div className="space-y-1">
<Label>Position</Label>
<Input
type="number"
value={position}
onChange={(e) => setPosition(Number(e.target.value))}
min={1}
/>
</div>
<Button type="submit" size="sm" disabled={isPending}>
Add
</Button>
</form>
)}
return (
<Card>
<CardHeader className="flex flex-row items-center justify-between">
<CardTitle>Winners</CardTitle>
<Button size="sm" onClick={() => setShowForm(!showForm)}>
<Plus className="h-4 w-4 mr-1" /> Add Winner
</Button>
</CardHeader>
<CardContent className="space-y-3">
{showForm && (
<form
onSubmit={handleAdd}
className="border rounded-lg p-4 flex gap-3 items-end"
>
<div className="space-y-1">
<Label>User ID</Label>
<Input
type="number"
value={userId}
onChange={(e) => setUserId(e.target.value)}
required
placeholder="12345"
/>
</div>
<div className="space-y-1">
<Label>Position</Label>
<Input
type="number"
value={position}
onChange={(e) => setPosition(Number(e.target.value))}
min={1}
/>
</div>
<Button type="submit" size="sm" disabled={isPending}>
Add
</Button>
</form>
)}
{winners.length === 0 && !showForm && (
<p className="text-sm text-muted-foreground text-center py-4">No winners yet.</p>
)}
{winners.length === 0 && !showForm && (
<p className="text-sm text-muted-foreground text-center py-4">
No winners yet.
</p>
)}
<div className="divide-y">
{winners.map((w) => (
<div key={w.id} className="flex items-center gap-3 py-2.5">
<span className="flex h-7 w-7 items-center justify-center rounded-full bg-primary text-primary-foreground text-xs font-bold">
{w.position}
</span>
<span className="font-medium text-sm">{w.username}</span>
<span className="text-xs text-muted-foreground ml-auto">
{new Date(w.createdAt).toLocaleDateString()}
</span>
</div>
))}
</div>
</CardContent>
</Card>
);
<div className="divide-y">
{winners.map((w) => (
<div key={w.id} className="flex items-center gap-3 py-2.5">
<span className="flex h-7 w-7 items-center justify-center rounded-full bg-primary text-primary-foreground text-xs font-bold">
{w.position}
</span>
<span className="font-medium text-sm">{w.username}</span>
<span className="text-xs text-muted-foreground ml-auto">
{new Date(w.createdAt).toLocaleDateString()}
</span>
</div>
))}
</div>
</CardContent>
</Card>
);
}
+157 -137
View File
@@ -11,154 +11,174 @@ import { EventRegistrations } from "./event-registrations";
import { EventWinnersManager } from "./event-winners";
export default async function EventDetailPage({
params,
params,
}: {
params: Promise<{ locale: string; id: string }>;
params: Promise<{ locale: string; id: string }>;
}) {
const { id } = await params;
const { session, permissions } = await getAdminContext();
if (!canAccess(permissions, PERMS.EVENTS_EDIT, session.user.rank)) {
redirect("/admin/events");
}
const { id } = await params;
const { session, permissions } = await getAdminContext();
if (!canAccess(permissions, PERMS.EVENTS_EDIT, session.user.rank)) {
redirect("/admin/events");
}
const eventId = parseInt(id, 10);
if (Number.isNaN(eventId)) notFound();
const eventId = parseInt(id, 10);
if (Number.isNaN(eventId)) notFound();
const event = await prisma.websiteEvent.findUnique({
where: { id: eventId },
include: {
type: true,
prizes: { orderBy: { position: "asc" } },
winners: { orderBy: { position: "asc" } },
registrations: { orderBy: { createdAt: "desc" } },
},
});
const event = await prisma.websiteEvent.findUnique({
where: { id: eventId },
include: {
type: true,
prizes: { orderBy: { position: "asc" } },
winners: { orderBy: { position: "asc" } },
registrations: { orderBy: { createdAt: "desc" } },
},
});
if (!event) notFound();
if (!event) notFound();
const eventTypes = await prisma.websiteEventType.findMany({
where: { isActive: 1 },
orderBy: { name: "asc" },
});
const eventTypes = await prisma.websiteEventType.findMany({
where: { isActive: 1 },
orderBy: { name: "asc" },
});
// Fetch usernames for registrations and winners
const userIds = [...event.registrations.map((r) => r.userId), ...event.winners.map((w) => w.userId)];
const users =
userIds.length > 0
? await prisma.user.findMany({
where: { id: { in: [...new Set(userIds)] } },
select: { id: true, username: true },
})
: [];
const userMap = new Map(users.map((u) => [u.id, u.username]));
// Fetch usernames for registrations and winners
const userIds = [
...event.registrations.map((r) => r.userId),
...event.winners.map((w) => w.userId),
];
const users =
userIds.length > 0
? await prisma.user.findMany({
where: { id: { in: [...new Set(userIds)] } },
select: { id: true, username: true },
})
: [];
const userMap = new Map(users.map((u) => [u.id, u.username]));
return (
<div className="space-y-6">
<div>
<AdminBreadcrumb items={[{ label: "Events", href: "/admin/events" }, { label: event.title }]} />
<div className="flex items-center gap-3">
<h1 className="text-3xl font-bold tracking-tight">{event.title}</h1>
<Badge
variant={
event.status === "published"
? "default"
: event.status === "cancelled"
? "destructive"
: "secondary"
}
>
{event.status}
</Badge>
</div>
<p className="text-muted-foreground">
{event.type.name} &middot; {new Date(event.startsAt).toLocaleString()}
</p>
</div>
return (
<div className="space-y-6">
<div>
<AdminBreadcrumb
items={[
{ label: "Events", href: "/admin/events" },
{ label: event.title },
]}
/>
<div className="flex items-center gap-3">
<h1 className="text-3xl font-bold tracking-tight">{event.title}</h1>
<Badge
variant={
event.status === "published"
? "default"
: event.status === "cancelled"
? "destructive"
: "secondary"
}
>
{event.status}
</Badge>
</div>
<p className="text-muted-foreground">
{event.type.name} &middot; {new Date(event.startsAt).toLocaleString()}
</p>
</div>
{/* Stats */}
<div className="grid gap-4 md:grid-cols-4">
<Card>
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
<CardTitle className="text-sm font-medium">Registrations</CardTitle>
<Users className="h-4 w-4 text-muted-foreground" />
</CardHeader>
<CardContent>
<div className="text-2xl font-bold">{event.registrations.length}</div>
{event.maxPlayers && <p className="text-xs text-muted-foreground">Max: {event.maxPlayers}</p>}
</CardContent>
</Card>
<Card>
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
<CardTitle className="text-sm font-medium">Prizes</CardTitle>
<Gift className="h-4 w-4 text-muted-foreground" />
</CardHeader>
<CardContent>
<div className="text-2xl font-bold">{event.prizes.length}</div>
</CardContent>
</Card>
<Card>
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
<CardTitle className="text-sm font-medium">Winners</CardTitle>
<Trophy className="h-4 w-4 text-muted-foreground" />
</CardHeader>
<CardContent>
<div className="text-2xl font-bold">{event.winners.length}</div>
</CardContent>
</Card>
<Card>
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
<CardTitle className="text-sm font-medium">Time</CardTitle>
<CalendarDays className="h-4 w-4 text-muted-foreground" />
</CardHeader>
<CardContent>
<div className="text-sm font-medium">
{new Date(event.startsAt) > new Date() ? "Upcoming" : "Past"}
</div>
{event.endsAt && (
<p className="text-xs text-muted-foreground">Ends: {new Date(event.endsAt).toLocaleString()}</p>
)}
</CardContent>
</Card>
</div>
{/* Stats */}
<div className="grid gap-4 md:grid-cols-4">
<Card>
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
<CardTitle className="text-sm font-medium">Registrations</CardTitle>
<Users className="h-4 w-4 text-muted-foreground" />
</CardHeader>
<CardContent>
<div className="text-2xl font-bold">
{event.registrations.length}
</div>
{event.maxPlayers && (
<p className="text-xs text-muted-foreground">
Max: {event.maxPlayers}
</p>
)}
</CardContent>
</Card>
<Card>
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
<CardTitle className="text-sm font-medium">Prizes</CardTitle>
<Gift className="h-4 w-4 text-muted-foreground" />
</CardHeader>
<CardContent>
<div className="text-2xl font-bold">{event.prizes.length}</div>
</CardContent>
</Card>
<Card>
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
<CardTitle className="text-sm font-medium">Winners</CardTitle>
<Trophy className="h-4 w-4 text-muted-foreground" />
</CardHeader>
<CardContent>
<div className="text-2xl font-bold">{event.winners.length}</div>
</CardContent>
</Card>
<Card>
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
<CardTitle className="text-sm font-medium">Time</CardTitle>
<CalendarDays className="h-4 w-4 text-muted-foreground" />
</CardHeader>
<CardContent>
<div className="text-sm font-medium">
{new Date(event.startsAt) > new Date() ? "Upcoming" : "Past"}
</div>
{event.endsAt && (
<p className="text-xs text-muted-foreground">
Ends: {new Date(event.endsAt).toLocaleString()}
</p>
)}
</CardContent>
</Card>
</div>
{/* Edit form */}
<EventForm
eventTypes={eventTypes}
defaultValues={{
id: event.id,
title: event.title,
description: event.description,
typeId: event.typeId,
roomId: event.roomId,
startsAt: event.startsAt,
endsAt: event.endsAt,
maxPlayers: event.maxPlayers,
isRecurring: event.isRecurring,
recurrenceRule: event.recurrenceRule,
status: event.status as "draft" | "published" | "cancelled" | "completed",
image: event.image,
}}
/>
{/* Edit form */}
<EventForm
eventTypes={eventTypes}
defaultValues={{
id: event.id,
title: event.title,
description: event.description,
typeId: event.typeId,
roomId: event.roomId,
startsAt: event.startsAt,
endsAt: event.endsAt,
maxPlayers: event.maxPlayers,
isRecurring: event.isRecurring,
recurrenceRule: event.recurrenceRule,
status: event.status as
| "draft"
| "published"
| "cancelled"
| "completed",
image: event.image,
}}
/>
{/* Prizes */}
<EventPrizesManager eventId={event.id} prizes={event.prizes} />
{/* Prizes */}
<EventPrizesManager eventId={event.id} prizes={event.prizes} />
{/* Winners */}
<EventWinnersManager
eventId={event.id}
winners={event.winners.map((w) => ({
...w,
username: userMap.get(w.userId) ?? `User #${w.userId}`,
}))}
/>
{/* Winners */}
<EventWinnersManager
eventId={event.id}
winners={event.winners.map((w) => ({
...w,
username: userMap.get(w.userId) ?? `User #${w.userId}`,
}))}
/>
{/* Registrations */}
<EventRegistrations
registrations={event.registrations.map((r) => ({
...r,
username: userMap.get(r.userId) ?? `User #${r.userId}`,
}))}
/>
</div>
);
{/* Registrations */}
<EventRegistrations
registrations={event.registrations.map((r) => ({
...r,
username: userMap.get(r.userId) ?? `User #${r.userId}`,
}))}
/>
</div>
);
}
+17 -17
View File
@@ -4,24 +4,24 @@ import { prisma } from "@/lib/prisma";
import { EventForm } from "../event-form";
export default async function CreateEventPage() {
const { session, permissions } = await getAdminContext();
if (!canAccess(permissions, PERMS.EVENTS_EDIT, session.user.rank)) {
redirect("/admin/events");
}
const { session, permissions } = await getAdminContext();
if (!canAccess(permissions, PERMS.EVENTS_EDIT, session.user.rank)) {
redirect("/admin/events");
}
const eventTypes = await prisma.websiteEventType.findMany({
where: { isActive: 1 },
orderBy: { name: "asc" },
});
const eventTypes = await prisma.websiteEventType.findMany({
where: { isActive: 1 },
orderBy: { name: "asc" },
});
return (
<div className="space-y-6">
<div>
<h1 className="text-3xl font-bold tracking-tight">Create Event</h1>
<p className="text-muted-foreground">Schedule a new hotel event</p>
</div>
return (
<div className="space-y-6">
<div>
<h1 className="text-3xl font-bold tracking-tight">Create Event</h1>
<p className="text-muted-foreground">Schedule a new hotel event</p>
</div>
<EventForm eventTypes={eventTypes} />
</div>
);
<EventForm eventTypes={eventTypes} />
</div>
);
}
+171 -135
View File
@@ -7,159 +7,195 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { DateTimePicker } from "@/components/ui/date-time-picker";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
import { Textarea } from "@/components/ui/textarea";
import { useServerAction } from "@/hooks/use-server-action";
import type { CreateEventInput } from "@/lib/validators/event";
interface EventType {
id: number;
name: string;
slug: string;
color: string;
id: number;
name: string;
slug: string;
color: string;
}
interface EventFormProps {
eventTypes: EventType[];
defaultValues?: Partial<CreateEventInput> & { id?: number };
eventTypes: EventType[];
defaultValues?: Partial<CreateEventInput> & { id?: number };
}
export function EventForm({ eventTypes, defaultValues }: EventFormProps) {
const { run, isPending } = useServerAction();
const isEditing = !!defaultValues?.id;
const { run, isPending } = useServerAction();
const isEditing = !!defaultValues?.id;
const form = useForm({
defaultValues: {
title: "",
description: "",
typeId: eventTypes[0]?.id,
status: "draft",
isRecurring: 0,
...defaultValues,
},
});
const form = useForm({
defaultValues: {
title: "",
description: "",
typeId: eventTypes[0]?.id,
status: "draft",
isRecurring: 0,
...defaultValues,
},
});
// biome-ignore lint/suspicious/noExplicitAny: form values typed by useForm defaults; createEvent does its own zod validation
function onSubmit(data: any) {
if (isEditing && defaultValues?.id) {
run(() => updateEvent({ id: defaultValues.id!, ...data }), {
successMessage: "Event updated!",
});
} else {
run(() => createEvent(data), {
successMessage: "Event created!",
onSuccess: (result) => {
const data = result.data as Record<string, unknown> | undefined;
if (data?.id) {
window.location.href = `/admin/events/${data.id}`;
}
},
});
}
}
// biome-ignore lint/suspicious/noExplicitAny: form values typed by useForm defaults; createEvent does its own zod validation
function onSubmit(data: any) {
if (isEditing && defaultValues?.id) {
run(() => updateEvent({ id: defaultValues.id!, ...data }), {
successMessage: "Event updated!",
});
} else {
run(() => createEvent(data), {
successMessage: "Event created!",
onSuccess: (result) => {
const data = result.data as Record<string, unknown> | undefined;
if (data?.id) {
window.location.href = `/admin/events/${data.id}`;
}
},
});
}
}
return (
<form onSubmit={form.handleSubmit(onSubmit)}>
<Card>
<CardHeader>
<CardTitle>{isEditing ? "Edit Event" : "Event Details"}</CardTitle>
</CardHeader>
<CardContent className="space-y-4">
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="space-y-2">
<Label htmlFor="title">Title</Label>
<Input id="title" {...form.register("title")} />
{form.formState.errors.title && (
<p className="text-sm text-destructive">{form.formState.errors.title.message}</p>
)}
</div>
return (
<form onSubmit={form.handleSubmit(onSubmit)}>
<Card>
<CardHeader>
<CardTitle>{isEditing ? "Edit Event" : "Event Details"}</CardTitle>
</CardHeader>
<CardContent className="space-y-4">
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="space-y-2">
<Label htmlFor="title">Title</Label>
<Input id="title" {...form.register("title")} />
{form.formState.errors.title && (
<p className="text-sm text-destructive">
{form.formState.errors.title.message}
</p>
)}
</div>
<div className="space-y-2">
<Label htmlFor="typeId">Event Type</Label>
<Select
value={String(form.watch("typeId"))}
onValueChange={(v) => form.setValue("typeId", Number(v))}
>
<SelectTrigger>
<SelectValue placeholder="Select type" />
</SelectTrigger>
<SelectContent>
{eventTypes.map((t) => (
<SelectItem key={t.id} value={String(t.id)}>
{t.name}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
</div>
<div className="space-y-2">
<Label htmlFor="typeId">Event Type</Label>
<Select
value={String(form.watch("typeId"))}
onValueChange={(v) => form.setValue("typeId", Number(v))}
>
<SelectTrigger>
<SelectValue placeholder="Select type" />
</SelectTrigger>
<SelectContent>
{eventTypes.map((t) => (
<SelectItem key={t.id} value={String(t.id)}>
{t.name}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
</div>
<div className="space-y-2">
<Label htmlFor="description">Description</Label>
<Textarea id="description" rows={4} {...form.register("description")} />
</div>
<div className="space-y-2">
<Label htmlFor="description">Description</Label>
<Textarea
id="description"
rows={4}
{...form.register("description")}
/>
</div>
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div className="space-y-2">
<Label>Starts At</Label>
<DateTimePicker
value={form.watch("startsAt")}
// biome-ignore lint/suspicious/noExplicitAny: form value type inferred loose; runtime validated by zod on submit
onChange={(d) => form.setValue("startsAt", d as any, { shouldDirty: true })}
placeholder="Select start date"
/>
</div>
<div className="space-y-2">
<Label>Ends At</Label>
<DateTimePicker
value={form.watch("endsAt")}
// biome-ignore lint/suspicious/noExplicitAny: form value type inferred loose; runtime validated by zod on submit
onChange={(d) => form.setValue("endsAt", d as any, { shouldDirty: true })}
placeholder="Select end date"
/>
</div>
<div className="space-y-2">
<Label htmlFor="maxPlayers">Max Players</Label>
<Input id="maxPlayers" type="number" {...form.register("maxPlayers")} placeholder="Unlimited" />
</div>
</div>
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div className="space-y-2">
<Label>Starts At</Label>
<DateTimePicker
value={form.watch("startsAt")}
// biome-ignore lint/suspicious/noExplicitAny: form value type inferred loose; runtime validated by zod on submit
onChange={(d) =>
form.setValue("startsAt", d as any, { shouldDirty: true })
}
placeholder="Select start date"
/>
</div>
<div className="space-y-2">
<Label>Ends At</Label>
<DateTimePicker
value={form.watch("endsAt")}
// biome-ignore lint/suspicious/noExplicitAny: form value type inferred loose; runtime validated by zod on submit
onChange={(d) =>
form.setValue("endsAt", d as any, { shouldDirty: true })
}
placeholder="Select end date"
/>
</div>
<div className="space-y-2">
<Label htmlFor="maxPlayers">Max Players</Label>
<Input
id="maxPlayers"
type="number"
{...form.register("maxPlayers")}
placeholder="Unlimited"
/>
</div>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="space-y-2">
<Label htmlFor="roomId">Room ID</Label>
<Input id="roomId" type="number" {...form.register("roomId")} placeholder="Optional" />
</div>
<div className="space-y-2">
<Label htmlFor="status">Status</Label>
<Select
value={form.watch("status")}
onValueChange={(v) => form.setValue("status", v as CreateEventInput["status"])}
>
<SelectTrigger>
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="draft">Draft</SelectItem>
<SelectItem value="published">Published</SelectItem>
<SelectItem value="cancelled">Cancelled</SelectItem>
<SelectItem value="completed">Completed</SelectItem>
</SelectContent>
</Select>
</div>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="space-y-2">
<Label htmlFor="roomId">Room ID</Label>
<Input
id="roomId"
type="number"
{...form.register("roomId")}
placeholder="Optional"
/>
</div>
<div className="space-y-2">
<Label htmlFor="status">Status</Label>
<Select
value={form.watch("status")}
onValueChange={(v) =>
form.setValue("status", v as CreateEventInput["status"])
}
>
<SelectTrigger>
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="draft">Draft</SelectItem>
<SelectItem value="published">Published</SelectItem>
<SelectItem value="cancelled">Cancelled</SelectItem>
<SelectItem value="completed">Completed</SelectItem>
</SelectContent>
</Select>
</div>
</div>
<div className="space-y-2">
<Label htmlFor="image">Image URL</Label>
<Input id="image" {...form.register("image")} placeholder="https://..." />
</div>
<div className="space-y-2">
<Label htmlFor="image">Image URL</Label>
<Input
id="image"
{...form.register("image")}
placeholder="https://..."
/>
</div>
<div className="flex justify-end">
<Button type="submit" disabled={isPending}>
{isPending ? "Saving..." : isEditing ? "Update Event" : "Create Event"}
</Button>
</div>
</CardContent>
</Card>
</form>
);
<div className="flex justify-end">
<Button type="submit" disabled={isPending}>
{isPending
? "Saving..."
: isEditing
? "Update Event"
: "Create Event"}
</Button>
</div>
</CardContent>
</Card>
</form>
);
}
+74 -59
View File
@@ -8,74 +8,89 @@ import { Button } from "@/components/ui/button";
import type { DataTableColumn, PaginatedResult } from "@/types";
interface EventRow {
id: number;
title: string;
typeName: string;
typeColor: string;
startsAt: Date;
endsAt: Date | null;
status: string;
hostUserId: number;
id: number;
title: string;
typeName: string;
typeColor: string;
startsAt: Date;
endsAt: Date | null;
status: string;
hostUserId: number;
}
const statusVariants: Record<string, "default" | "secondary" | "outline" | "destructive"> = {
published: "default",
draft: "secondary",
cancelled: "destructive",
completed: "outline",
const statusVariants: Record<
string,
"default" | "secondary" | "outline" | "destructive"
> = {
published: "default",
draft: "secondary",
cancelled: "destructive",
completed: "outline",
};
function getColumns(): DataTableColumn<EventRow>[] {
return [
{ key: "id", label: "ID", sortable: true },
{
key: "title",
label: "Title",
sortable: true,
render: (value) => <span className="font-medium">{String(value)}</span>,
},
{
key: "typeName",
label: "Type",
sortable: false,
render: (_, row) => (
<Badge style={{ backgroundColor: row.typeColor, color: "#fff" }}>{row.typeName}</Badge>
),
},
{
key: "startsAt",
label: "Starts",
sortable: true,
render: (value) => (
<span className="text-sm">{new Date(value as unknown as string).toLocaleString()}</span>
),
},
{
key: "status",
label: "Status",
sortable: true,
render: (value) => (
<Badge variant={statusVariants[String(value)] ?? "secondary"}>{String(value)}</Badge>
),
},
{
key: "actions",
label: "Actions",
render: (_, row) => (
<Button variant="ghost" size="icon" asChild>
<Link href={`/admin/events/${row.id}`}>
<Pencil className="h-4 w-4" />
</Link>
</Button>
),
},
];
return [
{ key: "id", label: "ID", sortable: true },
{
key: "title",
label: "Title",
sortable: true,
render: (value) => <span className="font-medium">{String(value)}</span>,
},
{
key: "typeName",
label: "Type",
sortable: false,
render: (_, row) => (
<Badge style={{ backgroundColor: row.typeColor, color: "#fff" }}>
{row.typeName}
</Badge>
),
},
{
key: "startsAt",
label: "Starts",
sortable: true,
render: (value) => (
<span className="text-sm">
{new Date(value as unknown as string).toLocaleString()}
</span>
),
},
{
key: "status",
label: "Status",
sortable: true,
render: (value) => (
<Badge variant={statusVariants[String(value)] ?? "secondary"}>
{String(value)}
</Badge>
),
},
{
key: "actions",
label: "Actions",
render: (_, row) => (
<Button variant="ghost" size="icon" asChild>
<Link href={`/admin/events/${row.id}`}>
<Pencil className="h-4 w-4" />
</Link>
</Button>
),
},
];
}
interface EventsTableProps {
data: PaginatedResult<EventRow>;
data: PaginatedResult<EventRow>;
}
export function EventsTable({ data }: EventsTableProps) {
return <DataTable data={data} columns={getColumns()} searchPlaceholder="Search events..." />;
return (
<DataTable
data={data}
columns={getColumns()}
searchPlaceholder="Search events..."
/>
);
}
+58 -56
View File
@@ -5,64 +5,66 @@ import { PERMS } from "@/lib/permissions";
import { EventsTable } from "./events-table";
export default async function EventsPage({
params: paramsPromise,
searchParams,
params: paramsPromise,
searchParams,
}: {
params: Promise<{ locale: string }>;
searchParams: Promise<Record<string, string>>;
params: Promise<{ locale: string }>;
searchParams: Promise<Record<string, string>>;
}) {
const result = await fetchAdminList(
{
permission: PERMS.EVENTS_VIEW,
model: "websiteEvent",
searchFields: ["title"],
defaultSort: { startsAt: "desc" },
include: { type: { select: { name: true, color: true } } },
mapRow: (e: {
id: number;
title: string;
type: { name: string; color: string };
startsAt: Date;
endsAt: Date | null;
status: string;
hostUserId: number;
_count?: { registrations: number };
}) => ({
id: e.id,
title: e.title,
typeName: e.type.name,
typeColor: e.type.color,
startsAt: e.startsAt,
endsAt: e.endsAt,
status: e.status,
hostUserId: e.hostUserId,
}),
},
paramsPromise,
searchParams,
);
const result = await fetchAdminList(
{
permission: PERMS.EVENTS_VIEW,
model: "websiteEvent",
searchFields: ["title"],
defaultSort: { startsAt: "desc" },
include: { type: { select: { name: true, color: true } } },
mapRow: (e: {
id: number;
title: string;
type: { name: string; color: string };
startsAt: Date;
endsAt: Date | null;
status: string;
hostUserId: number;
_count?: { registrations: number };
}) => ({
id: e.id,
title: e.title,
typeName: e.type.name,
typeColor: e.type.color,
startsAt: e.startsAt,
endsAt: e.endsAt,
status: e.status,
hostUserId: e.hostUserId,
}),
},
paramsPromise,
searchParams,
);
return (
<div className="space-y-6">
<div className="flex items-center justify-between">
<div>
<h1 className="text-3xl font-bold tracking-tight">Events</h1>
<p className="text-muted-foreground">Manage hotel events, calendar and prizes</p>
</div>
<Button asChild>
<Link href="/admin/events/create">New Event</Link>
</Button>
</div>
return (
<div className="space-y-6">
<div className="flex items-center justify-between">
<div>
<h1 className="text-3xl font-bold tracking-tight">Events</h1>
<p className="text-muted-foreground">
Manage hotel events, calendar and prizes
</p>
</div>
<Button asChild>
<Link href="/admin/events/create">New Event</Link>
</Button>
</div>
<EventsTable
data={{
rows: result.rows,
total: result.total,
page: result.page,
perPage: result.perPage,
lastPage: result.lastPage,
}}
/>
</div>
);
<EventsTable
data={{
rows: result.rows,
total: result.total,
page: result.page,
perPage: result.perPage,
lastPage: result.lastPage,
}}
/>
</div>
);
}
+211 -171
View File
@@ -2,7 +2,11 @@
import { Pencil, Plus, Trash2 } from "lucide-react";
import { useState } from "react";
import { createEventType, deleteEventType, updateEventType } from "@/actions/events";
import {
createEventType,
deleteEventType,
updateEventType,
} from "@/actions/events";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
@@ -11,187 +15,223 @@ import { Label } from "@/components/ui/label";
import { useServerAction } from "@/hooks/use-server-action";
interface EventType {
id: number;
name: string;
slug: string;
description: string;
color: string;
icon: string;
isActive: number;
minRank: number;
id: number;
name: string;
slug: string;
description: string;
color: string;
icon: string;
isActive: number;
minRank: number;
}
interface Props {
eventTypes: EventType[];
eventTypes: EventType[];
}
export function EventTypesManager({ eventTypes }: Props) {
const { run, isPending } = useServerAction();
const [showForm, setShowForm] = useState(false);
const [editingId, setEditingId] = useState<number | null>(null);
const [form, setForm] = useState({
name: "",
slug: "",
description: "",
color: "#3b82f6",
icon: "calendar",
minRank: 0,
});
const { run, isPending } = useServerAction();
const [showForm, setShowForm] = useState(false);
const [editingId, setEditingId] = useState<number | null>(null);
const [form, setForm] = useState({
name: "",
slug: "",
description: "",
color: "#3b82f6",
icon: "calendar",
minRank: 0,
});
function resetForm() {
setForm({ name: "", slug: "", description: "", color: "#3b82f6", icon: "calendar", minRank: 0 });
setEditingId(null);
setShowForm(false);
}
function resetForm() {
setForm({
name: "",
slug: "",
description: "",
color: "#3b82f6",
icon: "calendar",
minRank: 0,
});
setEditingId(null);
setShowForm(false);
}
function handleEdit(et: EventType) {
setForm({
name: et.name,
slug: et.slug,
description: et.description,
color: et.color,
icon: et.icon,
minRank: et.minRank,
});
setEditingId(et.id);
setShowForm(true);
}
function handleEdit(et: EventType) {
setForm({
name: et.name,
slug: et.slug,
description: et.description,
color: et.color,
icon: et.icon,
minRank: et.minRank,
});
setEditingId(et.id);
setShowForm(true);
}
function handleSubmit(e: React.FormEvent) {
e.preventDefault();
if (editingId) {
run(() => updateEventType({ id: editingId, ...form }), {
successMessage: "Event type updated!",
onSuccess: resetForm,
});
} else {
run(() => createEventType(form), {
successMessage: "Event type created!",
onSuccess: resetForm,
});
}
}
function handleSubmit(e: React.FormEvent) {
e.preventDefault();
if (editingId) {
run(() => updateEventType({ id: editingId, ...form }), {
successMessage: "Event type updated!",
onSuccess: resetForm,
});
} else {
run(() => createEventType(form), {
successMessage: "Event type created!",
onSuccess: resetForm,
});
}
}
function handleDelete(id: number) {
run(() => deleteEventType({ id }), {
successMessage: "Event type deleted!",
});
}
function handleDelete(id: number) {
run(() => deleteEventType({ id }), {
successMessage: "Event type deleted!",
});
}
return (
<div className="space-y-4">
<div className="flex justify-end">
<Button onClick={() => setShowForm(!showForm)}>
<Plus className="h-4 w-4 mr-2" />
New Type
</Button>
</div>
return (
<div className="space-y-4">
<div className="flex justify-end">
<Button onClick={() => setShowForm(!showForm)}>
<Plus className="h-4 w-4 mr-2" />
New Type
</Button>
</div>
{showForm && (
<Card>
<CardHeader>
<CardTitle>{editingId ? "Edit Event Type" : "New Event Type"}</CardTitle>
</CardHeader>
<CardContent>
<form onSubmit={handleSubmit} className="space-y-4">
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div className="space-y-2">
<Label>Name</Label>
<Input
value={form.name}
onChange={(e) => setForm({ ...form, name: e.target.value })}
required
/>
</div>
<div className="space-y-2">
<Label>Slug</Label>
<Input
value={form.slug}
onChange={(e) => setForm({ ...form, slug: e.target.value })}
required
placeholder="game-night"
/>
</div>
<div className="space-y-2">
<Label>Color</Label>
<Input
type="color"
value={form.color}
onChange={(e) => setForm({ ...form, color: e.target.value })}
/>
</div>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="space-y-2">
<Label>Description</Label>
<Input
value={form.description}
onChange={(e) => setForm({ ...form, description: e.target.value })}
/>
</div>
<div className="space-y-2">
<Label>Rank minimo (0 = tutti)</Label>
<Input
type="number"
min={0}
max={7}
value={form.minRank}
onChange={(e) => setForm({ ...form, minRank: parseInt(e.target.value, 10) || 0 })}
/>
<p className="text-[10px] text-muted-foreground">0=Tutti, 3=Mod+, 4=Staff+, 6=Admin+</p>
</div>
</div>
<div className="flex gap-2 justify-end">
<Button type="button" variant="outline" onClick={resetForm}>
Cancel
</Button>
<Button type="submit" disabled={isPending}>
{isPending ? "Saving..." : editingId ? "Update" : "Create"}
</Button>
</div>
</form>
</CardContent>
</Card>
)}
{showForm && (
<Card>
<CardHeader>
<CardTitle>
{editingId ? "Edit Event Type" : "New Event Type"}
</CardTitle>
</CardHeader>
<CardContent>
<form onSubmit={handleSubmit} className="space-y-4">
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div className="space-y-2">
<Label>Name</Label>
<Input
value={form.name}
onChange={(e) => setForm({ ...form, name: e.target.value })}
required
/>
</div>
<div className="space-y-2">
<Label>Slug</Label>
<Input
value={form.slug}
onChange={(e) => setForm({ ...form, slug: e.target.value })}
required
placeholder="game-night"
/>
</div>
<div className="space-y-2">
<Label>Color</Label>
<Input
type="color"
value={form.color}
onChange={(e) =>
setForm({ ...form, color: e.target.value })
}
/>
</div>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="space-y-2">
<Label>Description</Label>
<Input
value={form.description}
onChange={(e) =>
setForm({ ...form, description: e.target.value })
}
/>
</div>
<div className="space-y-2">
<Label>Rank minimo (0 = tutti)</Label>
<Input
type="number"
min={0}
max={7}
value={form.minRank}
onChange={(e) =>
setForm({
...form,
minRank: parseInt(e.target.value, 10) || 0,
})
}
/>
<p className="text-[10px] text-muted-foreground">
0=Tutti, 3=Mod+, 4=Staff+, 6=Admin+
</p>
</div>
</div>
<div className="flex gap-2 justify-end">
<Button type="button" variant="outline" onClick={resetForm}>
Cancel
</Button>
<Button type="submit" disabled={isPending}>
{isPending ? "Saving..." : editingId ? "Update" : "Create"}
</Button>
</div>
</form>
</CardContent>
</Card>
)}
<Card>
<CardContent className="p-0">
<div className="divide-y">
{eventTypes.length === 0 && (
<div className="p-6 text-center text-muted-foreground">
No event types yet. Create your first one above.
</div>
)}
{eventTypes.map((et) => (
<div key={et.id} className="flex items-center justify-between px-4 py-3">
<div className="flex items-center gap-3">
<div className="w-3 h-3 rounded-full" style={{ backgroundColor: et.color }} />
<div>
<span className="font-medium">{et.name}</span>
<span className="ml-2 text-xs text-muted-foreground">{et.slug}</span>
</div>
<Badge variant={et.isActive ? "default" : "outline"}>
{et.isActive ? "Active" : "Inactive"}
</Badge>
{et.minRank > 0 && (
<Badge variant="secondary" className="text-[10px]">
Rank {et.minRank}+
</Badge>
)}
</div>
<div className="flex gap-1">
<Button variant="ghost" size="icon" onClick={() => handleEdit(et)}>
<Pencil className="h-4 w-4" />
</Button>
<Button variant="ghost" size="icon" onClick={() => handleDelete(et.id)}>
<Trash2 className="h-4 w-4 text-destructive" />
</Button>
</div>
</div>
))}
</div>
</CardContent>
</Card>
</div>
);
<Card>
<CardContent className="p-0">
<div className="divide-y">
{eventTypes.length === 0 && (
<div className="p-6 text-center text-muted-foreground">
No event types yet. Create your first one above.
</div>
)}
{eventTypes.map((et) => (
<div
key={et.id}
className="flex items-center justify-between px-4 py-3"
>
<div className="flex items-center gap-3">
<div
className="w-3 h-3 rounded-full"
style={{ backgroundColor: et.color }}
/>
<div>
<span className="font-medium">{et.name}</span>
<span className="ml-2 text-xs text-muted-foreground">
{et.slug}
</span>
</div>
<Badge variant={et.isActive ? "default" : "outline"}>
{et.isActive ? "Active" : "Inactive"}
</Badge>
{et.minRank > 0 && (
<Badge variant="secondary" className="text-[10px]">
Rank {et.minRank}+
</Badge>
)}
</div>
<div className="flex gap-1">
<Button
variant="ghost"
size="icon"
onClick={() => handleEdit(et)}
>
<Pencil className="h-4 w-4" />
</Button>
<Button
variant="ghost"
size="icon"
onClick={() => handleDelete(et.id)}
>
<Trash2 className="h-4 w-4 text-destructive" />
</Button>
</div>
</div>
))}
</div>
</CardContent>
</Card>
</div>
);
}
+18 -16
View File
@@ -4,23 +4,25 @@ import { prisma } from "@/lib/prisma";
import { EventTypesManager } from "./event-types-manager";
export default async function EventTypesPage() {
const { session, permissions } = await getAdminContext();
if (!canAccess(permissions, PERMS.EVENTS_EDIT, session.user.rank)) {
redirect("/admin/events");
}
const { session, permissions } = await getAdminContext();
if (!canAccess(permissions, PERMS.EVENTS_EDIT, session.user.rank)) {
redirect("/admin/events");
}
const eventTypes = await prisma.websiteEventType.findMany({
orderBy: { name: "asc" },
});
const eventTypes = await prisma.websiteEventType.findMany({
orderBy: { name: "asc" },
});
return (
<div className="space-y-6">
<div>
<h1 className="text-3xl font-bold tracking-tight">Event Types</h1>
<p className="text-muted-foreground">Manage event categories and types</p>
</div>
return (
<div className="space-y-6">
<div>
<h1 className="text-3xl font-bold tracking-tight">Event Types</h1>
<p className="text-muted-foreground">
Manage event categories and types
</p>
</div>
<EventTypesManager eventTypes={eventTypes} />
</div>
);
<EventTypesManager eventTypes={eventTypes} />
</div>
);
}