Wire Parent Quiz to central translation system + native language audio

Uses useNativeLanguage() hook for all UI text. Shows native language
translation of vocab word + audio button for native pronunciation.
Removed inline pt translations dict (now in exerciseTranslations.ts).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Benjamin Admin
2026-04-27 00:22:39 +02:00
parent bd3ca854ef
commit 9e63b09cb7

View File

@@ -5,30 +5,21 @@ import { useParams, useRouter } from 'next/navigation'
import { useTheme } from '@/lib/ThemeContext' import { useTheme } from '@/lib/ThemeContext'
import { useLanguage } from '@/lib/LanguageContext' import { useLanguage } from '@/lib/LanguageContext'
import { AudioButton } from '@/components/learn/AudioButton' import { AudioButton } from '@/components/learn/AudioButton'
import { useNativeLanguage } from '@/lib/useNativeLanguage'
interface QAItem { interface QAItem {
id: string; question: string; answer: string id: string; question: string; answer: string
translations?: Record<string, { text?: string }> translations?: Record<string, { text?: string }>
} }
const pt: Record<string, Record<string, string>> = { // UI translations now come from useNativeLanguage() hook + exerciseTranslations.ts
ask_child: { de: 'Fragen Sie Ihr Kind:', tr: '\u00c7ocu\u011funuza sorun:', ar: '\u0627\u0633\u0623\u0644 \u0637\u0641\u0644\u0643:', uk: '\u0417\u0430\u043f\u0438\u0442\u0430\u0439\u0442\u0435 \u0434\u0438\u0442\u0438\u043d\u0443:', ru: '\u0421\u043f\u0440\u043e\u0441\u0438\u0442\u0435 \u0440\u0435\u0431\u0435\u043d\u043a\u0430:', en: 'Ask your child:' },
correct_answer: { de: 'Richtige Antwort:', tr: 'Do\u011fru cevap:', ar: '\u0627\u0644\u0625\u062c\u0627\u0628\u0629 \u0627\u0644\u0635\u062d\u064a\u062d\u0629:', uk: '\u041f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u0430 \u0432\u0456\u0434\u043f\u043e\u0432\u0456\u0434\u044c:', ru: '\u041f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0439 \u043e\u0442\u0432\u0435\u0442:', en: 'Correct answer:' },
show_answer: { de: 'Antwort zeigen', tr: 'Cevab\u0131 g\u00f6ster', ar: '\u0625\u0638\u0647\u0627\u0631 \u0627\u0644\u0625\u062c\u0627\u0628\u0629', uk: '\u041f\u043e\u043a\u0430\u0437\u0430\u0442\u0438 \u0432\u0456\u0434\u043f\u043e\u0432\u0456\u0434\u044c', ru: '\u041f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u043e\u0442\u0432\u0435\u0442', en: 'Show answer' },
hide_answer: { de: 'Antwort verbergen', tr: 'Cevab\u0131 gizle', ar: '\u0625\u062e\u0641\u0627\u0621 \u0627\u0644\u0625\u062c\u0627\u0628\u0629', uk: '\u0421\u0445\u043e\u0432\u0430\u0442\u0438 \u0432\u0456\u0434\u043f\u043e\u0432\u0456\u0434\u044c', ru: '\u0421\u043a\u0440\u044b\u0442\u044c \u043e\u0442\u0432\u0435\u0442', en: 'Hide answer' },
wrong: { de: 'Falsch', tr: 'Yanl\u0131\u015f', ar: '\u062e\u0637\u0623', uk: '\u041d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e', ru: '\u041d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e', en: 'Wrong' },
correct: { de: 'Richtig', tr: 'Do\u011fru', ar: '\u0635\u062d\u064a\u062d', uk: '\u041f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e', ru: '\u041f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e', en: 'Correct' },
done: { de: 'Fertig!', tr: 'Bitti!', ar: '\u0627\u0646\u062a\u0647\u0649!', uk: '\u0413\u043e\u0442\u043e\u0432\u043e!', ru: '\u0413\u043e\u0442\u043e\u0432\u043e!', en: 'Done!' },
again: { de: 'Nochmal', tr: 'Tekrar', ar: '\u0645\u0631\u0629 \u0623\u062e\u0631\u0649', uk: '\u0429\u0435 \u0440\u0430\u0437', ru: '\u0415\u0449\u0435 \u0440\u0430\u0437', en: 'Again' },
back: { de: 'Zurueck', tr: 'Geri', ar: '\u0631\u062c\u0648\u0639', uk: '\u041d\u0430\u0437\u0430\u0434', ru: '\u041d\u0430\u0437\u0430\u0434', en: 'Back' },
question: { de: 'Frage', tr: 'Soru', ar: '\u0633\u0624\u0627\u0644', uk: '\u041f\u0438\u0442\u0430\u043d\u043d\u044f', ru: '\u0412\u043e\u043f\u0440\u043e\u0441', en: 'Question' },
}
export default function ParentQuizPage() { export default function ParentQuizPage() {
const { unitId } = useParams<{ unitId: string }>() const { unitId } = useParams<{ unitId: string }>()
const router = useRouter() const router = useRouter()
const { isDark } = useTheme() const { isDark } = useTheme()
const { language } = useLanguage() const { language } = useLanguage()
const { t, wordInNative, nativeLang, isThirdLanguage } = useNativeLanguage()
const [items, setItems] = useState<QAItem[]>([]) const [items, setItems] = useState<QAItem[]>([])
const [currentIndex, setCurrentIndex] = useState(0) const [currentIndex, setCurrentIndex] = useState(0)
@@ -37,8 +28,6 @@ export default function ParentQuizPage() {
const [stats, setStats] = useState({ correct: 0, incorrect: 0 }) const [stats, setStats] = useState({ correct: 0, incorrect: 0 })
const [isComplete, setIsComplete] = useState(false) const [isComplete, setIsComplete] = useState(false)
const t = (key: string) => pt[key]?.[language] || pt[key]?.['de'] || key
const glassCard = isDark const glassCard = isDark
? 'bg-white/10 backdrop-blur-xl border border-white/10' ? 'bg-white/10 backdrop-blur-xl border border-white/10'
: 'bg-white/80 backdrop-blur-xl border border-black/5' : 'bg-white/80 backdrop-blur-xl border border-black/5'
@@ -62,7 +51,7 @@ export default function ParentQuizPage() {
}, [currentIndex, items.length]) }, [currentIndex, items.length])
const currentItem = items[currentIndex] const currentItem = items[currentIndex]
const nativeTranslation = currentItem?.translations?.[language]?.text || '' const nativeTranslation = wordInNative(currentItem?.translations)
if (isLoading) { if (isLoading) {
return ( return (
@@ -127,6 +116,9 @@ export default function ParentQuizPage() {
)} )}
<div className="flex justify-center gap-3 mt-4"> <div className="flex justify-center gap-3 mt-4">
<AudioButton text={currentItem.question} lang="en" isDark={isDark} size="md" /> <AudioButton text={currentItem.question} lang="en" isDark={isDark} size="md" />
{nativeTranslation && (
<AudioButton text={nativeTranslation} lang={nativeLang as 'en' | 'de'} isDark={isDark} size="md" />
)}
</div> </div>
</div> </div>