b464366341
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
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 / All Checks Passed (push) Has been cancelled
Tests / Go Tests (push) Has been cancelled
Tests / Python 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
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
Restructure financial plan from single 200k SAFE to realistic staged funding (25k Stammkapital, 25k Angel, 200k Wandeldarlehen, 1M Series A = 1.25M total). Add 60-month compute engine with CAPEX/OPEX accounting, cash constraints, hardware financing (30% upfront / 70% leasing), and revenue-based hiring caps. Rebuild TheAskSlide with 4-event funding timeline, update i18n (DE/EN), chat agent core messages, and add 15 new annex/technology slides with supporting UI components (KPICard, RunwayGauge, WaterfallChart, etc.). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
86 lines
2.7 KiB
TypeScript
86 lines
2.7 KiB
TypeScript
'use client'
|
|
|
|
import { FMResult } from '@/lib/types'
|
|
import {
|
|
BarChart,
|
|
Bar,
|
|
XAxis,
|
|
YAxis,
|
|
Tooltip,
|
|
ResponsiveContainer,
|
|
ReferenceLine,
|
|
Cell,
|
|
} from 'recharts'
|
|
|
|
interface WaterfallChartProps {
|
|
results: FMResult[]
|
|
lang: 'de' | 'en'
|
|
}
|
|
|
|
export default function WaterfallChart({ results, lang }: WaterfallChartProps) {
|
|
// Sample quarterly data for cleaner display
|
|
const quarterlyData = results.filter((_, i) => i % 3 === 0).map((r) => {
|
|
const netCash = r.revenue_eur - r.total_costs_eur
|
|
return {
|
|
label: `${r.year.toString().slice(2)}/Q${Math.ceil(r.month_in_year / 3)}`,
|
|
month: r.month,
|
|
revenue: Math.round(r.revenue_eur),
|
|
costs: Math.round(-r.total_costs_eur),
|
|
net: Math.round(netCash),
|
|
cashBalance: Math.round(r.cash_balance_eur),
|
|
}
|
|
})
|
|
|
|
const formatValue = (value: number) => {
|
|
if (Math.abs(value) >= 1_000_000) return `${(value / 1_000_000).toFixed(1)}M`
|
|
if (Math.abs(value) >= 1_000) return `${(value / 1_000).toFixed(0)}k`
|
|
return value.toString()
|
|
}
|
|
|
|
return (
|
|
<div className="w-full h-[220px]">
|
|
<ResponsiveContainer width="100%" height="100%">
|
|
<BarChart data={quarterlyData} margin={{ top: 10, right: 10, left: 0, bottom: 0 }}>
|
|
<XAxis
|
|
dataKey="label"
|
|
stroke="rgba(255,255,255,0.3)"
|
|
tick={{ fill: 'rgba(255,255,255,0.4)', fontSize: 9 }}
|
|
interval={1}
|
|
/>
|
|
<YAxis
|
|
stroke="rgba(255,255,255,0.1)"
|
|
tick={{ fill: 'rgba(255,255,255,0.4)', fontSize: 10 }}
|
|
tickFormatter={formatValue}
|
|
/>
|
|
<Tooltip
|
|
contentStyle={{
|
|
background: 'rgba(10, 10, 26, 0.95)',
|
|
border: '1px solid rgba(255,255,255,0.1)',
|
|
borderRadius: 12,
|
|
color: '#fff',
|
|
fontSize: 11,
|
|
}}
|
|
formatter={(value: number, name: string) => [
|
|
formatValue(value) + ' EUR',
|
|
name === 'revenue' ? (lang === 'de' ? 'Umsatz' : 'Revenue')
|
|
: name === 'costs' ? (lang === 'de' ? 'Kosten' : 'Costs')
|
|
: 'Net',
|
|
]}
|
|
/>
|
|
<ReferenceLine y={0} stroke="rgba(255,255,255,0.2)" />
|
|
<Bar dataKey="revenue" radius={[3, 3, 0, 0]} barSize={14}>
|
|
{quarterlyData.map((entry, i) => (
|
|
<Cell key={i} fill="rgba(34, 197, 94, 0.7)" />
|
|
))}
|
|
</Bar>
|
|
<Bar dataKey="costs" radius={[0, 0, 3, 3]} barSize={14}>
|
|
{quarterlyData.map((entry, i) => (
|
|
<Cell key={i} fill="rgba(239, 68, 68, 0.5)" />
|
|
))}
|
|
</Bar>
|
|
</BarChart>
|
|
</ResponsiveContainer>
|
|
</div>
|
|
)
|
|
}
|