Files
accounted/components/reports/IncomeExpenseChart.tsx
T
Jakob Wennberg 6f4573f380 feat: add foreign currency support, refactor bookkeeping engine, and improve invoice inbox document classification
- Add currency-utils module for SEK conversion with exchange rates
- Refactor createJournalEntry to use draft+commit flow preventing voucher number gaps (BFL 5 kap. 7§)
- Add foreign currency support to invoice entries with per-line SEK conversion
- Centralize category-to-account mapping into single source of truth
- Refactor invoice inbox to use shared document analyzer with document type classification (receipt, supplier invoice, government letter)
- Update mapping engine, supplier invoice entries, and transaction entries
- Fix report component rendering issues
- Add new validation schemas and tests

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-27 09:50:06 +01:00

53 lines
1.7 KiB
TypeScript

'use client'
import { BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer, Legend } from 'recharts'
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
import { formatCurrency } from '@/lib/utils'
export interface MonthlyDataPoint {
label: string
income: number
expenses: number
}
interface IncomeExpenseChartProps {
months: MonthlyDataPoint[]
}
export function IncomeExpenseChart({ months }: IncomeExpenseChartProps) {
if (months.length === 0) return null
return (
<Card className="mb-4">
<CardHeader className="pb-2">
<CardTitle className="text-base">Intäkter vs Kostnader per månad</CardTitle>
</CardHeader>
<CardContent>
<ResponsiveContainer width="100%" height={300}>
<BarChart
data={months}
margin={{ top: 5, right: 30, left: 20, bottom: 5 }}
>
<CartesianGrid strokeDasharray="3 3" vertical={false} />
<XAxis dataKey="label" tick={{ fontSize: 12 }} />
<YAxis
tickFormatter={(v) => new Intl.NumberFormat('sv-SE', { notation: 'compact' }).format(v)}
/>
<Tooltip
formatter={(value, name) => [
formatCurrency(Number(value)),
name === 'income' ? 'Intäkter' : 'Kostnader',
]}
/>
<Legend
formatter={(value) => (value === 'income' ? 'Intäkter' : 'Kostnader')}
/>
<Bar dataKey="income" fill="hsl(var(--chart-1))" radius={[4, 4, 0, 0]} />
<Bar dataKey="expenses" fill="hsl(var(--chart-2))" radius={[4, 4, 0, 0]} />
</BarChart>
</ResponsiveContainer>
</CardContent>
</Card>
)
}