47 lines
1.5 KiB
TypeScript
Executable File
47 lines
1.5 KiB
TypeScript
Executable File
'use client';
|
|
|
|
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
|
import { Badge } from '@/components/ui/badge';
|
|
import type { GameStore } from '@/lib/game/store';
|
|
import { LootInventoryDisplay } from '@/components/game/LootInventory';
|
|
|
|
export interface LootTabProps {
|
|
store: GameStore;
|
|
}
|
|
|
|
export function LootTab({ store }: LootTabProps) {
|
|
const inventory = store.lootInventory;
|
|
const elements = store.elements;
|
|
const equipmentInstances = store.equipmentInstances;
|
|
|
|
// Count items for badge
|
|
const materialCount = Object.values(inventory.materials).reduce((a, b) => a + b, 0);
|
|
const blueprintCount = inventory.blueprints.length;
|
|
const equipmentCount = Object.keys(equipmentInstances).length;
|
|
const totalItems = materialCount + blueprintCount + equipmentCount;
|
|
|
|
return (
|
|
<div className="space-y-4">
|
|
<Card className="bg-gray-900/80 border-gray-700">
|
|
<CardHeader className="pb-2">
|
|
<CardTitle className="text-amber-400 text-sm flex items-center gap-2">
|
|
💎 Loot Inventory
|
|
<Badge className="ml-auto bg-gray-800 text-gray-300">
|
|
{totalItems} items
|
|
</Badge>
|
|
</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<LootInventoryDisplay
|
|
inventory={inventory}
|
|
elements={elements}
|
|
equipmentInstances={equipmentInstances}
|
|
onDeleteMaterial={store.deleteMaterial}
|
|
onDeleteEquipment={store.deleteEquipmentInstance}
|
|
/>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
);
|
|
}
|