diff --git a/src/app/groups/[groupId]/expenses/active-user-balance.tsx b/src/app/groups/[groupId]/expenses/active-user-balance.tsx index e8cc8c27..e844685b 100644 --- a/src/app/groups/[groupId]/expenses/active-user-balance.tsx +++ b/src/app/groups/[groupId]/expenses/active-user-balance.tsx @@ -1,7 +1,8 @@ 'use client' import { Money } from '@/components/money' -import { getBalances } from '@/lib/balances' +import { Reimbursement, getBalances } from '@/lib/balances' import { useActiveUser } from '@/lib/hooks' +import { Participant } from '@prisma/client' import { useTranslations } from 'next-intl' type Props = { @@ -43,3 +44,82 @@ export function ActiveUserBalance({ groupId, currency, expense }: Props) { } return
{fmtBalance}
} + +// Get all the suggested reimbursements for the current user +export function ActiveUserReimbursementList({ + reimbursements, + participants, + currency, + groupId, +}: { + reimbursements: Reimbursement[] + participants: Participant[] + currency: string + groupId: string +}) { + const activeUserId = useActiveUser(groupId) + if (activeUserId === null || activeUserId === '' || activeUserId === 'None') { + return null + } + if (reimbursements.length === 0) { + return null + } + + let total = 0 + for (const reimbursement of reimbursements) { + if ( + reimbursement.from !== activeUserId && + reimbursement.to !== activeUserId + ) { + continue + } + let sign = reimbursement.from === activeUserId ? -1 : 1 + total += sign * reimbursement.amount + } + + if (total === 0) { + return null + } + + const getParticipant = (id: string) => + participants.find((p) => p.id === id) || { name: 'Unknown' } + + const currentUser = <>({getParticipant(activeUserId).name}) + + const userReimbursements = reimbursements + .filter((r) => r.from === activeUserId || r.to === activeUserId) + .map((r) => { + const from = getParticipant(r.from) + const to = getParticipant(r.to) + const amount = r.amount + if (r.from === activeUserId) { + return ( +
+ You owe {to.name}{' '} + +
+ ) + } else { + return ( +
+ {from.name} owes you{' '} + +
+ ) + } + }) + + return ( +
+ Your balance {currentUser}:{' '} + +
{userReimbursements}
+
+ ) +} diff --git a/src/app/groups/[groupId]/expenses/page.tsx b/src/app/groups/[groupId]/expenses/page.tsx index 068d46ff..c89173d4 100644 --- a/src/app/groups/[groupId]/expenses/page.tsx +++ b/src/app/groups/[groupId]/expenses/page.tsx @@ -1,4 +1,5 @@ import { cached } from '@/app/cached-functions' +import { ActiveUserReimbursementList } from '@/app/groups/[groupId]/expenses/active-user-balance' import { ActiveUserModal } from '@/app/groups/[groupId]/expenses/active-user-modal' import { CreateFromReceiptButton } from '@/app/groups/[groupId]/expenses/create-from-receipt-button' import { ExpenseList } from '@/app/groups/[groupId]/expenses/expense-list' @@ -16,6 +17,7 @@ import { getGroupExpenseCount, getGroupExpenses, } from '@/lib/api' +import { getBalances, getSuggestedReimbursements } from '@/lib/balances' import { env } from '@/lib/env' import { Download, Plus } from 'lucide-react' import { Metadata } from 'next' @@ -41,6 +43,10 @@ export default async function GroupExpensesPage({ const categories = await getCategories() + const expenses = await getGroupExpenses(group.id) + const balances = getBalances(expenses) + const reimbursements = getSuggestedReimbursements(balances) + return ( <> @@ -48,6 +54,12 @@ export default async function GroupExpensesPage({ {t('title')} {t('description')} +