Compare commits
7 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 8de1eb048c | |||
| 007643a03c | |||
| 636f6a47ec | |||
| 8ae43d524a | |||
| 05293574aa | |||
| 80b66fe20c | |||
| 67e2157975 |
+16
-1
@@ -187,9 +187,24 @@ api.route("/search", searchRouter);
|
||||
const port = Number(process.env.PORT ?? 3000);
|
||||
await initAuth();
|
||||
console.log(`API server listening on port ${port}`);
|
||||
serve({ fetch: app.fetch, port });
|
||||
const server = serve({ fetch: app.fetch, port });
|
||||
|
||||
// Start background reminder scheduler (runs every minute to check for upcoming appointments)
|
||||
startReminderScheduler();
|
||||
|
||||
function shutdown() {
|
||||
console.log("Shutting down gracefully...");
|
||||
server.close(() => {
|
||||
console.log("HTTP server closed");
|
||||
process.exit(0);
|
||||
});
|
||||
setTimeout(() => {
|
||||
console.error("Forced shutdown after timeout");
|
||||
process.exit(1);
|
||||
}, 10_000);
|
||||
}
|
||||
|
||||
process.on("SIGTERM", shutdown);
|
||||
process.on("SIGINT", shutdown);
|
||||
|
||||
export default app;
|
||||
|
||||
@@ -41,6 +41,10 @@ const createAppointmentSchema = z.object({
|
||||
frequencyWeeks: z.number().int().min(1).max(52),
|
||||
count: z.number().int().min(2).max(52),
|
||||
})
|
||||
.refine(
|
||||
(r) => r.frequencyWeeks * r.count <= 52,
|
||||
{ message: "Recurrence series must not exceed 1 year" }
|
||||
)
|
||||
.optional(),
|
||||
});
|
||||
|
||||
|
||||
@@ -102,7 +102,10 @@ bookRouter.get("/availability", async (c) => {
|
||||
|
||||
const bookingSchema = z.object({
|
||||
serviceId: z.string().uuid(),
|
||||
startTime: z.string().datetime(),
|
||||
startTime: z.string().datetime().refine(
|
||||
(dt) => new Date(dt) > new Date(),
|
||||
{ message: "Appointment must be in the future" }
|
||||
),
|
||||
clientName: z.string().min(1).max(200),
|
||||
clientEmail: z.string().email(),
|
||||
clientPhone: z.string().max(50).optional(),
|
||||
|
||||
+53
-149
@@ -4,7 +4,6 @@ import { z } from "zod/v3";
|
||||
import {
|
||||
and,
|
||||
eq,
|
||||
gte,
|
||||
getDb,
|
||||
invoices,
|
||||
invoiceLineItems,
|
||||
@@ -45,53 +44,61 @@ const updateInvoiceSchema = z.object({
|
||||
});
|
||||
|
||||
// List invoices
|
||||
invoicesRouter.get("/", async (c) => {
|
||||
const db = getDb();
|
||||
const clientId = c.req.query("clientId");
|
||||
const appointmentId = c.req.query("appointmentId");
|
||||
const status = c.req.query("status");
|
||||
const limit = Math.min(parseInt(c.req.query("limit") || "50", 10), 200);
|
||||
const offset = parseInt(c.req.query("offset") || "0", 10);
|
||||
|
||||
const conditions = [];
|
||||
if (clientId) conditions.push(eq(invoices.clientId, clientId));
|
||||
if (appointmentId) conditions.push(eq(invoices.appointmentId, appointmentId));
|
||||
if (status) conditions.push(eq(invoices.status, status as "draft" | "pending" | "paid" | "void"));
|
||||
|
||||
const whereClause = conditions.length > 0 ? and(...conditions) : undefined;
|
||||
|
||||
const [totalResult] = await db
|
||||
.select({ count: sql<number>`count(*)` })
|
||||
.from(invoices)
|
||||
.where(whereClause);
|
||||
|
||||
const rows = await db
|
||||
.select({
|
||||
id: invoices.id,
|
||||
appointmentId: invoices.appointmentId,
|
||||
clientId: invoices.clientId,
|
||||
clientName: clients.name,
|
||||
subtotalCents: invoices.subtotalCents,
|
||||
taxCents: invoices.taxCents,
|
||||
tipCents: invoices.tipCents,
|
||||
totalCents: invoices.totalCents,
|
||||
status: invoices.status,
|
||||
paymentMethod: invoices.paymentMethod,
|
||||
paidAt: invoices.paidAt,
|
||||
notes: invoices.notes,
|
||||
createdAt: invoices.createdAt,
|
||||
updatedAt: invoices.updatedAt,
|
||||
})
|
||||
.from(invoices)
|
||||
.leftJoin(clients, eq(invoices.clientId, clients.id))
|
||||
.where(whereClause)
|
||||
.orderBy(invoices.createdAt)
|
||||
.limit(limit)
|
||||
.offset(offset);
|
||||
|
||||
return c.json({ data: rows, total: totalResult?.count ?? 0 });
|
||||
const listInvoicesQuerySchema = z.object({
|
||||
clientId: z.string().uuid().optional(),
|
||||
appointmentId: z.string().uuid().optional(),
|
||||
status: z.enum(["draft", "pending", "paid", "void"]).optional(),
|
||||
limit: z.coerce.number().int().min(1).max(200).default(50),
|
||||
offset: z.coerce.number().int().min(0).default(0),
|
||||
});
|
||||
|
||||
invoicesRouter.get(
|
||||
"/",
|
||||
zValidator("query", listInvoicesQuerySchema),
|
||||
async (c) => {
|
||||
const db = getDb();
|
||||
const { clientId, appointmentId, status, limit, offset } = c.req.valid("query");
|
||||
|
||||
const conditions = [];
|
||||
if (clientId) conditions.push(eq(invoices.clientId, clientId));
|
||||
if (appointmentId) conditions.push(eq(invoices.appointmentId, appointmentId));
|
||||
if (status) conditions.push(eq(invoices.status, status as "draft" | "pending" | "paid" | "void"));
|
||||
|
||||
const whereClause = conditions.length > 0 ? and(...conditions) : undefined;
|
||||
|
||||
const [totalResult] = await db
|
||||
.select({ count: sql<number>`count(*)` })
|
||||
.from(invoices)
|
||||
.where(whereClause);
|
||||
|
||||
const rows = await db
|
||||
.select({
|
||||
id: invoices.id,
|
||||
appointmentId: invoices.appointmentId,
|
||||
clientId: invoices.clientId,
|
||||
clientName: clients.name,
|
||||
subtotalCents: invoices.subtotalCents,
|
||||
taxCents: invoices.taxCents,
|
||||
tipCents: invoices.tipCents,
|
||||
totalCents: invoices.totalCents,
|
||||
status: invoices.status,
|
||||
paymentMethod: invoices.paymentMethod,
|
||||
paidAt: invoices.paidAt,
|
||||
notes: invoices.notes,
|
||||
createdAt: invoices.createdAt,
|
||||
updatedAt: invoices.updatedAt,
|
||||
})
|
||||
.from(invoices)
|
||||
.leftJoin(clients, eq(invoices.clientId, clients.id))
|
||||
.where(whereClause)
|
||||
.orderBy(invoices.createdAt)
|
||||
.limit(limit)
|
||||
.offset(offset);
|
||||
|
||||
return c.json({ data: rows, total: totalResult?.count ?? 0 });
|
||||
}
|
||||
);
|
||||
|
||||
// Get single invoice with line items and tip splits
|
||||
invoicesRouter.get("/:id", async (c) => {
|
||||
const db = getDb();
|
||||
@@ -378,106 +385,3 @@ invoicesRouter.post(
|
||||
return c.json({ refundId: result.refundId });
|
||||
}
|
||||
);
|
||||
|
||||
// ─── Stripe Payment Info ───────────────────────────────────────────────────────
|
||||
|
||||
import { getStripeClient } from "../services/payment.js";
|
||||
|
||||
invoicesRouter.get("/:id/stripe-payment", async (c) => {
|
||||
const db = getDb();
|
||||
const id = c.req.param("id");
|
||||
|
||||
const [invoice] = await db.select().from(invoices).where(eq(invoices.id, id));
|
||||
if (!invoice) return c.json({ error: "Not found" }, 404);
|
||||
|
||||
if (!invoice.stripePaymentIntentId) {
|
||||
return c.json({ error: "No Stripe payment found for this invoice" }, 404);
|
||||
}
|
||||
|
||||
const stripe = getStripeClient();
|
||||
if (!stripe) return c.json({ error: "Stripe not configured" }, 503);
|
||||
|
||||
try {
|
||||
const paymentIntent = await stripe.paymentIntents.retrieve(invoice.stripePaymentIntentId);
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
const cardDetails = (paymentIntent as any).payment_details?.card;
|
||||
const refundStatus = invoice.stripeRefundId
|
||||
? await stripe.refunds.retrieve(invoice.stripeRefundId).then((r) => r.status).catch(() => null)
|
||||
: null;
|
||||
|
||||
return c.json({
|
||||
paymentIntentId: invoice.stripePaymentIntentId,
|
||||
amountPaidCents: paymentIntent.amount_received,
|
||||
status: paymentIntent.status,
|
||||
cardLast4: cardDetails?.last4 ?? null,
|
||||
cardBrand: cardDetails?.brand ?? null,
|
||||
refundId: invoice.stripeRefundId,
|
||||
refundStatus,
|
||||
});
|
||||
} catch {
|
||||
return c.json({ error: "Failed to retrieve Stripe payment info" }, 500);
|
||||
}
|
||||
});
|
||||
|
||||
// ─── Payment Stats ─────────────────────────────────────────────────────────────
|
||||
|
||||
invoicesRouter.get("/stats", async (c) => {
|
||||
const db = getDb();
|
||||
const now = new Date();
|
||||
const startOfMonth = new Date(now.getFullYear(), now.getMonth(), 1);
|
||||
|
||||
const thisMonthInvoices = await db
|
||||
.select()
|
||||
.from(invoices)
|
||||
.where(
|
||||
and(
|
||||
gte(invoices.createdAt, startOfMonth),
|
||||
eq(invoices.status, "paid")
|
||||
)
|
||||
);
|
||||
|
||||
const revenueCents = thisMonthInvoices.reduce((sum, inv) => sum + inv.totalCents, 0);
|
||||
|
||||
const pendingInvoices = await db
|
||||
.select({ totalCents: invoices.totalCents })
|
||||
.from(invoices)
|
||||
.where(eq(invoices.status, "pending"));
|
||||
|
||||
const outstandingCents = pendingInvoices.reduce((sum, inv) => sum + inv.totalCents, 0);
|
||||
|
||||
const refundedInvoices = await db
|
||||
.select()
|
||||
.from(invoices)
|
||||
.where(
|
||||
and(
|
||||
gte(invoices.createdAt, startOfMonth),
|
||||
sql`${invoices.stripeRefundId} IS NOT NULL`
|
||||
)
|
||||
);
|
||||
|
||||
const refundsCents = refundedInvoices.reduce((sum, inv) => sum + inv.totalCents, 0);
|
||||
|
||||
const paymentMethodBreakdown = await db
|
||||
.select({
|
||||
paymentMethod: invoices.paymentMethod,
|
||||
count: sql<number>`count(*)`,
|
||||
totalCents: sql<number>`sum(${invoices.totalCents})`,
|
||||
})
|
||||
.from(invoices)
|
||||
.where(
|
||||
and(
|
||||
gte(invoices.createdAt, startOfMonth),
|
||||
sql`${invoices.paymentMethod} IS NOT NULL`
|
||||
)
|
||||
)
|
||||
.groupBy(invoices.paymentMethod);
|
||||
|
||||
return c.json({
|
||||
revenueCents,
|
||||
outstandingCents,
|
||||
refundsCents,
|
||||
revenueCount: thisMonthInvoices.length,
|
||||
refundCount: refundedInvoices.length,
|
||||
paymentMethodBreakdown,
|
||||
});
|
||||
});
|
||||
|
||||
@@ -9,7 +9,7 @@ const createServiceSchema = z.object({
|
||||
name: z.string().min(1).max(200),
|
||||
description: z.string().max(2000).optional(),
|
||||
basePriceCents: z.number().int().positive(),
|
||||
durationMinutes: z.number().int().positive(),
|
||||
durationMinutes: z.number().int().positive().max(480),
|
||||
active: z.boolean().default(true),
|
||||
});
|
||||
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { Hono } from "hono";
|
||||
import Stripe from "stripe";
|
||||
import { z } from "zod/v3";
|
||||
import { eq, getDb, invoices } from "@groombook/db";
|
||||
import { getStripeClient } from "../services/payment.js";
|
||||
|
||||
@@ -44,10 +45,13 @@ webhooksRouter.post("/stripe", async (c) => {
|
||||
const invoiceIds = pi.metadata.groombook_invoice_ids.split(",");
|
||||
for (const invoiceId of invoiceIds) {
|
||||
if (!invoiceId) continue;
|
||||
const parsed = z.string().uuid().safeParse(invoiceId.trim());
|
||||
if (!parsed.success) continue;
|
||||
const invoiceIdTrimmed = invoiceId.trim();
|
||||
const [inv] = await db
|
||||
.select()
|
||||
.from(invoices)
|
||||
.where(eq(invoices.id, invoiceId))
|
||||
.where(eq(invoices.id, invoiceIdTrimmed))
|
||||
.limit(1);
|
||||
if (!inv) continue;
|
||||
if (inv.stripePaymentIntentId && inv.stripePaymentIntentId !== pi.id) continue;
|
||||
@@ -60,7 +64,7 @@ webhooksRouter.post("/stripe", async (c) => {
|
||||
stripePaymentIntentId: pi.id,
|
||||
updatedAt: new Date(),
|
||||
})
|
||||
.where(eq(invoices.id, invoiceId));
|
||||
.where(eq(invoices.id, invoiceIdTrimmed));
|
||||
}
|
||||
}
|
||||
} else if (event.type === "payment_intent.payment_failed") {
|
||||
@@ -69,13 +73,16 @@ webhooksRouter.post("/stripe", async (c) => {
|
||||
const invoiceIds = pi.metadata.groombook_invoice_ids.split(",");
|
||||
for (const invoiceId of invoiceIds) {
|
||||
if (!invoiceId) continue;
|
||||
const parsed = z.string().uuid().safeParse(invoiceId.trim());
|
||||
if (!parsed.success) continue;
|
||||
const invoiceIdTrimmed = invoiceId.trim();
|
||||
await db
|
||||
.update(invoices)
|
||||
.set({
|
||||
paymentFailureReason: pi.last_payment_error?.message ?? "Payment failed",
|
||||
updatedAt: new Date(),
|
||||
})
|
||||
.where(eq(invoices.id, invoiceId));
|
||||
.where(eq(invoices.id, invoiceIdTrimmed));
|
||||
}
|
||||
}
|
||||
} else if (event.type === "charge.refunded") {
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import type { Invoice, Client, Appointment, Service, Staff, InvoiceTipSplit, StripePaymentInfo, PaymentStats } from "@groombook/types";
|
||||
import type { Invoice, Client, Appointment, Service, Staff, InvoiceTipSplit } from "@groombook/types";
|
||||
|
||||
// ─── Types ────────────────────────────────────────────────────────────────────
|
||||
|
||||
@@ -173,23 +173,6 @@ function InvoiceDetailModal({
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const [tipStr, setTipStr] = useState((invoice.tipCents / 100).toFixed(2));
|
||||
const [paymentMethod, setPaymentMethod] = useState<string>(invoice.paymentMethod ?? "cash");
|
||||
const [stripeInfo, setStripeInfo] = useState<StripePaymentInfo | null>(null);
|
||||
const [stripeLoading, setStripeLoading] = useState(false);
|
||||
const [showRefundDialog, setShowRefundDialog] = useState(false);
|
||||
const [refundType, setRefundType] = useState<"full" | "partial">("full");
|
||||
const [refundAmountStr, setRefundAmountStr] = useState("");
|
||||
const [refunding, setRefunding] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (invoice.status === "paid" && invoice.stripePaymentIntentId) {
|
||||
setStripeLoading(true);
|
||||
fetch(`/api/invoices/${invoice.id}/stripe-payment`)
|
||||
.then((r) => r.json())
|
||||
.then((data: StripePaymentInfo) => setStripeInfo(data))
|
||||
.catch(() => { /* non-blocking */ })
|
||||
.finally(() => setStripeLoading(false));
|
||||
}
|
||||
}, [invoice.id, invoice.status, invoice.stripePaymentIntentId]);
|
||||
|
||||
// Tip split state: array of {staffId, staffName, pct}
|
||||
const linkedAppt = invoice.appointmentId
|
||||
@@ -288,31 +271,6 @@ function InvoiceDetailModal({
|
||||
}
|
||||
}
|
||||
|
||||
async function submitRefund() {
|
||||
setRefunding(true);
|
||||
setError(null);
|
||||
const amountCents = refundType === "partial"
|
||||
? Math.round(parseFloat(refundAmountStr) * 100)
|
||||
: undefined;
|
||||
try {
|
||||
const res = await fetch(`/api/invoices/${invoice.id}/refund`, {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ amountCents }),
|
||||
});
|
||||
if (!res.ok) {
|
||||
const err = (await res.json()) as { error?: string };
|
||||
throw new Error(err.error ?? `HTTP ${res.status}`);
|
||||
}
|
||||
setShowRefundDialog(false);
|
||||
onUpdated();
|
||||
} catch (e: unknown) {
|
||||
setError(e instanceof Error ? e.message : "Refund failed");
|
||||
} finally {
|
||||
setRefunding(false);
|
||||
}
|
||||
}
|
||||
|
||||
if (loading) return <Modal onClose={onClose}><p style={{ padding: "1rem" }}>Loading…</p></Modal>;
|
||||
|
||||
const tipCentsCalc = Math.round(parseFloat(tipStr) * 100) || 0;
|
||||
@@ -372,18 +330,6 @@ function InvoiceDetailModal({
|
||||
/>
|
||||
{invoice.paidAt && <SummaryRow label="Paid on" value={fmtDate(invoice.paidAt)} />}
|
||||
{invoice.paymentMethod && <SummaryRow label="Payment" value={invoice.paymentMethod} />}
|
||||
{stripeLoading && <SummaryRow label="Stripe" value="Loading…" />}
|
||||
{stripeInfo && (
|
||||
<>
|
||||
{stripeInfo.cardLast4 && (
|
||||
<SummaryRow label="Card" value={`${stripeInfo.cardBrand ?? "Card"} •••• ${stripeInfo.cardLast4}`} />
|
||||
)}
|
||||
<SummaryRow label="Stripe status" value={stripeInfo.status} />
|
||||
{invoice.stripeRefundId && stripeInfo.refundStatus && (
|
||||
<SummaryRow label="Refund status" value={stripeInfo.refundStatus === "succeeded" ? "Refunded" : stripeInfo.refundStatus} />
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* ── Tip Distribution ── */}
|
||||
@@ -501,101 +447,10 @@ function InvoiceDetailModal({
|
||||
</div>
|
||||
)}
|
||||
{(invoice.status === "paid" || invoice.status === "void") && (
|
||||
<div style={{ marginTop: "1rem", display: "flex", justifyContent: "flex-end", gap: "0.5rem" }}>
|
||||
{invoice.status === "paid" && invoice.stripePaymentIntentId && !invoice.stripeRefundId && (
|
||||
<button
|
||||
onClick={() => {
|
||||
setRefundType("full");
|
||||
setRefundAmountStr("");
|
||||
setShowRefundDialog(true);
|
||||
}}
|
||||
style={{ ...btnStyle, color: "#dc2626", borderColor: "#dc2626" }}
|
||||
>
|
||||
Refund
|
||||
</button>
|
||||
)}
|
||||
<div style={{ marginTop: "1rem", display: "flex", justifyContent: "flex-end" }}>
|
||||
<button onClick={onClose} style={btnStyle}>Close</button>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{showRefundDialog && (
|
||||
<div style={{
|
||||
position: "fixed", inset: 0, background: "rgba(0,0,0,0.45)",
|
||||
display: "flex", alignItems: "center", justifyContent: "center", zIndex: 110,
|
||||
}}
|
||||
onClick={(e) => { if (e.target === e.currentTarget) setShowRefundDialog(false); }}
|
||||
>
|
||||
<div style={{
|
||||
background: "#fff", borderRadius: 8, padding: "1.5rem",
|
||||
maxWidth: 400, width: "calc(100% - 2rem)",
|
||||
boxShadow: "0 20px 60px rgba(0,0,0,0.3)",
|
||||
}}>
|
||||
<h3 style={{ margin: "0 0 1rem" }}>Process Refund</h3>
|
||||
<p style={{ fontSize: 14, color: "#6b7280", marginBottom: "1rem" }}>
|
||||
Invoice total: {fmtMoney(invoice.totalCents)}
|
||||
</p>
|
||||
<div style={{ marginBottom: "1rem" }}>
|
||||
<label style={{ display: "block", fontWeight: 600, marginBottom: "0.25rem", fontSize: 13 }}>
|
||||
Refund type
|
||||
</label>
|
||||
<div style={{ display: "flex", gap: "0.5rem" }}>
|
||||
<button
|
||||
onClick={() => setRefundType("full")}
|
||||
style={{
|
||||
...btnStyle,
|
||||
backgroundColor: refundType === "full" ? "var(--color-primary)" : "#fff",
|
||||
color: refundType === "full" ? "#fff" : "#374151",
|
||||
borderColor: refundType === "full" ? "var(--color-primary)" : "#d1d5db",
|
||||
}}
|
||||
>
|
||||
Full refund
|
||||
</button>
|
||||
<button
|
||||
onClick={() => { setRefundType("partial"); setRefundAmountStr((invoice.totalCents / 100).toFixed(2)); }}
|
||||
style={{
|
||||
...btnStyle,
|
||||
backgroundColor: refundType === "partial" ? "var(--color-primary)" : "#fff",
|
||||
color: refundType === "partial" ? "#fff" : "#374151",
|
||||
borderColor: refundType === "partial" ? "var(--color-primary)" : "#d1d5db",
|
||||
}}
|
||||
>
|
||||
Partial refund
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{refundType === "partial" && (
|
||||
<div style={{ marginBottom: "1rem" }}>
|
||||
<label style={{ display: "block", fontWeight: 600, marginBottom: "0.25rem", fontSize: 13 }}>
|
||||
Refund amount
|
||||
</label>
|
||||
<div style={{ display: "flex", alignItems: "center", gap: "0.5rem" }}>
|
||||
<span style={{ color: "#6b7280" }}>$</span>
|
||||
<input
|
||||
type="number"
|
||||
min="0.01"
|
||||
max={(invoice.totalCents / 100).toFixed(2)}
|
||||
step="0.01"
|
||||
value={refundAmountStr}
|
||||
onChange={(e) => setRefundAmountStr(e.target.value)}
|
||||
style={{ ...inputStyle, width: 100 }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{error && <p style={{ color: "red", margin: "0.5rem 0" }}>{error}</p>}
|
||||
<div style={{ display: "flex", gap: "0.5rem", justifyContent: "flex-end" }}>
|
||||
<button onClick={() => setShowRefundDialog(false)} style={btnStyle}>Cancel</button>
|
||||
<button
|
||||
onClick={submitRefund}
|
||||
disabled={refunding || (refundType === "partial" && (!refundAmountStr || parseFloat(refundAmountStr) <= 0))}
|
||||
style={{ ...btnStyle, backgroundColor: "#dc2626", color: "#fff", borderColor: "#dc2626" }}
|
||||
>
|
||||
{refunding ? "Refunding…" : "Refund"}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</Modal>
|
||||
);
|
||||
}
|
||||
@@ -637,8 +492,6 @@ export function InvoicesPage() {
|
||||
const [createLoading, setCreateLoading] = useState(false);
|
||||
const [detailData, setDetailData] = useState<{ staff: Staff[]; appointments: Appointment[] } | null>(null);
|
||||
const [detailLoading, setDetailLoading] = useState(false);
|
||||
const [stats, setStats] = useState<PaymentStats | null>(null);
|
||||
const [statsLoading, setStatsLoading] = useState(true);
|
||||
|
||||
const LIMIT = 50;
|
||||
|
||||
@@ -660,15 +513,6 @@ export function InvoicesPage() {
|
||||
.finally(() => setLoading(false));
|
||||
}, [statusFilter]);
|
||||
|
||||
useEffect(() => {
|
||||
setStatsLoading(true);
|
||||
fetch("/api/invoices/stats")
|
||||
.then((r) => r.json())
|
||||
.then((data: PaymentStats) => setStats(data))
|
||||
.catch(() => { /* non-blocking */ })
|
||||
.finally(() => setStatsLoading(false));
|
||||
}, []);
|
||||
|
||||
function loadCreateData() {
|
||||
if (createData) return Promise.resolve();
|
||||
setCreateLoading(true);
|
||||
@@ -729,36 +573,6 @@ export function InvoicesPage() {
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{!statsLoading && stats && (
|
||||
<div style={{ display: "grid", gridTemplateColumns: "repeat(auto-fit, minmax(160px, 1fr))", gap: "0.75rem", marginBottom: "1rem" }}>
|
||||
<div style={{ background: "#fff", borderRadius: 8, border: "1px solid #e5e7eb", padding: "0.875rem 1rem" }}>
|
||||
<div style={{ fontSize: 12, color: "#6b7280", fontWeight: 500, marginBottom: "0.25rem" }}>Revenue this month</div>
|
||||
<div style={{ fontSize: 20, fontWeight: 700, color: "#065f46" }}>{fmtMoney(stats.revenueCents)}</div>
|
||||
<div style={{ fontSize: 12, color: "#9ca3af" }}>{stats.revenueCount} paid</div>
|
||||
</div>
|
||||
<div style={{ background: "#fff", borderRadius: 8, border: "1px solid #e5e7eb", padding: "0.875rem 1rem" }}>
|
||||
<div style={{ fontSize: 12, color: "#6b7280", fontWeight: 500, marginBottom: "0.25rem" }}>Outstanding</div>
|
||||
<div style={{ fontSize: 20, fontWeight: 700, color: "#92400e" }}>{fmtMoney(stats.outstandingCents)}</div>
|
||||
</div>
|
||||
<div style={{ background: "#fff", borderRadius: 8, border: "1px solid #e5e7eb", padding: "0.875rem 1rem" }}>
|
||||
<div style={{ fontSize: 12, color: "#6b7280", fontWeight: 500, marginBottom: "0.25rem" }}>Refunds this month</div>
|
||||
<div style={{ fontSize: 20, fontWeight: 700, color: "#991b1b" }}>{fmtMoney(stats.refundsCents)}</div>
|
||||
<div style={{ fontSize: 12, color: "#9ca3af" }}>{stats.refundCount} refunds</div>
|
||||
</div>
|
||||
{stats.paymentMethodBreakdown.length > 0 && (
|
||||
<div style={{ background: "#fff", borderRadius: 8, border: "1px solid #e5e7eb", padding: "0.875rem 1rem" }}>
|
||||
<div style={{ fontSize: 12, color: "#6b7280", fontWeight: 500, marginBottom: "0.25rem" }}>By payment method</div>
|
||||
{stats.paymentMethodBreakdown.map((b) => (
|
||||
<div key={b.paymentMethod} style={{ fontSize: 13, display: "flex", justifyContent: "space-between", marginTop: "0.2rem" }}>
|
||||
<span style={{ textTransform: "capitalize" }}>{b.paymentMethod}</span>
|
||||
<span style={{ fontWeight: 600 }}>{fmtMoney(b.totalCents)}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{invoiceList.length === 0 ? (
|
||||
<p style={{ color: "#6b7280" }}>
|
||||
No invoices yet. Create one from a completed appointment.
|
||||
|
||||
@@ -153,38 +153,10 @@ export interface Invoice {
|
||||
notes: string | null;
|
||||
createdAt: string;
|
||||
updatedAt: string;
|
||||
stripePaymentIntentId?: string | null;
|
||||
stripeRefundId?: string | null;
|
||||
paymentFailureReason?: string | null;
|
||||
lineItems?: InvoiceLineItem[];
|
||||
tipSplits?: InvoiceTipSplit[];
|
||||
}
|
||||
|
||||
export interface StripePaymentInfo {
|
||||
paymentIntentId: string;
|
||||
amountPaidCents: number;
|
||||
status: string;
|
||||
cardLast4: string | null;
|
||||
cardBrand: string | null;
|
||||
refundId: string | null;
|
||||
refundStatus: string | null;
|
||||
}
|
||||
|
||||
export interface PaymentMethodBreakdown {
|
||||
paymentMethod: PaymentMethod;
|
||||
count: number;
|
||||
totalCents: number;
|
||||
}
|
||||
|
||||
export interface PaymentStats {
|
||||
revenueCents: number;
|
||||
outstandingCents: number;
|
||||
refundsCents: number;
|
||||
revenueCount: number;
|
||||
refundCount: number;
|
||||
paymentMethodBreakdown: PaymentMethodBreakdown[];
|
||||
}
|
||||
|
||||
// ─── Impersonation ──────────────────────────────────────────────────────────
|
||||
|
||||
export type ImpersonationSessionStatus = "active" | "ended" | "expired";
|
||||
|
||||
Reference in New Issue
Block a user