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