12 - Integrate distribution preview into scenario page

This commit is contained in:
myrmidex 2026-03-21 11:49:45 +01:00
parent 0bec678b5a
commit d603fc6401

View file

@ -4,6 +4,7 @@ import { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter }
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import InlineEditInput from '@/components/InlineEditInput'; import InlineEditInput from '@/components/InlineEditInput';
import InlineEditSelect from '@/components/InlineEditSelect'; import InlineEditSelect from '@/components/InlineEditSelect';
import IncomeDistributionPreview from '@/components/IncomeDistributionPreview';
interface Scenario { interface Scenario {
id: string; id: string;
@ -371,6 +372,13 @@ export default function Show({ scenario, buckets, streams = { data: [] }, stream
</div> </div>
)} )}
{/* Income Distribution Preview */}
{buckets.data.length > 0 && (
<div className="mt-8">
<IncomeDistributionPreview scenarioId={scenario.id} />
</div>
)}
{/* Streams Section */} {/* Streams Section */}
<div className="mt-8"> <div className="mt-8">
<div className="flex items-center justify-between mb-4"> <div className="flex items-center justify-between mb-4">
@ -517,15 +525,6 @@ export default function Show({ scenario, buckets, streams = { data: [] }, stream
)} )}
</div> </div>
{/* Placeholder for future features */}
<div className="rounded-lg bg-blue-50 p-6 text-center">
<h3 className="text-lg font-medium text-blue-900">
Coming Next: Timeline & Projections
</h3>
<p className="text-sm text-blue-700 mt-2">
Calculate projections to see your money flow through these buckets over time.
</p>
</div>
</div> </div>
</div> </div>
</div> </div>