-
-
{/if}
diff --git a/frontend/src/lib/components/admin/BookingsCard.svelte b/frontend/src/lib/components/admin/BookingsCard.svelte
index 5aff138..fcc7fc5 100644
--- a/frontend/src/lib/components/admin/BookingsCard.svelte
+++ b/frontend/src/lib/components/admin/BookingsCard.svelte
@@ -9,6 +9,7 @@
import { Input } from '$lib/components/ui/input';
import { Skeleton } from '$lib/components/ui/skeleton';
import type { Booking } from '$lib/types/booking';
+ import { formatUserName } from '$lib/utils/nameDisplay';
// Props
let { openBookingModal }: { openBookingModal: (bookingId: string) => void } = $props();
@@ -18,18 +19,25 @@
let totalBookings = $state(0);
let bookingQuery = $state('');
let loadingSearch = $state(false);
+ // Cursor-based pagination: cursors[i] = cursor to use when loading page i+1
+ // cursors[0] is always '' (empty cursor = first page)
+ let cursors = $state
-
+ {/if}
{/if}
Awaiting admin approval
-- {#if timeChanged} - Reschedule requested from {new SvelteDate(pendingEditRequest.original.start_time!).toLocaleString('en-GB', { day: 'numeric', month: 'short', hour: '2-digit', minute: '2-digit' })} to {new SvelteDate(pendingEditRequest.proposed.start_time!).toLocaleString('en-GB', { day: 'numeric', month: 'short', hour: '2-digit', minute: '2-digit' })} + {@const originalNames = (pendingEditRequest.original.services ?? []).map(s => s.name)} + {@const proposedNames = (pendingEditRequest.proposed.services ?? []).map(s => s.name)} + {@const addedServices = proposedNames.filter(n => !originalNames.includes(n))} + {@const removedServices = originalNames.filter(n => !proposedNames.includes(n))} + {#if timeChanged || servicesChanged} +
+
-
+
+
+
Awaiting admin approval
++ {#if timeChanged} + Reschedule requested from {new SvelteDate(pendingEditRequest.original.start_time!).toLocaleString('en-GB', { day: 'numeric', month: 'short', hour: '2-digit', minute: '2-digit' })} to {new SvelteDate(pendingEditRequest.proposed.start_time!).toLocaleString('en-GB', { day: 'numeric', month: 'short', hour: '2-digit', minute: '2-digit' })} + {/if} +
+ {#if addedServices.length > 0} ++ Services added: {addedServices.join(', ')} +
{/if} - {#if servicesChanged} - {timeChanged ? ' • ' : ''}Service change requested + {#if removedServices.length > 0} ++ Services removed: {removedServices.join(', ')} +
{/if} - {pendingEditRequest.notes ? (timeChanged || servicesChanged ? ' — ' : '') + pendingEditRequest.notes : ''} - -We'll let you know once it's been reviewed
+We'll let you know once it's been reviewed
+
diff --git a/frontend/src/lib/components/admin/ApprovalModal.svelte b/frontend/src/lib/components/admin/ApprovalModal.svelte
index e0c01b8..99a6e29 100644
--- a/frontend/src/lib/components/admin/ApprovalModal.svelte
+++ b/frontend/src/lib/components/admin/ApprovalModal.svelte
@@ -4,6 +4,7 @@
import { toast } from 'svelte-sonner';
import { sanitizeText } from '$lib/utils/toast-safe';
import { formatDateTime, formatDuration, calculateAge } from '$lib/utils/format';
+ import { formatUserName } from '$lib/utils/nameDisplay';
import * as Modal from '$lib/components/ui/dialog';
import { Button } from '$lib/components/ui/button';
import { Input } from '$lib/components/ui/input';
@@ -24,6 +25,8 @@
full_name: string;
email?: string;
phone?: string;
+ previous_first_name?: string | null;
+ previous_last_name?: string | null;
};
services?: Array<{
service_id: string;
@@ -126,6 +129,8 @@
user?: {
full_name?: string;
email?: string;
+ previous_first_name?: string | null;
+ previous_last_name?: string | null;
};
services?: string[];
}
@@ -409,7 +414,7 @@
{#if oldest?.id === ob.id}
★
{/if}
- {ob.user?.full_name || 'Unknown'}
+ {formatUserName(ob.user?.full_name || 'Unknown', ob.user?.previous_first_name, ob.user?.previous_last_name)}
{new SvelteDate(ob.start_time).toLocaleDateString('en-GB', {
@@ -493,7 +498,7 @@
@@ -649,7 +654,7 @@
(null);
let guestName = $state('');
@@ -1041,7 +1042,7 @@
onclick={() => (selectedUserId = user.id)}
>
-
{booking.user?.full_name || '—'}
+ {formatUserName(booking.user?.full_name || '—', booking.user?.previous_first_name, booking.user?.previous_last_name)}
Applied Discounts
{#each booking.discounts as d}- - {d.discount_source === 'loyalty' ? 'Loyalty Stamp Card' : d.campaign_name || 'Promo Campaign'} + - {d.discount_source === 'loyalty' ? 'Loyalty Stamp Card' : d.discount_source === 'referral' ? 'Referral Discount' : d.campaign_name || 'Promo Campaign'} ({d.discount_percent}% off): -£{d.discount_amount.toFixed(2)}
{/each} diff --git a/frontend/src/lib/components/admin/BookingCreateModal.svelte b/frontend/src/lib/components/admin/BookingCreateModal.svelte index 109aa60..926906e 100644 --- a/frontend/src/lib/components/admin/BookingCreateModal.svelte +++ b/frontend/src/lib/components/admin/BookingCreateModal.svelte @@ -4,6 +4,7 @@ import { SvelteDate } from 'svelte/reactivity'; import { CalendarDate, getLocalTimeZone, type DateValue } from '@internationalized/date'; import { isValidUKPhone, toE164UK } from '$lib/utils/phone'; + import { formatUserName } from '$lib/utils/nameDisplay'; // UI Components import * as Modal from '$lib/components/ui/dialog'; @@ -55,7 +56,7 @@ let userQuery = $state(''); // Updated type to include account_role for filtering let users = $state< - Array<{ id: string; fullName: string; email?: string; phone?: string; account_role: string }> + Array<{ id: string; fullName: string; email?: string; phone?: string; account_role: string; previousFirstName?: string | null; previousLastName?: string | null }> >([]); let selectedUserId = $state
-
{/each}
+
+ {#each selectedBooking.refunds ?? [] as refund (refund.id)}
+ {user.fullName}
+ {formatUserName(user.fullName, user.previousFirstName, user.previousLastName)}
{#if user.email && user.phone}
{user.email} • {user.phone}
diff --git a/frontend/src/lib/components/admin/BookingModal.svelte b/frontend/src/lib/components/admin/BookingModal.svelte
index f58ffcc..bf85b1f 100644
--- a/frontend/src/lib/components/admin/BookingModal.svelte
+++ b/frontend/src/lib/components/admin/BookingModal.svelte
@@ -9,8 +9,11 @@
import ApprovalModal from '$lib/components/admin/ApprovalModal.svelte';
import RescheduleModal from '$lib/components/admin/RescheduleModal.svelte';
import { formatDuration, formatDateTime, calculateAge } from '$lib/utils/format';
+ import { formatUserName } from '$lib/utils/nameDisplay';
+ import { computeBalanceDue } from '$lib/utils/booking';
import { POLICY } from '$lib/constants/policy';
import type { Booking, BookingService, BookingDiscount, Payment } from '$lib/types/booking';
+ import type { Refund } from '$lib/types/index';
interface Props {
open: boolean;
@@ -34,6 +37,12 @@
.filter((p) => p.payment_method !== 'discount' && p.status === 'completed')
.reduce((sum, p) => sum + p.amount, 0)
);
+ let totalRefunds = $derived(
+ (selectedBooking?.refunds ?? [])
+ .filter((r) => r.status === 'completed')
+ .reduce((sum, r) => sum + r.amount, 0)
+ );
+ let balanceDue = $derived(selectedBooking ? computeBalanceDue(selectedBooking) : 0);
let hoursUntilAppt = $derived(
selectedBooking
? (new SvelteDate(selectedBooking.start_time).getTime() - new SvelteDate().getTime()) / (1000 * 60 * 60)
@@ -139,7 +148,9 @@
referral_code: data.user.referral_code,
referral_code_uses: data.user.referral_code_uses,
created_at: data.user.created_at,
- notes: data.user.notes
+ notes: data.user.notes,
+ previous_first_name: data.user.previous_first_name,
+ previous_last_name: data.user.previous_last_name
}
: undefined,
@@ -174,6 +185,19 @@
created_by: p.created_by
})),
+ // Refunds
+ refunds: (data.refunds || []).map((r: Refund) => ({
+ id: r.id,
+ payment_id: r.payment_id,
+ booking_id: r.booking_id,
+ amount: r.amount,
+ square_refund_id: r.square_refund_id,
+ status: r.status,
+ reason: r.reason,
+ created_by: r.created_by,
+ created_at: r.created_at
+ })),
+
// Financials
total_amount: data.total_amount || 0,
amount_paid: data.amount_paid || 0,
@@ -191,13 +215,13 @@
}
}
- function getPaymentName(payment: Payment, index: number, payments: Payment[], discounts: BookingDiscount[] | undefined): string {
+ function getPaymentName(payment: Payment, index: number, payments: Payment[] | undefined, discounts: BookingDiscount[] | undefined): string {
if (payment.payment_method === 'online_square') return 'Online Card';
if (payment.payment_method === 'in_person_card') return 'Card Machine';
if (payment.payment_method === 'cash') return 'Cash';
if (payment.payment_method === 'giftcard') return 'Gift Card';
if (payment.payment_method === 'discount') {
- const discountPaymentsBefore = payments.slice(0, index).filter(p => p.payment_method === 'discount').length;
+ const discountPaymentsBefore = (payments ?? []).slice(0, index).filter(p => p.payment_method === 'discount').length;
const discountList = (discounts ?? []).filter(d => d.discount_amount > 0.01);
if (discountList[discountPaymentsBefore]) {
const d = discountList[discountPaymentsBefore];
@@ -380,12 +404,12 @@
{#if selectedBooking.user?.profile_pic_url}
{/if}
- {#if selectedBooking.payments && selectedBooking.payments.length > 0}
+ {#if (selectedBooking.payments && selectedBooking.payments.length > 0) || (selectedBooking.refunds && selectedBooking.refunds.length > 0)}
-
{selectedBooking.user?.full_name || '—'}
+ {formatUserName(selectedBooking.user?.full_name || '—', selectedBooking.user?.previous_first_name, selectedBooking.user?.previous_last_name)}
{#if selectedBooking.user?.date_of_birth}
{calculateAge(selectedBooking.user.date_of_birth)} years old
@@ -510,6 +534,8 @@
{#if d.discount_source === 'loyalty'}
Loyalty Stamp Card (10% Off)
+ {:else if d.discount_source === 'referral'}
+ Referral Discount ({d.discount_percent}% Off)
{:else if d.campaign_name}
{d.campaign_name} ({d.discount_percent}% Off)
{:else}
@@ -533,21 +559,28 @@
+ {#if totalRefunds > 0}
+
+ Refunds
+ -£{totalRefunds.toFixed(2)}
+
+ {/if}
+
Balance Due
0.01
? 'text-red-600'
: 'text-green-600'}"
>
- £{Math.max(0, selectedBooking.total_amount - (selectedBooking.discounts ?? []).reduce((sum, d) => sum + d.discount_amount, 0) - (selectedBooking.payments ?? []).filter(p => p.payment_method !== 'discount' && p.status === 'completed').reduce((sum, p) => sum + p.amount, 0)).toFixed(2)}
+ £{balanceDue.toFixed(2)}
Payment History @@ -614,6 +647,30 @@
+
+ {/each}
+
+
+
+
+ Refund
+
+ {refund.status}
+
+
+
+ {refund.reason || 'Refund processed'}
+
+
+ {formatDateTime(refund.created_at)}
+
+
+ -£{refund.amount.toFixed(2)}
+
+