import { h, type FunctionComponent } from 'preact' // @ts-ignore import Format from 'easy-tz/format' import { useRoute } from 'preact-iso' import rek from 'rek' import Head from './head.ts' import usePromise from '../../shared/hooks/use_promise.ts' import type { Invoice, Supplier } from '../../../shared/types.ts' const format = Format.bind(null, null, 'YYYY.MM.DD') const InvoicesPage: FunctionComponent = () => { const route = useRoute() const [supplier, invoices, totalAmount] = usePromise<[Supplier, Invoice[], number]>(() => Promise.all([ rek(`/api/suppliers/${route.params.supplier}`), rek(`/api/invoices?supplier=${route.params.supplier}`), rek(`/api/invoices/total-amount?supplier=${route.params.supplier}`), ]), ) return (

: Invoices : {supplier?.name}

Invoices for {supplier?.name}

Total: {totalAmount}

{invoices.map((invoice) => ( ))}

ID	Fisken	PHM	Invoice Date	Due Date	Number	Amount	Files
{invoice.id}	{invoice.fiskenNumber}	{invoice.phmNumber}	{format(invoice.invoiceDate)}	{invoice.dueDate && format(invoice.dueDate)}	{invoice.invoiceNumber}	{invoice.amount}	{invoice.files?.map((file) => ( {file.filename} ))}

) } export default InvoicesPage