feat(09-02): add WeightSummaryCard with donut chart and classification subtotals

- Install recharts dependency for donut chart visualization
- Create WeightSummaryCard component with pill toggle (category/classification views)
- Compute base/worn/consumable/total weight subtotals from items array
- Render donut chart with colored segments, center total, and hover tooltips
- Wire WeightSummaryCard into setup detail page below sticky bar
This commit is contained in:
2026-03-16 15:20:41 +01:00
parent 83103251b1
commit d098277797
4 changed files with 344 additions and 1 deletions

View File

@@ -4,6 +4,7 @@ import { CategoryHeader } from "../../components/CategoryHeader";
import { ClassificationBadge } from "../../components/ClassificationBadge";
import { ItemCard } from "../../components/ItemCard";
import { ItemPicker } from "../../components/ItemPicker";
import { WeightSummaryCard } from "../../components/WeightSummaryCard";
import {
useDeleteSetup,
useRemoveSetupItem,
@@ -189,9 +190,10 @@ function SetupDetailPage() {
</div>
)}
{/* Items grouped by category */}
{/* Weight summary card + items grouped by category */}
{itemCount > 0 && (
<div className="pb-6">
<WeightSummaryCard items={setup.items} />
{Array.from(groupedItems.entries()).map(
([
categoryId,