import { h, type FunctionComponent } from 'preact' import cn from 'classnames' import rek from 'rek' import Head from './head.ts' import { formatNumber } from '../utils/format_number.ts' import s from './balances_page.module.scss' import usePromise from '../../shared/hooks/use_promise.ts' import type { Balance, FinancialYear } from '../../../shared/types.ts' const BalancesPage: FunctionComponent = () => { const [balances, years] = usePromise<[Balance[], number[]]>(() => Promise.all([ rek(`/api/balances`), rek(`/api/financial-years`).then((financialYears: FinancialYear[]) => financialYears.map((fy) => fy.year)), ]), ) return (
: Balances

Balances

{years.length && balances.length && ( {years.map((year) => ( ))} {balances.map((balance) => ( {years.map((year) => ( ))} ))}
Account Description{year}
{balance.accountNumber} {balance.description} {formatNumber(balance[year])}
)}
) } export default BalancesPage