+
+ {deck && (
+
+
+ {/* Loading / Error states */}
+ {loading && (
+
+
+ )}
+ {deck.name}
+ {currentDeckType && ( + + {currentDeckType.label} + + )} +
+ Betöltés...
+
+ )}
+ {error && (
+
+ {error}
+
+ )}
+
+ {/* Filters and controls */}
+ {!loading && !error && (
+ <>
+
+
+
+ {showSortHelp && (
+
+ setSearch(e.target.value)}
+ width={300}
+ placeholder="Keresés kérdésben vagy válaszokban..."
+ className="mr-4"
+ />
+
+ Rendezés:
+
+
+
+
+ Rendezési lehetőségek magyarázata
+-
+
- + Eredeti sorrend – A kártyák eredeti sorrendben jelennek meg + +
- + Kérdés A→Z – Kérdések ABC sorrendben (A-tól Z-ig) + +
- + Kérdés Z→A – Kérdések fordított ABC sorrendben (Z-től A-ig) + +
- + Válaszok száma ↑ – Kevesebb választól a több válasz felé + +
- + Válaszok száma ↓ – Több választól a kevesebb válasz felé + +
+
+
+ {/* Cards Grid */}
+
+
+ Elemek oldalanként:
+
+
+
+
+
+ {totalCards > 0 ? (
+ <>
+ {startIndex + 1}-{Math.min(endIndex, totalCards)} / {totalCards} kártya
+
+ ) : (
+ <>0 kártya
+ )}
+
+
+ {totalCards === 0 && (
+
+
+ {/* Pagination Controls */}
+ {totalPages > 1 && (
+
+ Nincsenek kártyák ebben a pakliban.
+
+ )}
+ {paginatedCards.map((card, idx) => {
+ const cardIndex = startIndex + idx + 1
+ const questionText = card.question || card.statement || 'Kérdés hiányzik'
+
+ // Get answers based on card type
+ let answerOptions = []
+ let correctAnswerIndex = card.correctAnswer
+
+ // Normalize subType (can be string or number or undefined)
+ const subType = card.subType ? String(card.subType).toLowerCase() : 'undefined'
+
+ // Detect card type by fields if subType is missing
+ let detectedType = subType
+ if (subType === 'undefined' || subType === 'null') {
+ // Check by numeric type field first
+ if (card.type === 3) {
+ // type 3 = True/False
+ detectedType = 'truefalse'
+ } else if (card.type === 2) {
+ // type 2 = Text answer
+ detectedType = 'text'
+ } else if (card.leftItems && card.rightItems && card.correctPairs) {
+ // Has leftItems, rightItems AND correctPairs = matching
+ detectedType = 'matching'
+ } else if (card.acceptedAnswers && card.acceptedAnswers.length > 0 && card.acceptedAnswers[0] && card.acceptedAnswers[0].trim()) {
+ // Only detect as text if acceptedAnswers has non-empty values
+ detectedType = 'text'
+ } else if (card.isTrue !== undefined) {
+ detectedType = 'truefalse'
+ } else if (card.options && Array.isArray(card.options) && card.options.some(opt => opt && opt.trim())) {
+ // Has non-empty options - must be multiple choice
+ detectedType = 'multiplechoice'
+ }
+ }
+
+ if (detectedType === 'truefalse' || detectedType === '0') {
+ // True/False cards
+ answerOptions = ['Igaz', 'Hamis']
+ // correctAnswer: 0 = Igaz, 1 = Hamis (based on user feedback)
+ correctAnswerIndex = card.correctAnswer !== undefined ? card.correctAnswer : (card.isTrue ? 0 : 1)
+ } else if ((detectedType === 'text' || detectedType === '2') && card.acceptedAnswers && Array.isArray(card.acceptedAnswers)) {
+ // Text-based cards with accepted answers
+ answerOptions = card.acceptedAnswers
+ correctAnswerIndex = -1 // All accepted answers are correct
+ } else if (detectedType === 'matching' || detectedType === '5') {
+ // Matching cards - pairs
+ if (card.leftItems && card.rightItems && card.correctPairs) {
+ // Build pairs from correctPairs object
+ const pairs = []
+ for (const [leftIdx, rightIdx] of Object.entries(card.correctPairs)) {
+ const left = card.leftItems[parseInt(leftIdx)]
+ const right = card.rightItems[parseInt(rightIdx)]
+ if (left && right) {
+ pairs.push(`${left} → ${right}`)
+ }
+ }
+ answerOptions = pairs
+ correctAnswerIndex = -1 // All pairs are correct
+ }
+ } else if ((detectedType === 'multiplechoice' || detectedType === '1') && card.options && Array.isArray(card.options)) {
+ // Multiple choice - filter out empty options
+ answerOptions = card.options.filter(opt => opt && opt.trim())
+ correctAnswerIndex = card.correctAnswer
+ } else if (card.options && Array.isArray(card.options)) {
+ // Other types with options
+ answerOptions = card.options.filter(opt => opt && opt.trim())
+ } else if (card.answers && Array.isArray(card.answers)) {
+ // Other card types with answers array
+ answerOptions = card.answers.filter(opt => opt && opt.trim())
+ } else if (card.acceptedAnswers && Array.isArray(card.acceptedAnswers)) {
+ // Fallback for accepted answers
+ answerOptions = card.acceptedAnswers
+ correctAnswerIndex = -1
+ }
+
+ const answerCount = answerOptions.length
+ const cardId = card.id || idx
+ const isFlipped = flippedCards.has(cardId)
+
+ return (
+ toggleCardFlip(cardId)}
+ >
+
+ )
+ })}
+
+ {/* Front side - Question */}
+
+
+
+
+ {/* Back side - Answer */}
+
+
+ Kártya #{cardIndex}
+
+
+ {answerCount} válasz
+
+
+
+ + {questionText} +
+ + {/* Type info only */} +
+
+ Típus:
+ {cardSubTypeLabels[detectedType] || cardSubTypeLabels[card.subType] || cardSubTypeLabels[card.type] || detectedType || 'Ismeretlen'}
+
+
+ Kattints a megoldáshoz →
+
+
+
+
+
+ Megoldás
+
+
+ {answerCount} válasz
+
+
+
+ {answerCount > 0 ? (
+
+
+ ) : (
+
+ Helyes válasz:
+
+ {detectedType === 'truefalse' || detectedType === '0' ? (
+ // True/False - show only the correct answer
+
+ ✓ {card.isTrue ? 'Igaz' : 'Hamis'}
+
+ ) : detectedType === 'matching' || detectedType === '5' ? (
+ // Matching - show all correct pairs
+ -
+ {answerOptions.map((pair, idx) => (
+
- + ✓ {pair} + + ))} +
-
+ {answerOptions.map((answer, ansIdx) => (
+
- + ✓ {answer} + + ))} +
+ ✓ {answerOptions[correctAnswerIndex]}
+
+ ) : (
+
+ Nincs megadva helyes válasz
+
+ )
+ )}
+
+ Nincs elérhető válasz
+
+ )}
+
+
+ Kattints a kérdéshez ←
+
+
+
+
+
+ )}
+
+ )}
+
+ {[...Array(totalPages)].map((_, index) => {
+ const pageNum = index + 1
+ if (
+ pageNum === 1 ||
+ pageNum === totalPages ||
+ (pageNum >= currentPage - 1 && pageNum <= currentPage + 1)
+ ) {
+ return (
+
+ )
+ } else if (
+ pageNum === currentPage - 2 ||
+ pageNum === currentPage + 2
+ ) {
+ return (
+
+ ...
+
+ )
+ }
+ return null
+ })}
+
+
+
+