import { getServerApi } from '@garage/api/server'
import { BillGeneralInfo } from '@/modules/bills/bill-general-info'
import { BillPartsSection } from '@/modules/bills/bill-parts-section'
import { BillServicesSection } from '@/modules/bills/bill-services-section'
import { BillExpensesSection } from '@/modules/bills/bill-expenses-section'
import { BillTotalsSummary } from '@/modules/bills/bill-totals-summary'
import { BillPaymentsSection } from '@/modules/bills/bill-payments-section'
import DashboardPage from '@/base/components/layout/dashboard/dashboard-page'

export default async function BillDetailPage(props: { params: Promise<{ id: string }> }) {
    const { id } = await props.params
    const api = await getServerApi()
    const bill = await api.bills.show(id)
    const data = (bill as any)?.data ?? bill

    if (!data) {
        return <div className="text-muted-foreground">Bill not found.</div>
    }

    return (
        <DashboardPage header={null}>
            <div className="grid gap-6">
                <BillGeneralInfo />
                <BillPartsSection parts={data.parts} />
                <BillServicesSection services={data.services} />
                <BillExpensesSection expenses={data.expenses} />
                <BillPaymentsSection />
                <BillTotalsSummary />
            </div>
        </DashboardPage>
    )
}