Marker: Fixed card queue property mismatch - cards now properly separate in scanner queue

This commit is contained in:
Randall Stillwell 2025-08-01 17:41:42 -05:00
parent afb79c57d9
commit 061fb90b0a
2 changed files with 592 additions and 753 deletions

File diff suppressed because it is too large Load diff

View file

@ -78,16 +78,20 @@ export default function Scanner() {
const handleCardScanned = async (cardData) => {
console.log('Card scanned:', cardData);
console.log('Looking for existing card with name:', cardData.name, 'set:', cardData.set);
// Check if this card already exists in the queue
setScannedCards(prev => {
console.log('Current queue:', prev.map(c => ({ name: c.name, set: c.set, processed: c.processed })));
const existingCardIndex = prev.findIndex(existing =>
existing.name === cardData.cardName &&
existing.set === cardData.setName &&
existing.name === cardData.name &&
existing.set === cardData.set &&
!existing.processed
);
if (existingCardIndex !== -1) {
console.log(`📈 Incrementing quantity for existing card: ${cardData.name}`);
// Increment quantity of existing card
const updatedCards = [...prev];
updatedCards[existingCardIndex] = {
@ -97,12 +101,13 @@ export default function Scanner() {
};
return updatedCards;
} else {
console.log(`🆕 Adding new card to queue: ${cardData.name}`);
// Add new card to queue
const scannedCard = {
...cardData,
id: Date.now(), // Temporary ID for the queue
name: cardData.cardName,
set: cardData.setName,
id: Date.now() + Math.random(), // More unique ID for the queue
name: cardData.name,
set: cardData.set,
quantity: 1,
timestamp: new Date().toISOString(),
processed: false
@ -326,9 +331,9 @@ export default function Scanner() {
return (
<Layout>
<div className="max-w-6xl mx-auto p-6">
<div className="h-full flex flex-col">
{/* Header */}
<div className="mb-8">
<div className="px-6 pt-6 pb-4">
<h1 className="text-3xl font-bold mb-2" style={{ color: 'var(--text-primary)' }}>
🃏 Card Scanner
</h1>
@ -337,10 +342,11 @@ export default function Scanner() {
</p>
</div>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
{/* Main Content - Full Height */}
<div className="flex-1 grid grid-cols-1 lg:grid-cols-5 gap-6 px-6 pb-6">
{/* Camera Scanner */}
<div className="lg:col-span-2">
<div className="rounded-xl p-6" style={{ backgroundColor: 'var(--bg-secondary)', border: '1px solid var(--border)' }}>
<div className="lg:col-span-3 flex flex-col">
<div className="flex-1 rounded-xl p-6 flex flex-col" style={{ backgroundColor: 'var(--bg-secondary)', border: '1px solid var(--border)' }}>
<div className="flex justify-between items-center mb-4">
<h2 className="text-xl font-semibold" style={{ color: 'var(--text-primary)' }}>
Camera Scanner
@ -357,16 +363,18 @@ export default function Scanner() {
</button>
</div>
<CameraScanner
onCardScanned={handleCardScanned}
onError={handleError}
/>
<div className="flex-1">
<CameraScanner
onCardScanned={handleCardScanned}
onError={handleError}
/>
</div>
</div>
</div>
{/* Scanned Cards Queue */}
<div className="lg:col-span-1">
<div className="rounded-xl p-6" style={{ backgroundColor: 'var(--bg-secondary)', border: '1px solid var(--border)' }}>
<div className="lg:col-span-2 flex flex-col">
<div className="flex-1 rounded-xl p-6 flex flex-col" style={{ backgroundColor: 'var(--bg-secondary)', border: '1px solid var(--border)' }}>
<div className="flex justify-between items-center mb-4">
<h2 className="text-xl font-semibold" style={{ color: 'var(--text-primary)' }}>
Scanned Cards
@ -390,8 +398,9 @@ export default function Scanner() {
</div>
</div>
{/* Scanned Cards Queue */}
<div className="space-y-3">
{/* Scanned Cards Queue - Scrollable */}
<div className="flex-1 overflow-y-auto">
<div className="space-y-3">
{scannedCards.length === 0 ? (
<div className="text-center py-8" style={{ color: 'var(--text-secondary)' }}>
<div className="text-4xl mb-2">📱</div>
@ -604,6 +613,7 @@ export default function Scanner() {
</div>
))
)}
</div>
</div>
</div>
</div>