Add total row in report tables

[K-Markopoulos]

Issue #178

Add total row at the top of the table with the sum of the values.

• Calculate the aggregated values and ad extra row to the data
• Adjust sorting in order to always stay on top

[github-actions]

Build succeeded and deployed at https://wfp-dmp-179.surge.sh
(hash 880279d deployed at 2024-10-22T13:46:22)

[ericboucher]

Can you explicit why this change is needed?

[K-Markopoulos]

The return value of valueGetter is used for sorting and it's being passed in the valueFormatter or renderCell. With this change:

1. We can use params.value in the renderCell without the need to duplicate the logic to construct the value.
2. The sorting is based on the displayed value (the actual name of the location) and not on the code ("01-002") and behaves as expected (unless we need a custom order based on the code and not alphanumerical order).

From docs:

Note, that the value returned by valueFormatter is only used for rendering purposes. Filtering and sorting are based on the raw value (row[field]) or the value returned by valueGetter.

[K-Markopoulos]

We can use the same approach here to calculate formattedList once in the valueGetter

dmp/apps/frontend/utils/tableFormatting.tsx

Lines 121 to 139 in 74ec186

	valueFormatter: value => {
	const villageList = value as string[] | undefined;
	const formattedList = villageList
	?.map(village =>
	intl.formatMessage({ id: `${field}.${village}` }),
	)
	.sort((a, b) => a.localeCompare(b, intl.locale)) // Sort alphabetically
	.join(', ');
	return formattedList;
	},
	renderCell: (params: GridRenderCellParams) => {
	const villageList = params.value as string[] | undefined;
	const formattedList = villageList
	?.map(village =>
	intl.formatMessage({ id: `${field}.${village}` }),
	)
	.sort((a, b) => a.localeCompare(b, intl.locale)) // Sort alphabetically
	.join(', ');

I skipped this as I thought it was out of scope and required more testing, but we can make that change since we are working on this area

[ericboucher]

Ok, worth exploring. Two things come to mind though:

1. Ideally, for sorting, we might actually want to order by number of villages instead of the alphabetical order of the first village (which doesn't really mean anything). Noting that sorting doesn't really work for the village column at the moment, esp. in "Commune" reports.

2. We still need to display the tooltip

[ericboucher]

@K-Markopoulos let's use the translation files so that we can get a translated version in Khmer: សរុប

[wadhwamatic]

Thanks for this @K-Markopoulos and @ericboucher. Is there a reason there's a discrepancy in the total when you're showing Province vs Commune level views? I expected the values to be the same in the total row, but they are not.

Province level:

Commune level:

[K-Markopoulos]

@wadhwamatic thanks for the catch! Indeed in commune level some rows are already aggregated and our logic would not take that into account. Hopefully the last commit will address this issue, the total numbers are now the same between these views.

[wadhwamatic]

Looks good now, thanks @K-Markopoulos and @ericboucher!