Function usePracticeSession

frontend/src/hooks/usePracticeSession.ts:21–139

(collectionId: string)

}

export function usePracticeSession(collectionId: string) {
  const [state, setState] = useState<PracticeSessionState>({
    sessionId: null,
    currentCard: null,
    isFlipped: false,
    progress: {
      correct: 0,
      incorrect: 0,
      total: 0,
    },
    isComplete: false,
  })
  const [isLoading, setIsLoading] = useState(false)
  const [error, setError] = useState<string | null>(null)

  const startingRef = useRef(false)

  const start = useCallback(async () => {
    if (startingRef.current || state.sessionId) return
    startingRef.current = true
    setIsLoading(true)
    setError(null)
    try {
      const session = await startPracticeSession(collectionId)
      setState((prev) => ({
        ...prev,
        sessionId: session.id,
        isComplete: session.is_completed,
        progress: {
          correct: session.correct_answers,
          incorrect: session.cards_practiced - session.correct_answers,
          total: session.total_cards,
        },
      }))
      if (!session.is_completed) {
        const nextCardData = await getNextPracticeCard(session.id)
        setState((prev) => ({
          ...prev,
          currentCard: nextCardData ? nextCardData.card : null,
          isFlipped: false,
        }))
      }
    } catch (err: unknown) {
      console.error(err)
      setError('Failed to start session')
    } finally {
      setIsLoading(false)
      startingRef.current = false
    }
  }, [collectionId, state.sessionId])

  const handleFlip = useCallback(() => {
    setState((prev) => ({ ...prev, isFlipped: !prev.isFlipped }))
  }, [])

  const handleAnswer = useCallback(
    async (isCorrect: boolean) => {
      if (!state.sessionId || !state.currentCard) return