diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/app/groups/[groupId]/balances-list.tsx | 4 | ||||
| -rw-r--r-- | src/app/groups/[groupId]/expenses/create-from-receipt-button.tsx | 6 | ||||
| -rw-r--r-- | src/app/groups/[groupId]/expenses/expense-list.tsx | 4 | ||||
| -rw-r--r-- | src/app/groups/[groupId]/reimbursement-list.tsx | 5 | ||||
| -rw-r--r-- | src/lib/utils.ts | 9 |
5 files changed, 17 insertions, 11 deletions
diff --git a/src/app/groups/[groupId]/balances-list.tsx b/src/app/groups/[groupId]/balances-list.tsx index 5e7b81b..b795914 100644 --- a/src/app/groups/[groupId]/balances-list.tsx +++ b/src/app/groups/[groupId]/balances-list.tsx @@ -1,5 +1,5 @@ import { Balances } from '@/lib/balances' -import { cn } from '@/lib/utils' +import { cn, formatCurrency } from '@/lib/utils' import { Participant } from '@prisma/client' type Props = { @@ -28,7 +28,7 @@ export function BalancesList({ balances, participants, currency }: Props) { </div> <div className={cn('w-1/2 relative', isLeft || 'text-right')}> <div className="absolute inset-0 p-2 z-20"> - {currency} {(balance / 100).toFixed(2)} + {formatCurrency(currency, balance)} </div> {balance !== 0 && ( <div diff --git a/src/app/groups/[groupId]/expenses/create-from-receipt-button.tsx b/src/app/groups/[groupId]/expenses/create-from-receipt-button.tsx index b6df672..c157cc9 100644 --- a/src/app/groups/[groupId]/expenses/create-from-receipt-button.tsx +++ b/src/app/groups/[groupId]/expenses/create-from-receipt-button.tsx @@ -26,7 +26,7 @@ import { import { ToastAction } from '@/components/ui/toast' import { useToast } from '@/components/ui/use-toast' import { useMediaQuery } from '@/lib/hooks' -import { formatExpenseDate } from '@/lib/utils' +import { formatCurrency, formatExpenseDate } from '@/lib/utils' import { Category } from '@prisma/client' import { ChevronRight, FileQuestion, Loader2, Receipt } from 'lucide-react' import { getImageData, usePresignedUpload } from 'next-s3-upload' @@ -185,9 +185,7 @@ export function CreateFromReceiptButton({ <div> {receiptInfo ? ( receiptInfo.amount ? ( - <> - {groupCurrency} {receiptInfo.amount.toFixed(2)} - </> + <>{formatCurrency(groupCurrency, receiptInfo.amount)}</> ) : ( <Unknown /> ) diff --git a/src/app/groups/[groupId]/expenses/expense-list.tsx b/src/app/groups/[groupId]/expenses/expense-list.tsx index a97c2bd..cc908af 100644 --- a/src/app/groups/[groupId]/expenses/expense-list.tsx +++ b/src/app/groups/[groupId]/expenses/expense-list.tsx @@ -3,7 +3,7 @@ import { CategoryIcon } from '@/app/groups/[groupId]/expenses/category-icon' import { Button } from '@/components/ui/button' import { SearchBar } from '@/components/ui/search-bar' import { getGroupExpenses } from '@/lib/api' -import { cn, formatExpenseDate } from '@/lib/utils' +import { cn, formatCurrency, formatExpenseDate } from '@/lib/utils' import { Expense, Participant } from '@prisma/client' import dayjs, { type Dayjs } from 'dayjs' import { ChevronRight } from 'lucide-react' @@ -156,7 +156,7 @@ export function ExpenseList({ expense.isReimbursement ? 'italic' : 'font-bold', )} > - {currency} {(expense.amount / 100).toFixed(2)} + {formatCurrency(currency, expense.amount)} </div> <div className="text-xs text-muted-foreground"> {formatExpenseDate(expense.expenseDate)} diff --git a/src/app/groups/[groupId]/reimbursement-list.tsx b/src/app/groups/[groupId]/reimbursement-list.tsx index 54ee9d7..8031aa5 100644 --- a/src/app/groups/[groupId]/reimbursement-list.tsx +++ b/src/app/groups/[groupId]/reimbursement-list.tsx @@ -1,5 +1,6 @@ import { Button } from '@/components/ui/button' import { Reimbursement } from '@/lib/balances' +import { formatCurrency } from '@/lib/utils' import { Participant } from '@prisma/client' import Link from 'next/link' @@ -42,9 +43,7 @@ export function ReimbursementList({ </Link> </Button> </div> - <div> - {currency} {(reimbursement.amount / 100).toFixed(2)} - </div> + <div>{formatCurrency(currency, reimbursement.amount)}</div> </div> ))} </div> diff --git a/src/lib/utils.ts b/src/lib/utils.ts index 39477d1..2ce486c 100644 --- a/src/lib/utils.ts +++ b/src/lib/utils.ts @@ -20,3 +20,12 @@ export function formatExpenseDate(date: Date) { export function formatCategoryForAIPrompt(category: Category) { return `"${category.grouping}/${category.name}" (ID: ${category.id})` } + +export function formatCurrency(currency: string, amount: number) { + const format = new Intl.NumberFormat('en-US', { + minimumFractionDigits: 2, + maximumFractionDigits: 2, + }) + const formattedAmount = format.format(amount / 100) + return `${currency} ${formattedAmount}` +} |