feat: wire 10 dead buttons across 6 modules to their server actions
Every module had buttons that rendered visually but did nothing when clicked. Server actions existed for all of them. Created client components with dialogs/forms and wired them in. BOOKINGS MODULE: - BookingStatusActions: Check-in/Check-out/Cancel buttons now call updateBookingStatus server action with loading states + toast - CreateRoomDialog: 'Neues Zimmer' opens dialog with room number, name, capacity, price/night fields → calls createRoom - CreateGuestDialog: 'Neuer Gast' opens dialog with first/last name, email, phone fields → calls createGuest COURSES MODULE: - EnrollParticipantDialog: 'Teilnehmer anmelden' on participants page opens dialog with first/last name, email, phone → calls enrollParticipant EVENTS MODULE: - EventRegistrationDialog: 'Anmeldung' button on event detail opens dialog with participant data + DOB → calls registerForEvent - CreateHolidayPassDialog: 'Neuer Ferienpass' opens dialog with name, year, description, price, date range → calls createHolidayPass NEWSLETTER MODULE: - CreateTemplateDialog: 'Neue Vorlage' opens dialog with name, subject, HTML body → calls createTemplate SITE-BUILDER MODULE: - Posts 'Neuer Beitrag' button now links to /posts/new page All dialogs use German labels, helpful placeholders, loading spinners, toast notifications, and form validation appropriate for association board members (Vereinsvorstände, 40-65, moderate tech skills).
This commit is contained in:
@@ -4,13 +4,11 @@ import {
|
||||
ArrowLeft,
|
||||
BedDouble,
|
||||
CalendarDays,
|
||||
LogIn,
|
||||
LogOut,
|
||||
XCircle,
|
||||
User,
|
||||
} from 'lucide-react';
|
||||
import { getTranslations } from 'next-intl/server';
|
||||
|
||||
import { BookingStatusActions } from '@kit/booking-management/components';
|
||||
import { formatDate, formatCurrencyAmount } from '@kit/shared/dates';
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
import { Badge } from '@kit/ui/badge';
|
||||
@@ -288,41 +286,10 @@ export default async function BookingDetailPage({ params }: PageProps) {
|
||||
<CardDescription>{t('detail.changeStatus')}</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="flex flex-wrap gap-3">
|
||||
{(status === 'pending' || status === 'confirmed') && (
|
||||
<Button variant="default">
|
||||
<LogIn className="mr-2 h-4 w-4" />
|
||||
{t('detail.checkIn')}
|
||||
</Button>
|
||||
)}
|
||||
|
||||
{status === 'checked_in' && (
|
||||
<Button variant="default">
|
||||
<LogOut className="mr-2 h-4 w-4" />
|
||||
{t('detail.checkOut')}
|
||||
</Button>
|
||||
)}
|
||||
|
||||
{status !== 'cancelled' &&
|
||||
status !== 'checked_out' &&
|
||||
status !== 'no_show' && (
|
||||
<Button variant="destructive">
|
||||
<XCircle className="mr-2 h-4 w-4" />
|
||||
{t('detail.cancel')}
|
||||
</Button>
|
||||
)}
|
||||
|
||||
{status === 'cancelled' || status === 'checked_out' ? (
|
||||
<p className="text-muted-foreground py-2 text-sm">
|
||||
{t('detail.noMoreActions', {
|
||||
statusLabel:
|
||||
status === 'cancelled'
|
||||
? t('detail.cancelledStatus')
|
||||
: t('detail.completedStatus'),
|
||||
})}
|
||||
</p>
|
||||
) : null}
|
||||
</div>
|
||||
<BookingStatusActions
|
||||
bookingId={bookingId}
|
||||
status={status}
|
||||
/>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
@@ -2,6 +2,7 @@ import { UserCircle, Plus } from 'lucide-react';
|
||||
import { getTranslations } from 'next-intl/server';
|
||||
|
||||
import { createBookingManagementApi } from '@kit/booking-management/api';
|
||||
import { CreateGuestDialog } from '@kit/booking-management/components';
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
import { Button } from '@kit/ui/button';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@kit/ui/card';
|
||||
@@ -41,10 +42,7 @@ export default async function GuestsPage({ params }: PageProps) {
|
||||
<div className="flex w-full flex-col gap-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<p className="text-muted-foreground">{t('guests.manage')}</p>
|
||||
<Button data-test="guests-new-btn">
|
||||
<Plus className="mr-2 h-4 w-4" />
|
||||
{t('guests.newGuest')}
|
||||
</Button>
|
||||
<CreateGuestDialog accountId={acct.id} />
|
||||
</div>
|
||||
|
||||
{guests.length === 0 ? (
|
||||
|
||||
@@ -2,6 +2,7 @@ import { BedDouble, Plus } from 'lucide-react';
|
||||
import { getTranslations } from 'next-intl/server';
|
||||
|
||||
import { createBookingManagementApi } from '@kit/booking-management/api';
|
||||
import { CreateRoomDialog } from '@kit/booking-management/components';
|
||||
import { formatCurrencyAmount } from '@kit/shared/dates';
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
import { Badge } from '@kit/ui/badge';
|
||||
@@ -43,10 +44,7 @@ export default async function RoomsPage({ params }: PageProps) {
|
||||
<div className="flex w-full flex-col gap-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<p className="text-muted-foreground">{t('rooms.manage')}</p>
|
||||
<Button data-test="rooms-new-btn">
|
||||
<Plus className="mr-2 h-4 w-4" />
|
||||
{t('rooms.newRoom')}
|
||||
</Button>
|
||||
<CreateRoomDialog accountId={acct.id} />
|
||||
</div>
|
||||
|
||||
{rooms.length === 0 ? (
|
||||
|
||||
@@ -2,6 +2,7 @@ import { Plus, Users } from 'lucide-react';
|
||||
import { getTranslations } from 'next-intl/server';
|
||||
|
||||
import { createCourseManagementApi } from '@kit/course-management/api';
|
||||
import { EnrollParticipantDialog } from '@kit/course-management/components';
|
||||
import { formatDate } from '@kit/shared/dates';
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
import { Badge } from '@kit/ui/badge';
|
||||
@@ -56,10 +57,7 @@ export default async function ParticipantsPage({ params }: PageProps) {
|
||||
{participants.length} {t('participants.title')}
|
||||
</p>
|
||||
</div>
|
||||
<Button data-test="participants-add-btn">
|
||||
<Plus className="mr-2 h-4 w-4" />
|
||||
{t('participants.add')}
|
||||
</Button>
|
||||
<EnrollParticipantDialog courseId={courseId} />
|
||||
</div>
|
||||
|
||||
{participants.length === 0 ? (
|
||||
|
||||
@@ -11,6 +11,7 @@ import {
|
||||
import { getTranslations } from 'next-intl/server';
|
||||
|
||||
import { createEventManagementApi } from '@kit/event-management/api';
|
||||
import { EventRegistrationDialog } from '@kit/event-management/components';
|
||||
import { formatDate } from '@kit/shared/dates';
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
import { Badge } from '@kit/ui/badge';
|
||||
@@ -73,10 +74,7 @@ export default async function EventDetailPage({ params }: PageProps) {
|
||||
)}
|
||||
</Badge>
|
||||
</div>
|
||||
<Button>
|
||||
<UserPlus className="mr-2 h-4 w-4" />
|
||||
{t('register')}
|
||||
</Button>
|
||||
<EventRegistrationDialog eventId={eventId} eventName={String((event as any).name ?? '')} />
|
||||
</div>
|
||||
|
||||
{/* Detail Cards */}
|
||||
|
||||
@@ -2,6 +2,7 @@ import { Ticket, Plus } from 'lucide-react';
|
||||
import { getTranslations } from 'next-intl/server';
|
||||
|
||||
import { createEventManagementApi } from '@kit/event-management/api';
|
||||
import { CreateHolidayPassDialog } from '@kit/event-management/components';
|
||||
import { formatDate, formatCurrencyAmount } from '@kit/shared/dates';
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
import { Button } from '@kit/ui/button';
|
||||
@@ -40,10 +41,7 @@ export default async function HolidayPassesPage({ params }: PageProps) {
|
||||
{t('holidayPassesDescription')}
|
||||
</p>
|
||||
</div>
|
||||
<Button>
|
||||
<Plus className="mr-2 h-4 w-4" />
|
||||
{t('newHolidayPass')}
|
||||
</Button>
|
||||
<CreateHolidayPassDialog accountId={acct.id} />
|
||||
</div>
|
||||
|
||||
{passes.length === 0 ? (
|
||||
|
||||
@@ -2,6 +2,7 @@ import { FileText, Plus } from 'lucide-react';
|
||||
import { getTranslations } from 'next-intl/server';
|
||||
|
||||
import { createNewsletterApi } from '@kit/newsletter/api';
|
||||
import { CreateTemplateDialog } from '@kit/newsletter/components';
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
import { Badge } from '@kit/ui/badge';
|
||||
import { Button } from '@kit/ui/button';
|
||||
@@ -41,10 +42,7 @@ export default async function NewsletterTemplatesPage({ params }: PageProps) {
|
||||
<p className="text-muted-foreground">{t('templates.subtitle')}</p>
|
||||
</div>
|
||||
|
||||
<Button data-test="newsletter-templates-new-btn">
|
||||
<Plus className="mr-2 h-4 w-4" />
|
||||
{t('templates.newTemplate')}
|
||||
</Button>
|
||||
<CreateTemplateDialog accountId={acct.id} />
|
||||
</div>
|
||||
|
||||
{/* Table or Empty State */}
|
||||
|
||||
@@ -1,3 +1,5 @@
|
||||
import Link from 'next/link';
|
||||
|
||||
import { Plus } from 'lucide-react';
|
||||
import { getTranslations } from 'next-intl/server';
|
||||
|
||||
@@ -45,9 +47,11 @@ export default async function PostsManagerPage({ params }: Props) {
|
||||
>
|
||||
<div className="space-y-6">
|
||||
<div className="flex justify-end">
|
||||
<Button data-test="site-new-post-btn">
|
||||
<Plus className="mr-2 h-4 w-4" />
|
||||
{t('posts.newPost')}
|
||||
<Button data-test="site-new-post-btn" asChild>
|
||||
<Link href={`/home/${account}/site-builder/posts/new`}>
|
||||
<Plus className="mr-2 h-4 w-4" />
|
||||
{t('posts.newPost')}
|
||||
</Link>
|
||||
</Button>
|
||||
</div>
|
||||
{posts.length === 0 ? (
|
||||
|
||||
Reference in New Issue
Block a user