70 lines
1.8 KiB
TypeScript
70 lines
1.8 KiB
TypeScript
'use client'
|
|
|
|
import { Navigation } from '@/components/shared/Navigation'
|
|
import './globals.css'
|
|
import { SimpleFlipCard } from './components/SimpleFlipCard'
|
|
import { SimpleProgress } from './components/SimpleProgress'
|
|
import { SimpleResults } from './components/SimpleResults'
|
|
import { SIMPLE_CARDS, CardState } from './data'
|
|
import { useReviewSession } from './hooks/useReviewSession'
|
|
|
|
export default function SimpleReviewPage() {
|
|
// 使用自定義 Hook 管理複習狀態
|
|
const {
|
|
cards,
|
|
score,
|
|
isComplete,
|
|
currentCard,
|
|
sortedCards,
|
|
handleAnswer,
|
|
handleSkip,
|
|
handleRestart
|
|
} = useReviewSession()
|
|
|
|
// 顯示結果頁面
|
|
if (isComplete) {
|
|
return (
|
|
<div className="min-h-screen bg-gradient-to-br from-blue-50 to-indigo-100">
|
|
<Navigation />
|
|
<div className="py-8">
|
|
<SimpleResults
|
|
score={score}
|
|
totalCards={SIMPLE_CARDS.length}
|
|
onRestart={handleRestart}
|
|
/>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
// 主要複習頁面
|
|
return (
|
|
<div className="min-h-screen bg-gradient-to-br from-blue-50 to-indigo-100">
|
|
<Navigation />
|
|
|
|
<div className="py-8">
|
|
<div className="max-w-4xl mx-auto px-4">
|
|
{/* 進度顯示 */}
|
|
<SimpleProgress
|
|
current={cards.filter((card: CardState) => card.isCompleted).length + 1}
|
|
total={cards.length}
|
|
score={score}
|
|
cards={cards}
|
|
sortedCards={sortedCards}
|
|
currentCard={currentCard}
|
|
/>
|
|
|
|
{/* 翻卡組件 */}
|
|
{currentCard && (
|
|
<SimpleFlipCard
|
|
card={currentCard}
|
|
onAnswer={handleAnswer}
|
|
onSkip={handleSkip}
|
|
/>
|
|
)}
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
} |