Some checks failed
ci/woodpecker/push/integration Pipeline failed
ci/woodpecker/push/main Pipeline failed
CI/CD Pipeline / Go Tests (push) Has been cancelled
CI/CD Pipeline / Python Tests (push) Has been cancelled
CI/CD Pipeline / Website Tests (push) Has been cancelled
CI/CD Pipeline / Linting (push) Has been cancelled
CI/CD Pipeline / Security Scan (push) Has been cancelled
CI/CD Pipeline / Docker Build & Push (push) Has been cancelled
CI/CD Pipeline / Integration Tests (push) Has been cancelled
CI/CD Pipeline / Deploy to Staging (push) Has been cancelled
CI/CD Pipeline / Deploy to Production (push) Has been cancelled
CI/CD Pipeline / CI Summary (push) Has been cancelled
Security Scanning / Secret Scanning (push) Has been cancelled
Security Scanning / Dependency Vulnerability Scan (push) Has been cancelled
Security Scanning / Go Security Scan (push) Has been cancelled
Security Scanning / Python Security Scan (push) Has been cancelled
Security Scanning / Node.js Security Scan (push) Has been cancelled
Security Scanning / Docker Image Security (push) Has been cancelled
Security Scanning / Security Summary (push) Has been cancelled
Tests / Go Tests (push) Has been cancelled
Tests / Python Tests (push) Has been cancelled
Tests / Integration Tests (push) Has been cancelled
Tests / Go Lint (push) Has been cancelled
Tests / Python Lint (push) Has been cancelled
Tests / Security Scan (push) Has been cancelled
Tests / All Checks Passed (push) Has been cancelled
- Academy, Whistleblower, Incidents frontend pages with API proxies and types - Vendor compliance API proxy route - Go backend handlers and models for all new SDK modules - Investor pitch-deck app with interactive slides - Blog section with DSGVO, AI Act, NIS2, glossary articles - MkDocs documentation site - CI/CD pipelines (Woodpecker, GitHub Actions), security scanning config - Planning and implementation documentation Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
73 lines
2.7 KiB
TypeScript
73 lines
2.7 KiB
TypeScript
'use client'
|
|
|
|
import { PitchFinancial, Language } from '@/lib/types'
|
|
import { t } from '@/lib/i18n'
|
|
import {
|
|
BarChart,
|
|
Bar,
|
|
XAxis,
|
|
YAxis,
|
|
Tooltip,
|
|
ResponsiveContainer,
|
|
Line,
|
|
ComposedChart,
|
|
Area,
|
|
} from 'recharts'
|
|
|
|
interface FinancialChartProps {
|
|
financials: PitchFinancial[]
|
|
lang: Language
|
|
growthMultiplier?: number
|
|
}
|
|
|
|
export default function FinancialChart({ financials, lang, growthMultiplier = 1 }: FinancialChartProps) {
|
|
const i = t(lang)
|
|
|
|
const data = financials.map((f) => ({
|
|
year: f.year,
|
|
[i.financials.revenue]: Math.round(f.revenue_eur * growthMultiplier),
|
|
[i.financials.costs]: f.costs_eur,
|
|
[i.financials.customers]: Math.round(f.customers_count * growthMultiplier),
|
|
}))
|
|
|
|
const formatValue = (value: number) => {
|
|
if (value >= 1_000_000) return `${(value / 1_000_000).toFixed(1)}M`
|
|
if (value >= 1_000) return `${(value / 1_000).toFixed(0)}k`
|
|
return value.toString()
|
|
}
|
|
|
|
return (
|
|
<div className="w-full h-[300px]">
|
|
<ResponsiveContainer width="100%" height="100%">
|
|
<ComposedChart data={data} margin={{ top: 10, right: 10, left: 0, bottom: 0 }}>
|
|
<defs>
|
|
<linearGradient id="revenueGradient" x1="0" y1="0" x2="0" y2="1">
|
|
<stop offset="0%" stopColor="#6366f1" stopOpacity={0.8} />
|
|
<stop offset="100%" stopColor="#6366f1" stopOpacity={0.2} />
|
|
</linearGradient>
|
|
<linearGradient id="costGradient" x1="0" y1="0" x2="0" y2="1">
|
|
<stop offset="0%" stopColor="#f43f5e" stopOpacity={0.6} />
|
|
<stop offset="100%" stopColor="#f43f5e" stopOpacity={0.1} />
|
|
</linearGradient>
|
|
</defs>
|
|
<XAxis dataKey="year" stroke="rgba(255,255,255,0.3)" tick={{ fill: 'rgba(255,255,255,0.5)', fontSize: 12 }} />
|
|
<YAxis stroke="rgba(255,255,255,0.1)" tick={{ fill: 'rgba(255,255,255,0.4)', fontSize: 11 }} tickFormatter={formatValue} />
|
|
<Tooltip
|
|
contentStyle={{
|
|
background: 'rgba(10, 10, 26, 0.9)',
|
|
border: '1px solid rgba(255,255,255,0.1)',
|
|
borderRadius: 12,
|
|
color: '#fff',
|
|
fontSize: 13,
|
|
}}
|
|
formatter={(value: number) => formatValue(value) + ' EUR'}
|
|
/>
|
|
<Area type="monotone" dataKey={i.financials.revenue} fill="url(#revenueGradient)" stroke="#6366f1" strokeWidth={2} />
|
|
<Bar dataKey={i.financials.costs} fill="url(#costGradient)" radius={[4, 4, 0, 0]} barSize={30} />
|
|
<Line type="monotone" dataKey={i.financials.customers} stroke="#22c55e" strokeWidth={2} dot={{ r: 4, fill: '#22c55e' }} yAxisId={0} />
|
|
</ComposedChart>
|
|
</ResponsiveContainer>
|
|
</div>
|
|
)
|
|
}
|