t.indorf
107 lines
4.2 KiB
TypeScript
107 lines
4.2 KiB
TypeScript
import { requireKitaSession } from "@/lib/auth-utils";
|
|
import { prisma } from "@/lib/prisma";
|
|
import { Contact, Mail, Phone, Baby } from "lucide-react";
|
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
|
import { Badge } from "@/components/ui/badge";
|
|
|
|
export default async function AdressbuchPage() {
|
|
const session = await requireKitaSession();
|
|
|
|
// Fetch only users who opted in to the directory
|
|
const users = await prisma.user.findMany({
|
|
where: {
|
|
kitaId: session.user.kitaId,
|
|
directoryOptInAt: { not: null },
|
|
},
|
|
include: {
|
|
childLinks: {
|
|
include: { child: true },
|
|
},
|
|
dutyAssignments: {
|
|
include: { duty: true },
|
|
},
|
|
},
|
|
orderBy: { lastName: "asc" },
|
|
});
|
|
|
|
return (
|
|
<div className="flex h-full flex-col gap-6 p-6">
|
|
<div>
|
|
<h1 className="text-2xl font-bold tracking-tight">Adressbuch</h1>
|
|
<p className="text-muted-foreground">
|
|
Kontaktinformationen aller Eltern, die der Freigabe zugestimmt haben.
|
|
</p>
|
|
</div>
|
|
|
|
{users.length === 0 ? (
|
|
<div className="flex flex-col items-center justify-center rounded-lg border border-dashed p-8 text-center animate-in fade-in-50">
|
|
<Contact className="h-10 w-10 text-muted-foreground mb-4" />
|
|
<h3 className="mt-4 text-lg font-semibold">Keine Kontakte</h3>
|
|
<p className="mb-4 mt-2 text-sm text-muted-foreground">
|
|
Bisher hat niemand der Veröffentlichung im Adressbuch zugestimmt.
|
|
</p>
|
|
</div>
|
|
) : (
|
|
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
|
|
{users.map((u) => (
|
|
<Card key={u.id} className="flex flex-col">
|
|
<CardHeader className="pb-3">
|
|
<CardTitle className="flex justify-between items-start">
|
|
<span className="text-lg">
|
|
{u.firstName} {u.lastName}
|
|
</span>
|
|
{u.role === "ADMIN" || u.role === "KOORDINATOR" ? (
|
|
<Badge variant="secondary" className="text-[10px]">Vorstand</Badge>
|
|
) : null}
|
|
</CardTitle>
|
|
</CardHeader>
|
|
<CardContent className="flex flex-col gap-3 text-sm flex-1">
|
|
<div className="flex items-center gap-2 text-muted-foreground">
|
|
<Mail className="h-4 w-4 shrink-0" />
|
|
<a href={`mailto:${u.email}`} className="hover:text-primary transition-colors truncate">
|
|
{u.email}
|
|
</a>
|
|
</div>
|
|
{u.phone && (
|
|
<div className="flex items-center gap-2 text-muted-foreground">
|
|
<Phone className="h-4 w-4 shrink-0" />
|
|
<a href={`tel:${u.phone}`} className="hover:text-primary transition-colors">
|
|
{u.phone}
|
|
</a>
|
|
</div>
|
|
)}
|
|
|
|
{u.childLinks.length > 0 && (
|
|
<div className="flex items-start gap-2 text-muted-foreground mt-1">
|
|
<Baby className="h-4 w-4 shrink-0 mt-0.5" />
|
|
<div className="flex flex-wrap gap-1">
|
|
{u.childLinks.map(link => (
|
|
<span key={link.child.id} className="bg-muted px-1.5 py-0.5 rounded-md text-xs">
|
|
{link.child.firstName}
|
|
</span>
|
|
))}
|
|
</div>
|
|
</div>
|
|
)}
|
|
|
|
{u.dutyAssignments.length > 0 && (
|
|
<div className="mt-auto pt-3 border-t">
|
|
<span className="text-xs font-medium text-muted-foreground mb-1 block">Ämter / Dienste:</span>
|
|
<div className="flex flex-wrap gap-1">
|
|
{u.dutyAssignments.map((assignment) => (
|
|
<Badge key={assignment.duty.id} variant="outline" className="bg-primary/5 text-primary border-primary/20">
|
|
{assignment.duty.name}
|
|
</Badge>
|
|
))}
|
|
</div>
|
|
</div>
|
|
)}
|
|
</CardContent>
|
|
</Card>
|
|
))}
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|