diff --git a/pages/api/graphql-rest.page.ts b/pages/api/graphql-rest.page.ts index 0355ef89b..192c15a2d 100644 --- a/pages/api/graphql-rest.page.ts +++ b/pages/api/graphql-rest.page.ts @@ -5,7 +5,7 @@ import { Response, } from 'apollo-datasource-rest'; import { ApolloServer } from 'apollo-server-micro'; -import { DateTime, Duration, Interval } from 'luxon'; +import { DateTime } from 'luxon'; import Cors from 'micro-cors'; import { ExportFormatEnum, @@ -443,12 +443,9 @@ class MpdxRestApi extends RESTDataSource { currencyType === 'salary' ? 'salary_currency_donations' : 'donor_currency_donations' - }?filter[account_list_id]=${accountListId}${designationAccountFilter}&filter[month_range]=${Interval.before( - DateTime.now().endOf('month'), - Duration.fromObject({ months: 14 }).minus({ day: 1 }), - ) - .toISODate() - .replace('/', '...')}`, + }?filter[account_list_id]=${accountListId}${designationAccountFilter}&filter[month_range]=${DateTime.now() + .minus({ months: 13 }) + .toISODate()}...${DateTime.now().toISODate()}`, ); return mapFourteenMonthReport(data, currencyType); } diff --git a/src/components/Reports/FourteenMonthReports/Layout/Table/Table.test.tsx b/src/components/Reports/FourteenMonthReports/Layout/Table/Table.test.tsx index 0b72c18ed..ee655da4e 100644 --- a/src/components/Reports/FourteenMonthReports/Layout/Table/Table.test.tsx +++ b/src/components/Reports/FourteenMonthReports/Layout/Table/Table.test.tsx @@ -379,8 +379,8 @@ describe('FourteenMonthReportTable', () => { expect(contactTotal[0].innerHTML).toEqual('0'); }); - it('should calulate the correct monthly totals', async () => { - const { queryByTestId, getAllByTestId } = render( + it('should calculate the correct monthly totals', async () => { + const { queryByTestId, getByTestId, getAllByTestId } = render( { expect(contactTotal[3].innerHTML).toEqual('1,836'); expect(getAllByTestId('overallTotal')[0].innerHTML).toEqual('6,996'); + + expect(getByTestId('averageTotal')).toHaveTextContent('516'); + expect(getByTestId('minimumTotal')).toHaveTextContent('510'); }); }); diff --git a/src/components/Reports/FourteenMonthReports/Layout/Table/Table.tsx b/src/components/Reports/FourteenMonthReports/Layout/Table/Table.tsx index 6580066b2..2903fea27 100644 --- a/src/components/Reports/FourteenMonthReports/Layout/Table/Table.tsx +++ b/src/components/Reports/FourteenMonthReports/Layout/Table/Table.tsx @@ -68,6 +68,12 @@ const StyledInfoIcon = styled(InfoIcon)(({}) => ({ }, })); +const StyledTotalsRow = styled(TableRow)({ + '.MuiTableCell-root': { + fontWeight: 'bold', + }, +}); + export const FourteenMonthReportTable: React.FC< FourteenMonthReportTableProps > = ({ @@ -84,6 +90,27 @@ export const FourteenMonthReportTable: React.FC< const locale = useLocale(); const apiConstants = useApiConstants(); + const totalAverage = useMemo( + () => + Math.round( + orderedContacts?.reduce( + (totalAverage, contact) => totalAverage + contact.average, + 0, + ) ?? 0, + ), + [orderedContacts], + ); + const totalMinimum = useMemo( + () => + Math.round( + orderedContacts?.reduce( + (totalMinimum, contact) => totalMinimum + contact.minimum, + 0, + ) ?? 0, + ), + [orderedContacts], + ); + return ( {isExpanded && ( - + <> {contact.status} {contact.pledgeAmount && @@ -157,7 +184,7 @@ export const FourteenMonthReportTable: React.FC< {numberFormat(Math.round(contact.minimum), locale)} - + )} {contact.months?.map((month: Month) => ( @@ -176,28 +203,38 @@ export const FourteenMonthReportTable: React.FC< ); })} - - - {t('Totals')} - + + {t('Totals')} + {isExpanded && ( + <> + + + + {numberFormat(totalAverage, locale)} + + + {numberFormat(totalMinimum, locale)} + + + )} {totals?.map((month) => ( - - - {numberFormat(Math.round(month.total), locale)} - + + {numberFormat(Math.round(month.total), locale)} ))} - - - {numberFormat( - Math.round( - totals?.reduce((sum, month) => sum + month.total, 0) ?? 0, - ), - locale, - )} - + + {numberFormat( + Math.round( + totals?.reduce((sum, month) => sum + month.total, 0) ?? 0, + ), + locale, + )} - + diff --git a/src/components/Reports/FourteenMonthReports/Layout/Table/TableHead/TableHead.tsx b/src/components/Reports/FourteenMonthReports/Layout/Table/TableHead/TableHead.tsx index cd5312492..0f60af9e0 100644 --- a/src/components/Reports/FourteenMonthReports/Layout/Table/TableHead/TableHead.tsx +++ b/src/components/Reports/FourteenMonthReports/Layout/Table/TableHead/TableHead.tsx @@ -4,7 +4,6 @@ import { styled } from '@mui/material/styles'; import { DateTime } from 'luxon'; import { useTranslation } from 'react-i18next'; import { useLocale } from 'src/hooks/useLocale'; -// eslint-disable-next-line import/extensions import { Totals } from '../../../FourteenMonthReport'; import { FourteenMonthReportQuery } from '../../../GetFourteenMonthReport.generated'; import { StyledTableCell } from '../StyledComponents'; @@ -76,6 +75,14 @@ export const FourteenMonthReportTableHead: FC< {salaryCurrency} + {isExpanded && ( + <> + + + + + + )} {monthCount && monthCount.map((year) => ( {isExpanded && ( - + <> {t('Min')} - + )} - {totals?.map((month, i: number) => ( + {totals?.map((month, index) => ( {DateTime.fromISO(month.month) .toJSDate()