fix: extra field rendering

This commit is contained in:
Vasily Zubarev
2025-04-08 22:08:16 +02:00
parent b47dc4b80a
commit f32662e256

View File

@@ -21,6 +21,10 @@ type FieldRenderer = {
footerValue?: (transactions: Transaction[]) => React.ReactNode footerValue?: (transactions: Transaction[]) => React.ReactNode
} }
type FieldWithRenderer = Field & {
renderer: FieldRenderer
}
export const standardFieldRenderers: Record<string, FieldRenderer> = { export const standardFieldRenderers: Record<string, FieldRenderer> = {
name: { name: {
name: "Name", name: "Name",
@@ -151,7 +155,7 @@ export function TransactionList({ transactions, fields = [] }: { transactions: T
}) })
const visibleFields = useMemo( const visibleFields = useMemo(
() => (): FieldWithRenderer[] =>
fields fields
.filter((field) => field.isVisibleInList) .filter((field) => field.isVisibleInList)
.map((field) => ({ .map((field) => ({
@@ -196,6 +200,16 @@ export function TransactionList({ transactions, fields = [] }: { transactions: T
}) })
} }
const renderFieldInTable = (transaction: Transaction, field: FieldWithRenderer) => {
if (field.isExtra) {
return transaction.extra?.[field.code as keyof typeof transaction.extra]
} else if (field.renderer.formatValue) {
return field.renderer.formatValue(transaction)
} else {
return transaction[field.code as keyof Transaction]
}
}
useEffect(() => { useEffect(() => {
const params = new URLSearchParams(searchParams.toString()) const params = new URLSearchParams(searchParams.toString())
if (sorting.field && sorting.direction) { if (sorting.field && sorting.direction) {
@@ -258,7 +272,7 @@ export function TransactionList({ transactions, fields = [] }: { transactions: T
</TableCell> </TableCell>
{visibleFields.map((field) => ( {visibleFields.map((field) => (
<TableCell key={field.code} className={field.renderer.classes}> <TableCell key={field.code} className={field.renderer.classes}>
{field.renderer.formatValue ? field.renderer.formatValue(transaction) : transaction[field.code]} {renderFieldInTable(transaction, field)}
</TableCell> </TableCell>
))} ))}
</TableRow> </TableRow>