Benjamin_Boenisch/breakpilot-lehrer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix: Extract SelectedImage as component (IIFE breaks JSX parser)

Browse Source 
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Benjamin Admin
2026-04-28 08:24:19 +02:00
parent 1a272371f4
commit fc2fe98bd9
1 changed files with 19 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
studio-v2/app/learn/[unitId]/match/page.tsx
View File

@@ -16,6 +16,24 @@ interface QAItem {
function getApiBase() { return '' }
function SelectedImage({ items, selectedId, isDark }: { items: QAItem[]; selectedId: string | null; isDark: boolean }) {
if (!selectedId) return null
const item = items.find(i => i.id === selectedId)
if (!item?.image_url) return null
const isEmoji = item.image_url.length <= 4
return (
<div className={`mt-4 rounded-2xl overflow-hidden flex items-center justify-center ${
isDark ? 'bg-white/5' : 'bg-slate-50'
}`} style={{ minHeight: isEmoji ? 80 : 120 }}>
{isEmoji ? (
<span className="text-6xl">{item.image_url}</span>
) : (
<img src={item.image_url} alt={item.question} className="max-h-[160px] object-contain rounded-xl" />
)}
</div>
)
}
export default function MatchPage() {
const { unitId } = useParams<{ unitId: string }>()
const router = useRouter()
@@ -193,26 +211,7 @@ export default function MatchPage() {
</div>
{/* Image preview for selected word */}
{selectedLeft && (() => {
const item = roundItems.find(i => i.id === selectedLeft)
if (!item?.image_url) return null
const isEmoji = item.image_url.length <= 4
return (
<div className={`mt-4 rounded-2xl overflow-hidden flex items-center justify-center ${
isDark ? 'bg-white/5' : 'bg-slate-50'
}`} style={{ minHeight: isEmoji ? 80 : 120 }}>
{isEmoji ? (
<span className="text-6xl">{item.image_url}</span>
) : (
<img
src={item.image_url}
alt={item.question}
className="max-h-[160px] object-contain rounded-xl"
/>
)}
</div>
)
})()}
<SelectedImage items={roundItems} selectedId={selectedLeft} isDark={isDark} />
)}
</ExerciseLayout>
)