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

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

View File

@@ -1,21 +1,36 @@
'use client';
import { zodResolver } from '@hookform/resolvers/zod';
import { useForm } from 'react-hook-form';
import { useAction } from 'next-safe-action/hooks';
import { useRouter } from 'next/navigation';
import { zodResolver } from '@hookform/resolvers/zod';
import { useAction } from 'next-safe-action/hooks';
import { useForm } from 'react-hook-form';
import { Button } from '@kit/ui/button';
import { Input } from '@kit/ui/input';
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from '@kit/ui/form';
import { Card, CardContent, CardHeader, CardTitle } from '@kit/ui/card';
import {
Form,
FormControl,
FormField,
FormItem,
FormLabel,
FormMessage,
} from '@kit/ui/form';
import { Input } from '@kit/ui/input';
import { toast } from '@kit/ui/sonner';
import { CreateBookingSchema } from '../schema/booking.schema';
import { createBooking } from '../server/actions/booking-actions';
interface Props {
accountId: string;
account: string;
rooms: Array<{ id: string; roomNumber: string; name?: string; pricePerNight: number }>;
rooms: Array<{
id: string;
roomNumber: string;
name?: string;
pricePerNight: number;
}>;
}
export function CreateBookingForm({ accountId, account, rooms }: Props) {
@@ -49,80 +64,188 @@ export function CreateBookingForm({ accountId, account, rooms }: Props) {
return (
<Form {...form}>
<form onSubmit={form.handleSubmit((data) => execute(data))} className="space-y-6">
<form
onSubmit={form.handleSubmit((data) => execute(data))}
className="space-y-6"
>
<Card>
<CardHeader><CardTitle>Zimmer & Zeitraum</CardTitle></CardHeader>
<CardHeader>
<CardTitle>Zimmer & Zeitraum</CardTitle>
</CardHeader>
<CardContent className="grid grid-cols-1 gap-4 sm:grid-cols-3">
<FormField control={form.control} name="roomId" render={({ field }) => (
<FormItem><FormLabel>Zimmer *</FormLabel><FormControl>
<select {...field} className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm">
<option value=""> Zimmer wählen </option>
{rooms.map(r => (
<option key={r.id} value={r.id}>
{r.roomNumber}{r.name ? ` ${r.name}` : ''} ({r.pricePerNight} /Nacht)
</option>
))}
</select>
</FormControl><FormMessage /></FormItem>
)} />
<FormField control={form.control} name="checkIn" render={({ field }) => (
<FormItem><FormLabel>Check-in *</FormLabel><FormControl><Input type="date" {...field} /></FormControl><FormMessage /></FormItem>
)} />
<FormField control={form.control} name="checkOut" render={({ field }) => (
<FormItem><FormLabel>Check-out *</FormLabel><FormControl><Input type="date" {...field} /></FormControl><FormMessage /></FormItem>
)} />
<FormField
control={form.control}
name="roomId"
render={({ field }) => (
<FormItem>
<FormLabel>Zimmer *</FormLabel>
<FormControl>
<select
{...field}
className="border-input bg-background flex h-10 w-full rounded-md border px-3 py-2 text-sm"
>
<option value=""> Zimmer wählen </option>
{rooms.map((r) => (
<option key={r.id} value={r.id}>
{r.roomNumber}
{r.name ? ` ${r.name}` : ''} ({r.pricePerNight}{' '}
/Nacht)
</option>
))}
</select>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="checkIn"
render={({ field }) => (
<FormItem>
<FormLabel>Check-in *</FormLabel>
<FormControl>
<Input type="date" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="checkOut"
render={({ field }) => (
<FormItem>
<FormLabel>Check-out *</FormLabel>
<FormControl>
<Input type="date" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</CardContent>
</Card>
<Card>
<CardHeader><CardTitle>Gäste</CardTitle></CardHeader>
<CardHeader>
<CardTitle>Gäste</CardTitle>
</CardHeader>
<CardContent className="grid grid-cols-1 gap-4 sm:grid-cols-2">
<FormField control={form.control} name="adults" render={({ field }) => (
<FormItem><FormLabel>Erwachsene *</FormLabel><FormControl>
<Input type="number" min={1} {...field} onChange={(e) => field.onChange(Number(e.target.value))} />
</FormControl><FormMessage /></FormItem>
)} />
<FormField control={form.control} name="children" render={({ field }) => (
<FormItem><FormLabel>Kinder</FormLabel><FormControl>
<Input type="number" min={0} {...field} onChange={(e) => field.onChange(Number(e.target.value))} />
</FormControl><FormMessage /></FormItem>
)} />
<FormField
control={form.control}
name="adults"
render={({ field }) => (
<FormItem>
<FormLabel>Erwachsene *</FormLabel>
<FormControl>
<Input
type="number"
min={1}
{...field}
onChange={(e) => field.onChange(Number(e.target.value))}
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="children"
render={({ field }) => (
<FormItem>
<FormLabel>Kinder</FormLabel>
<FormControl>
<Input
type="number"
min={0}
{...field}
onChange={(e) => field.onChange(Number(e.target.value))}
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</CardContent>
</Card>
<Card>
<CardHeader><CardTitle>Preis & Notizen</CardTitle></CardHeader>
<CardHeader>
<CardTitle>Preis & Notizen</CardTitle>
</CardHeader>
<CardContent className="grid grid-cols-1 gap-4 sm:grid-cols-2">
<FormField control={form.control} name="totalPrice" render={({ field }) => (
<FormItem><FormLabel>Gesamtpreis ()</FormLabel><FormControl>
<Input type="number" min={0} step="0.01" {...field} onChange={(e) => field.onChange(Number(e.target.value))} />
</FormControl><FormMessage /></FormItem>
)} />
<FormField control={form.control} name="status" render={({ field }) => (
<FormItem><FormLabel>Status</FormLabel><FormControl>
<select {...field} className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm">
<option value="pending">Ausstehend</option>
<option value="confirmed">Bestätigt</option>
<option value="checked_in">Eingecheckt</option>
<option value="checked_out">Ausgecheckt</option>
<option value="cancelled">Storniert</option>
<option value="no_show">Nicht erschienen</option>
</select>
</FormControl><FormMessage /></FormItem>
)} />
<FormField
control={form.control}
name="totalPrice"
render={({ field }) => (
<FormItem>
<FormLabel>Gesamtpreis ()</FormLabel>
<FormControl>
<Input
type="number"
min={0}
step="0.01"
{...field}
onChange={(e) => field.onChange(Number(e.target.value))}
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="status"
render={({ field }) => (
<FormItem>
<FormLabel>Status</FormLabel>
<FormControl>
<select
{...field}
className="border-input bg-background flex h-10 w-full rounded-md border px-3 py-2 text-sm"
>
<option value="pending">Ausstehend</option>
<option value="confirmed">Bestätigt</option>
<option value="checked_in">Eingecheckt</option>
<option value="checked_out">Ausgecheckt</option>
<option value="cancelled">Storniert</option>
<option value="no_show">Nicht erschienen</option>
</select>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<div className="sm:col-span-2">
<FormField control={form.control} name="notes" render={({ field }) => (
<FormItem><FormLabel>Notizen</FormLabel><FormControl>
<textarea {...field} className="flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm" />
</FormControl><FormMessage /></FormItem>
)} />
<FormField
control={form.control}
name="notes"
render={({ field }) => (
<FormItem>
<FormLabel>Notizen</FormLabel>
<FormControl>
<textarea
{...field}
className="border-input bg-background flex min-h-[80px] w-full rounded-md border px-3 py-2 text-sm"
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</div>
</CardContent>
</Card>
<div className="flex justify-end gap-2">
<Button type="button" variant="outline" onClick={() => router.back()}>Abbrechen</Button>
<Button type="submit" disabled={isPending}>{isPending ? 'Wird erstellt...' : 'Buchung erstellen'}</Button>
<Button type="button" variant="outline" onClick={() => router.back()}>
Abbrechen
</Button>
<Button type="submit" disabled={isPending}>
{isPending ? 'Wird erstellt...' : 'Buchung erstellen'}
</Button>
</div>
</form>
</Form>

View File

@@ -1,6 +1,13 @@
import { z } from 'zod';
export const BookingStatusEnum = z.enum(['pending', 'confirmed', 'checked_in', 'checked_out', 'cancelled', 'no_show']);
export const BookingStatusEnum = z.enum([
'pending',
'confirmed',
'checked_in',
'checked_out',
'cancelled',
'no_show',
]);
export const CreateRoomSchema = z.object({
accountId: z.string().uuid(),

View File

@@ -1,9 +1,11 @@
'use server';
import { z } from 'zod';
import { authActionClient } from '@kit/next/safe-action';
import { getLogger } from '@kit/shared/logger';
import { getSupabaseServerClient } from '@kit/supabase/server-client';
import {
CreateBookingSchema,
CreateGuestSchema,

View File

@@ -1,6 +1,7 @@
import type { Database } from '@kit/supabase/database';
import type { SupabaseClient } from '@supabase/supabase-js';
import type { Database } from '@kit/supabase/database';
import type { CreateBookingInput } from '../schema/booking.schema';
/* eslint-disable @typescript-eslint/no-explicit-any */
@@ -11,21 +12,31 @@ export function createBookingManagementApi(client: SupabaseClient<Database>) {
return {
// --- Rooms ---
async listRooms(accountId: string) {
const { data, error } = await client.from('rooms').select('*')
.eq('account_id', accountId).eq('is_active', true).order('room_number');
const { data, error } = await client
.from('rooms')
.select('*')
.eq('account_id', accountId)
.eq('is_active', true)
.order('room_number');
if (error) throw error;
return data ?? [];
},
async getRoom(roomId: string) {
const { data, error } = await client.from('rooms').select('*').eq('id', roomId).single();
const { data, error } = await client
.from('rooms')
.select('*')
.eq('id', roomId)
.single();
if (error) throw error;
return data;
},
// --- Availability ---
async checkAvailability(roomId: string, checkIn: string, checkOut: string) {
const { count, error } = await client.from('bookings').select('*', { count: 'exact', head: true })
const { count, error } = await client
.from('bookings')
.select('*', { count: 'exact', head: true })
.eq('room_id', roomId)
.not('status', 'in', '("cancelled","no_show")')
.lt('check_in', checkOut)
@@ -35,9 +46,15 @@ export function createBookingManagementApi(client: SupabaseClient<Database>) {
},
// --- Bookings ---
async listBookings(accountId: string, opts?: { status?: string; from?: string; to?: string; page?: number }) {
let query = client.from('bookings').select('*', { count: 'exact' })
.eq('account_id', accountId).order('check_in', { ascending: false });
async listBookings(
accountId: string,
opts?: { status?: string; from?: string; to?: string; page?: number },
) {
let query = client
.from('bookings')
.select('*', { count: 'exact' })
.eq('account_id', accountId)
.order('check_in', { ascending: false });
if (opts?.status) query = query.eq('status', opts.status);
if (opts?.from) query = query.gte('check_in', opts.from);
if (opts?.to) query = query.lte('check_out', opts.to);
@@ -49,48 +66,106 @@ export function createBookingManagementApi(client: SupabaseClient<Database>) {
},
async createBooking(input: CreateBookingInput) {
const available = await this.checkAvailability(input.roomId, input.checkIn, input.checkOut);
if (!available) throw new Error('Room is not available for the selected dates');
const available = await this.checkAvailability(
input.roomId,
input.checkIn,
input.checkOut,
);
if (!available)
throw new Error('Room is not available for the selected dates');
const { data, error } = await client.from('bookings').insert({
account_id: input.accountId, room_id: input.roomId, guest_id: input.guestId,
check_in: input.checkIn, check_out: input.checkOut,
adults: input.adults, children: input.children,
status: input.status, total_price: input.totalPrice, notes: input.notes,
}).select().single();
const { data, error } = await client
.from('bookings')
.insert({
account_id: input.accountId,
room_id: input.roomId,
guest_id: input.guestId,
check_in: input.checkIn,
check_out: input.checkOut,
adults: input.adults,
children: input.children,
status: input.status,
total_price: input.totalPrice,
notes: input.notes,
})
.select()
.single();
if (error) throw error;
return data;
},
async updateBookingStatus(bookingId: string, status: string) {
const { error } = await client.from('bookings').update({ status }).eq('id', bookingId);
const { error } = await client
.from('bookings')
.update({ status })
.eq('id', bookingId);
if (error) throw error;
},
// --- Guests ---
async listGuests(accountId: string, search?: string) {
let query = client.from('guests').select('*').eq('account_id', accountId).order('last_name');
if (search) query = query.or(`last_name.ilike.%${search}%,first_name.ilike.%${search}%,email.ilike.%${search}%`);
let query = client
.from('guests')
.select('*')
.eq('account_id', accountId)
.order('last_name');
if (search)
query = query.or(
`last_name.ilike.%${search}%,first_name.ilike.%${search}%,email.ilike.%${search}%`,
);
const { data, error } = await query;
if (error) throw error;
return data ?? [];
},
async createGuest(input: { accountId: string; firstName: string; lastName: string; email?: string; phone?: string; city?: string }) {
const { data, error } = await client.from('guests').insert({
account_id: input.accountId, first_name: input.firstName, last_name: input.lastName,
email: input.email, phone: input.phone, city: input.city,
}).select().single();
async createGuest(input: {
accountId: string;
firstName: string;
lastName: string;
email?: string;
phone?: string;
city?: string;
}) {
const { data, error } = await client
.from('guests')
.insert({
account_id: input.accountId,
first_name: input.firstName,
last_name: input.lastName,
email: input.email,
phone: input.phone,
city: input.city,
})
.select()
.single();
if (error) throw error;
return data;
},
async createRoom(input: { accountId: string; roomNumber: string; name?: string; roomType?: string; capacity?: number; floor?: number; pricePerNight: number; description?: string }) {
const { data, error } = await client.from('rooms').insert({
account_id: input.accountId, room_number: input.roomNumber, name: input.name,
room_type: input.roomType ?? 'standard', capacity: input.capacity ?? 2,
floor: input.floor, price_per_night: input.pricePerNight, description: input.description,
}).select().single();
async createRoom(input: {
accountId: string;
roomNumber: string;
name?: string;
roomType?: string;
capacity?: number;
floor?: number;
pricePerNight: number;
description?: string;
}) {
const { data, error } = await client
.from('rooms')
.insert({
account_id: input.accountId,
room_number: input.roomNumber,
name: input.name,
room_type: input.roomType ?? 'standard',
capacity: input.capacity ?? 2,
floor: input.floor,
price_per_night: input.pricePerNight,
description: input.description,
})
.select()
.single();
if (error) throw error;
return data;
},