zaid.marzguioui/myeasycms-v2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add account hierarchy framework with migrations, RLS policies, and UI components

Browse Source
This commit is contained in:
T. Zehetbauer
2026-03-31 22:18:04 +02:00
parent 7e7da0b465
commit 59546ad6d2
262 changed files with 11671 additions and 3927 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
apps/web/app/[locale]/home/[account]/courses/[courseId]/attendance/page.tsx
View File

@@ -1,11 +1,11 @@
import { ClipboardCheck, Calendar } from 'lucide-react';
import { createCourseManagementApi } from '@kit/course-management/api';
import { formatDate } from '@kit/shared/dates';
import { getSupabaseServerClient } from '@kit/supabase/server-client';
import { Badge } from '@kit/ui/badge';
import { Card, CardContent, CardHeader, CardTitle } from '@kit/ui/card';
import { createCourseManagementApi } from '@kit/course-management/api';
import { CmsPageShell } from '~/components/cms-page-shell';
import { EmptyState } from '~/components/empty-state';
@@ -14,7 +14,10 @@ interface PageProps {
searchParams: Promise<Record<string, string | string[] | undefined>>;
}
export default async function AttendancePage({ params, searchParams }: PageProps) {
export default async function AttendancePage({
params,
searchParams,
}: PageProps) {
const { account, courseId } = await params;
const search = await searchParams;
const client = getSupabaseServerClient();
@@ -28,14 +31,21 @@ export default async function AttendancePage({ params, searchParams }: PageProps
if (!course) return <div>Kurs nicht gefunden</div>;
const selectedSessionId = (search.session as string) ?? (sessions.length > 0 ? String((sessions[0] as Record<string, unknown>).id) : null);
const selectedSessionId =
(search.session as string) ??
(sessions.length > 0
? String((sessions[0] as Record<string, unknown>).id)
: null);
const attendance = selectedSessionId
? await api.getAttendance(selectedSessionId)
: [];
const attendanceMap = new Map(
attendance.map((a: Record<string, unknown>) => [String(a.participant_id), Boolean(a.present)]),
attendance.map((a: Record<string, unknown>) => [
String(a.participant_id),
Boolean(a.present),
]),
);
return (
@@ -70,9 +80,12 @@ export default async function AttendancePage({ params, searchParams }: PageProps
key={String(s.id)}
href={`/home/${account}/courses/${courseId}/attendance?session=${String(s.id)}`}
>
<Badge variant={isSelected ? 'default' : 'outline'} className="cursor-pointer px-3 py-1">
<Badge
variant={isSelected ? 'default' : 'outline'}
className="cursor-pointer px-3 py-1"
>
{s.session_date
? new Date(String(s.session_date)).toLocaleDateString('de-DE')
? formatDate(s.session_date as string)
: String(s.id)}
</Badge>
</a>
@@ -92,28 +105,38 @@ export default async function AttendancePage({ params, searchParams }: PageProps
</CardHeader>
<CardContent>
{participants.length === 0 ? (
<p className="py-6 text-center text-sm text-muted-foreground">
<p className="text-muted-foreground py-6 text-center text-sm">
Keine Teilnehmer in diesem Kurs
</p>
) : (
<div className="rounded-md border">
<table className="w-full text-sm">
<thead>
<tr className="border-b bg-muted/50">
<th className="p-3 text-left font-medium">Teilnehmer</th>
<th className="p-3 text-center font-medium">Anwesend</th>
<tr className="bg-muted/50 border-b">
<th className="p-3 text-left font-medium">
Teilnehmer
</th>
<th className="p-3 text-center font-medium">
Anwesend
</th>
</tr>
</thead>
<tbody>
{participants.map((p: Record<string, unknown>) => (
<tr key={String(p.id)} className="border-b hover:bg-muted/30">
<tr
key={String(p.id)}
className="hover:bg-muted/30 border-b"
>
<td className="p-3 font-medium">
{String(p.last_name ?? '')}, {String(p.first_name ?? '')}
{String(p.last_name ?? '')},{' '}
{String(p.first_name ?? '')}
</td>
<td className="p-3 text-center">
<input
type="checkbox"
defaultChecked={attendanceMap.get(String(p.id)) ?? false}
defaultChecked={
attendanceMap.get(String(p.id)) ?? false
}
className="h-4 w-4 rounded border-gray-300"
aria-label={`Anwesenheit ${String(p.last_name)}`}
/>

167
apps/web/app/[locale]/home/[account]/courses/[courseId]/page.tsx
View File

@@ -1,14 +1,21 @@
import Link from 'next/link';
import { GraduationCap, Users, Calendar, Euro, User, Clock } from 'lucide-react';
import {
GraduationCap,
Users,
Calendar,
Euro,
User,
Clock,
} from 'lucide-react';
import { createCourseManagementApi } from '@kit/course-management/api';
import { formatDate } from '@kit/shared/dates';
import { getSupabaseServerClient } from '@kit/supabase/server-client';
import { Badge } from '@kit/ui/badge';
import { Button } from '@kit/ui/button';
import { Card, CardContent, CardHeader, CardTitle } from '@kit/ui/card';
import { createCourseManagementApi } from '@kit/course-management/api';
import { CmsPageShell } from '~/components/cms-page-shell';
interface PageProps {
@@ -16,13 +23,22 @@ interface PageProps {
}
const STATUS_LABEL: Record<string, string> = {
planned: 'Geplant', open: 'Offen', running: 'Laufend',
completed: 'Abgeschlossen', cancelled: 'Abgesagt',
planned: 'Geplant',
open: 'Offen',
running: 'Laufend',
completed: 'Abgeschlossen',
cancelled: 'Abgesagt',
};
const STATUS_VARIANT: Record<string, 'secondary' | 'default' | 'info' | 'outline' | 'destructive'> = {
planned: 'secondary', open: 'default', running: 'info',
completed: 'outline', cancelled: 'destructive',
const STATUS_VARIANT: Record<
string,
'secondary' | 'default' | 'info' | 'outline' | 'destructive'
> = {
planned: 'secondary',
open: 'default',
running: 'info',
completed: 'outline',
cancelled: 'destructive',
};
export default async function CourseDetailPage({ params }: PageProps) {
@@ -47,19 +63,21 @@ export default async function CourseDetailPage({ params }: PageProps) {
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3">
<Card>
<CardContent className="flex items-center gap-3 p-4">
<GraduationCap className="h-5 w-5 text-primary" />
<GraduationCap className="text-primary h-5 w-5" />
<div>
<p className="text-xs text-muted-foreground">Name</p>
<p className="text-muted-foreground text-xs">Name</p>
<p className="font-semibold">{String(c.name)}</p>
</div>
</CardContent>
</Card>
<Card>
<CardContent className="flex items-center gap-3 p-4">
<Clock className="h-5 w-5 text-primary" />
<Clock className="text-primary h-5 w-5" />
<div>
<p className="text-xs text-muted-foreground">Status</p>
<Badge variant={STATUS_VARIANT[String(c.status)] ?? 'secondary'}>
<p className="text-muted-foreground text-xs">Status</p>
<Badge
variant={STATUS_VARIANT[String(c.status)] ?? 'secondary'}
>
{STATUS_LABEL[String(c.status)] ?? String(c.status)}
</Badge>
</div>
@@ -67,31 +85,33 @@ export default async function CourseDetailPage({ params }: PageProps) {
</Card>
<Card>
<CardContent className="flex items-center gap-3 p-4">
<User className="h-5 w-5 text-primary" />
<User className="text-primary h-5 w-5" />
<div>
<p className="text-xs text-muted-foreground">Dozent</p>
<p className="font-semibold">{String(c.instructor_id ?? '—')}</p>
</div>
</CardContent>
</Card>
<Card>
<CardContent className="flex items-center gap-3 p-4">
<Calendar className="h-5 w-5 text-primary" />
<div>
<p className="text-xs text-muted-foreground">Beginn – Ende</p>
<p className="text-muted-foreground text-xs">Dozent</p>
<p className="font-semibold">
{c.start_date ? new Date(String(c.start_date)).toLocaleDateString('de-DE') : '—'}
{' – '}
{c.end_date ? new Date(String(c.end_date)).toLocaleDateString('de-DE') : '—'}
{String(c.instructor_id ?? '—')}
</p>
</div>
</CardContent>
</Card>
<Card>
<CardContent className="flex items-center gap-3 p-4">
<Euro className="h-5 w-5 text-primary" />
<Calendar className="text-primary h-5 w-5" />
<div>
<p className="text-xs text-muted-foreground">Gebühr</p>
<p className="text-muted-foreground text-xs">Beginn – Ende</p>
<p className="font-semibold">
{formatDate(c.start_date as string)}
{' – '}
{formatDate(c.end_date as string)}
</p>
</div>
</CardContent>
</Card>
<Card>
<CardContent className="flex items-center gap-3 p-4">
<Euro className="text-primary h-5 w-5" />
<div>
<p className="text-muted-foreground text-xs">Gebühr</p>
<p className="font-semibold">
{c.fee != null ? `${Number(c.fee).toFixed(2)} €` : '—'}
</p>
@@ -100,9 +120,9 @@ export default async function CourseDetailPage({ params }: PageProps) {
</Card>
<Card>
<CardContent className="flex items-center gap-3 p-4">
<Users className="h-5 w-5 text-primary" />
<Users className="text-primary h-5 w-5" />
<div>
<p className="text-xs text-muted-foreground">Teilnehmer</p>
<p className="text-muted-foreground text-xs">Teilnehmer</p>
<p className="font-semibold">
{participants.length} / {String(c.capacity ?? '∞')}
</p>
@@ -116,14 +136,16 @@ export default async function CourseDetailPage({ params }: PageProps) {
<CardHeader className="flex flex-row items-center justify-between">
<CardTitle>Teilnehmer</CardTitle>
<Link href={`/home/${account}/courses/${courseId}/participants`}>
<Button variant="outline" size="sm">Alle anzeigen</Button>
<Button variant="outline" size="sm">
Alle anzeigen
</Button>
</Link>
</CardHeader>
<CardContent>
<div className="rounded-md border">
<table className="w-full text-sm">
<thead>
<tr className="border-b bg-muted/50">
<tr className="bg-muted/50 border-b">
<th className="p-3 text-left font-medium">Name</th>
<th className="p-3 text-left font-medium">E-Mail</th>
<th className="p-3 text-left font-medium">Status</th>
@@ -132,15 +154,36 @@ export default async function CourseDetailPage({ params }: PageProps) {
</thead>
<tbody>
{participants.length === 0 ? (
<tr><td colSpan={4} className="p-6 text-center text-muted-foreground">Keine Teilnehmer</td></tr>
) : participants.map((p: Record<string, unknown>) => (
<tr key={String(p.id)} className="border-b hover:bg-muted/30">
<td className="p-3 font-medium">{String(p.last_name ?? '')}, {String(p.first_name ?? '')}</td>
<td className="p-3">{String(p.email ?? '—')}</td>
<td className="p-3"><Badge variant="outline">{String(p.status ?? '—')}</Badge></td>
<td className="p-3">{p.enrolled_at ? new Date(String(p.enrolled_at)).toLocaleDateString('de-DE') : '—'}</td>
<tr>
<td
colSpan={4}
className="text-muted-foreground p-6 text-center"
>
Keine Teilnehmer
</td>
</tr>
))}
) : (
participants.map((p: Record<string, unknown>) => (
<tr
key={String(p.id)}
className="hover:bg-muted/30 border-b"
>
<td className="p-3 font-medium">
{String(p.last_name ?? '')},{' '}
{String(p.first_name ?? '')}
</td>
<td className="p-3">{String(p.email ?? '—')}</td>
<td className="p-3">
<Badge variant="outline">
{String(p.status ?? '—')}
</Badge>
</td>
<td className="p-3">
{formatDate(p.enrolled_at as string)}
</td>
</tr>
))
)}
</tbody>
</table>
</div>
@@ -152,14 +195,16 @@ export default async function CourseDetailPage({ params }: PageProps) {
<CardHeader className="flex flex-row items-center justify-between">
<CardTitle>Termine</CardTitle>
<Link href={`/home/${account}/courses/${courseId}/attendance`}>
<Button variant="outline" size="sm">Anwesenheit</Button>
<Button variant="outline" size="sm">
Anwesenheit
</Button>
</Link>
</CardHeader>
<CardContent>
<div className="rounded-md border">
<table className="w-full text-sm">
<thead>
<tr className="border-b bg-muted/50">
<tr className="bg-muted/50 border-b">
<th className="p-3 text-left font-medium">Datum</th>
<th className="p-3 text-left font-medium">Beginn</th>
<th className="p-3 text-left font-medium">Ende</th>
@@ -168,15 +213,35 @@ export default async function CourseDetailPage({ params }: PageProps) {
</thead>
<tbody>
{sessions.length === 0 ? (
<tr><td colSpan={4} className="p-6 text-center text-muted-foreground">Keine Termine</td></tr>
) : sessions.map((s: Record<string, unknown>) => (
<tr key={String(s.id)} className="border-b hover:bg-muted/30">
<td className="p-3">{s.session_date ? new Date(String(s.session_date)).toLocaleDateString('de-DE') : '—'}</td>
<td className="p-3">{String(s.start_time ?? '—')}</td>
<td className="p-3">{String(s.end_time ?? '—')}</td>
<td className="p-3">{s.cancelled ? <Badge variant="destructive">Ja</Badge> : '—'}</td>
<tr>
<td
colSpan={4}
className="text-muted-foreground p-6 text-center"
>
Keine Termine
</td>
</tr>
))}
) : (
sessions.map((s: Record<string, unknown>) => (
<tr
key={String(s.id)}
className="hover:bg-muted/30 border-b"
>
<td className="p-3">
{formatDate(s.session_date as string)}
</td>
<td className="p-3">{String(s.start_time ?? '—')}</td>
<td className="p-3">{String(s.end_time ?? '—')}</td>
<td className="p-3">
{s.cancelled ? (
<Badge variant="destructive">Ja</Badge>
) : (
'—'
)}
</td>
</tr>
))
)}
</tbody>
</table>
</div>

36
apps/web/app/[locale]/home/[account]/courses/[courseId]/participants/page.tsx
View File

@@ -2,13 +2,13 @@ import Link from 'next/link';
import { Plus, Users } from 'lucide-react';
import { createCourseManagementApi } from '@kit/course-management/api';
import { formatDate } from '@kit/shared/dates';
import { getSupabaseServerClient } from '@kit/supabase/server-client';
import { Badge } from '@kit/ui/badge';
import { Button } from '@kit/ui/button';
import { Card, CardContent, CardHeader, CardTitle } from '@kit/ui/card';
import { createCourseManagementApi } from '@kit/course-management/api';
import { CmsPageShell } from '~/components/cms-page-shell';
import { EmptyState } from '~/components/empty-state';
@@ -16,7 +16,10 @@ interface PageProps {
params: Promise<{ account: string; courseId: string }>;
}
const STATUS_VARIANT: Record<string, 'secondary' | 'default' | 'info' | 'outline' | 'destructive'> = {
const STATUS_VARIANT: Record<
string,
'secondary' | 'default' | 'info' | 'outline' | 'destructive'
> = {
enrolled: 'default',
waitlisted: 'secondary',
cancelled: 'destructive',
@@ -49,7 +52,8 @@ export default async function ParticipantsPage({ params }: PageProps) {
<div>
<h1 className="text-2xl font-bold">Teilnehmer</h1>
<p className="text-muted-foreground">
{String((course as Record<string, unknown>).name)} — {participants.length} Teilnehmer
{String((course as Record<string, unknown>).name)} —{' '}
{participants.length} Teilnehmer
</p>
</div>
<Button>
@@ -74,31 +78,39 @@ export default async function ParticipantsPage({ params }: PageProps) {
<div className="rounded-md border">
<table className="w-full text-sm">
<thead>
<tr className="border-b bg-muted/50">
<tr className="bg-muted/50 border-b">
<th className="p-3 text-left font-medium">Name</th>
<th className="p-3 text-left font-medium">E-Mail</th>
<th className="p-3 text-left font-medium">Telefon</th>
<th className="p-3 text-left font-medium">Status</th>
<th className="p-3 text-left font-medium">Anmeldedatum</th>
<th className="p-3 text-left font-medium">
Anmeldedatum
</th>
</tr>
</thead>
<tbody>
{participants.map((p: Record<string, unknown>) => (
<tr key={String(p.id)} className="border-b hover:bg-muted/30">
<tr
key={String(p.id)}
className="hover:bg-muted/30 border-b"
>
<td className="p-3 font-medium">
{String(p.last_name ?? '')}, {String(p.first_name ?? '')}
{String(p.last_name ?? '')},{' '}
{String(p.first_name ?? '')}
</td>
<td className="p-3">{String(p.email ?? '—')}</td>
<td className="p-3">{String(p.phone ?? '—')}</td>
<td className="p-3">
<Badge variant={STATUS_VARIANT[String(p.status)] ?? 'secondary'}>
<Badge
variant={
STATUS_VARIANT[String(p.status)] ?? 'secondary'
}
>
{STATUS_LABEL[String(p.status)] ?? String(p.status)}
</Badge>
</td>
<td className="p-3">
{p.enrolled_at
? new Date(String(p.enrolled_at)).toLocaleDateString('de-DE')
: '—'}
{formatDate(p.enrolled_at as string)}
</td>
</tr>
))}