import { Head, router } from "@inertiajs/react"; import AppLayout from "@/layouts/app-layout"; import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; import { Button } from "@/components/ui/button"; import { StatChip } from "@/components/crm/global-card"; import { Banknote, Receipt, TrendingUp, Calendar, ArrowUpRight, DollarSign, } from "lucide-react"; type Timeline = { label: string; month: string; invoices: number; revenue: number; }; type Plan = { plan: string; invoices: number; revenue: number }; const money = (v: number) => new Intl.NumberFormat("id-ID", { style: "currency", currency: "IDR", maximumFractionDigits: 0, }).format(v); export default function Revenue({ months, timeline, byPlan, summary, }: { months: number; timeline: Timeline[]; byPlan: Plan[]; summary: { revenue: number; invoices: number; average: number; thisMonth: number; }; }) { return (

{/* Header Section */}

Financial Analytics & Billing

Pendapatan Platform

Analisis komprehensif pendapatan subscription tenant yang telah dibayar[cite: 21].

{/* Range Filter Buttons */}

{[3, 6, 12].map((n) => ( ))}

{/* Metrics Grid using StatChip */}

{/* Data Tables Grid */}

{/* Timeline Table */} Pendapatan Bulanan

{timeline.length === 0 ? ( ) : ( timeline.map((m) => ( )) )}

Periode	Invoice Lunas	Pendapatan
Belum ada data timeline.
{m.label}	{m.invoices.toLocaleString( "id-ID", )}	{money(m.revenue)}

{/* By Plan Table */} Pendapatan berdasarkan Paket

{byPlan.length === 0 ? ( ) : ( byPlan.map((p) => ( )) )}

Paket	Invoice	Pendapatan
Belum ada data paket.
{p.plan}	{p.invoices.toLocaleString( "id-ID", )}	{money(p.revenue)}

); }