91 lines
3.4 KiB
TypeScript
91 lines
3.4 KiB
TypeScript
import { redirect } from "next/navigation";
|
|
import { getTranslations } from "next-intl/server";
|
|
import { getSessionUser } from "@/lib/session";
|
|
import {
|
|
listCreditNotesForOrg,
|
|
listInvoices,
|
|
syncOverdueInvoices,
|
|
} from "@/lib/db";
|
|
import { CustomerInvoiceList } from "@/components/billing/customer-invoice-list";
|
|
import { CustomerCreditNoteList } from "@/components/billing/customer-credit-note-list";
|
|
import { RunningTotalWidget } from "@/components/billing/running-total-widget";
|
|
|
|
/**
|
|
* /billing — customer's billing home.
|
|
*
|
|
* Shows three things:
|
|
* 1. RunningTotalWidget — current calendar month's accruing cost
|
|
* (or the already-issued invoice for the current month, if
|
|
* that ran early).
|
|
* 2. CustomerInvoiceList — every issued invoice for this org,
|
|
* newest first. Status is reflected with a colored badge.
|
|
* 3. CustomerCreditNoteList — Phase 7. Credit notes (voids and
|
|
* refunds) for this org, with PDF download links. Hidden
|
|
* entirely when there are none (the common case).
|
|
*
|
|
* Anyone signed in can view this. The data is org-scoped; even
|
|
* non-owner team members see the same view.
|
|
*/
|
|
export async function generateMetadata() {
|
|
const t = await getTranslations("common");
|
|
return { title: t("billing") };
|
|
}
|
|
|
|
export default async function CustomerBillingPage() {
|
|
const user = await getSessionUser();
|
|
if (!user) redirect("/login");
|
|
const t = await getTranslations("customerBilling");
|
|
|
|
// Sync overdue status before listing — cheap, idempotent.
|
|
try {
|
|
await syncOverdueInvoices();
|
|
} catch (e) {
|
|
console.warn("syncOverdueInvoices failed in /billing:", e);
|
|
}
|
|
|
|
// Parallel fetch — invoices + credit notes are independent.
|
|
const [invoices, creditNotes] = await Promise.all([
|
|
listInvoices({ zitadelOrgId: user.orgId, limit: 200 }),
|
|
listCreditNotesForOrg(user.orgId, 200),
|
|
]);
|
|
|
|
return (
|
|
<main className="max-w-5xl mx-auto px-6 py-8">
|
|
<div className="mb-8 animate-in">
|
|
<h1 className="font-display text-2xl font-semibold accent-rule">
|
|
{t("title")}
|
|
</h1>
|
|
<p className="text-sm text-text-secondary mt-3">{t("subtitle")}</p>
|
|
</div>
|
|
|
|
<section className="mb-8 animate-in animate-in-delay-1">
|
|
<h2 className="text-xs font-semibold uppercase tracking-wider text-text-muted mb-3">
|
|
{t("currentPeriodHeading")}
|
|
</h2>
|
|
{/* Phase 6: pass the owner flag so the no-config CTA shows
|
|
the right call-to-action vs the right hint. */}
|
|
<RunningTotalWidget isOwner={user.roles.includes("owner")} />
|
|
</section>
|
|
|
|
<section className="animate-in animate-in-delay-2 mb-8">
|
|
<h2 className="text-xs font-semibold uppercase tracking-wider text-text-muted mb-3">
|
|
{t("historyHeading")}
|
|
</h2>
|
|
<CustomerInvoiceList invoices={invoices} />
|
|
</section>
|
|
|
|
{/* Phase 7: credit-note section. CustomerCreditNoteList itself
|
|
returns null when there are no credit notes, so this whole
|
|
section disappears for orgs in normal operation. */}
|
|
{creditNotes.length > 0 && (
|
|
<section className="animate-in animate-in-delay-3">
|
|
<h2 className="text-xs font-semibold uppercase tracking-wider text-text-muted mb-3">
|
|
{t("creditNotesHeading")}
|
|
</h2>
|
|
<CustomerCreditNoteList creditNotes={creditNotes} />
|
|
</section>
|
|
)}
|
|
</main>
|
|
);
|
|
}
|