feat: Load initial quiz questions in parallel

rgilks · rgilks · commit 5593e4180b62 · 2025-05-05T21:55:41.000+01:00
diff --git a/app/actions/exercise.ts b/app/actions/exercise.ts
@@ -9,11 +9,17 @@ import { countCachedExercises } from '@/lib/exercise-cache';
 import { validateRequestParams, getOrGenerateExercise } from './exercise-orchestrator';
 import { checkRateLimit } from '@/lib/rate-limiter';
 import type { ZodIssue } from 'zod';
+import { z } from 'zod';
 import type { GenerateExerciseResult } from '@/lib/domain/schemas';
 import { LANGUAGES } from '@/lib/domain/language';
 import { getRandomTopicForLevel } from '@/lib/domain/topics';
 import { getGrammarGuidance, getVocabularyGuidance } from '@/lib/domain/language-guidance';
 import type { ExerciseGenerationParams } from '@/lib/domain/ai';
+import {
+  // InitialExercisePairResultSchema, // Unused schema
+  type InitialExercisePairResult,
+  GenerateExerciseResultSchema,
+} from '@/lib/domain/schemas';
 
 // --- Main Action ---
 
@@ -35,6 +41,7 @@ export const generateExerciseResponse = async (
   const validParams = validationResult.data;
 
   const isAllowed = checkRateLimit(ip);
+
   if (!isAllowed) {
     const cachedResult = await tryGetCachedExercise(validParams, userId);
     if (cachedResult) {
@@ -75,3 +82,84 @@ export const generateExerciseResponse = async (
     return createErrorResponse(errorMessage);
   }
 };
+
+// --- New Action for Initial Pair ---
+
+export const generateInitialExercisePair = async (
+  requestParams: unknown
+): Promise<InitialExercisePairResult> => {
+  // const actionStartTime = Date.now(); // Unused var
+  const headersList = await headers();
+  const ip = headersList.get('x-forwarded-for') || 'unknown';
+  const session: Session | null = await getServerSession(authOptions);
+  const userId = getDbUserIdFromSession(session);
+
+  const validationResult = validateRequestParams(requestParams); // Reuse existing validation
+  if (!validationResult.success) {
+    const errorMsg = `Invalid request parameters: ${validationResult.error.errors
+      .map((e: ZodIssue) => `${e.path.join('.')}: ${e.message}`)
+      .join(', ')}`;
+    return { quizzes: [], error: errorMsg }; // Return error in the new format
+  }
+  const validParams = validationResult.data;
+
+  // --- 2. Rate Limiting (Counts as one action call) ---
+  const isAllowed = checkRateLimit(ip);
+  if (!isAllowed) {
+    // Maybe try returning cached *pair*? For now, just deny.
+    return { quizzes: [], error: 'Rate limit exceeded.' };
+  }
+
+  // --- 3. Prepare Generation Params (Same for both calls) ---
+  const genParams: ExerciseGenerationParams = {
+    passageLanguage: validParams.passageLanguage,
+    questionLanguage: validParams.questionLanguage,
+    level: validParams.cefrLevel,
+    passageLangName: LANGUAGES[validParams.passageLanguage],
+    questionLangName: LANGUAGES[validParams.questionLanguage],
+    topic: getRandomTopicForLevel(validParams.cefrLevel),
+    grammarGuidance: getGrammarGuidance(validParams.cefrLevel),
+    vocabularyGuidance: getVocabularyGuidance(validParams.cefrLevel),
+  };
+  const genParams2 = { ...genParams, topic: getRandomTopicForLevel(validParams.cefrLevel) };
+
+  // --- 4. Concurrent Generation Attempt ---
+  let results: [GenerateExerciseResult, GenerateExerciseResult] | null = null;
+  let errorResult: { quizzes: []; error: string } | null = null;
+
+  try {
+    const generationPromises = [
+      getOrGenerateExercise(genParams, userId, 0),
+      getOrGenerateExercise(genParams2, userId, 0),
+    ];
+
+    const settledResults = await Promise.all(generationPromises);
+
+    if (settledResults.every((r) => r.error === null && r.quizId !== -1)) {
+      const validatedResults = z.array(GenerateExerciseResultSchema).safeParse(settledResults);
+      if (validatedResults.success) {
+        results = validatedResults.data as [GenerateExerciseResult, GenerateExerciseResult];
+      } else {
+        errorResult = { quizzes: [], error: 'Internal error processing generated results.' };
+      }
+    } else {
+      const errors = settledResults.map((r) => r.error).filter((e) => e !== null);
+      errorResult = {
+        quizzes: [],
+        error: `Failed to generate exercise pair: ${errors.join('; ')}`,
+      };
+    }
+  } catch (error) {
+    const message = error instanceof Error ? error.message : 'Unknown generation error';
+    errorResult = { quizzes: [], error: `Server error during generation: ${message}` };
+  }
+
+  // --- 5. Return Result ---
+  if (results) {
+    // console.log(`[Action:InitialPair] Successfully generated pair. Total time: ${Date.now() - actionStartTime}ms`); // Remove reference to unused var
+    return { quizzes: results, error: null };
+  } else {
+    // console.log(`[Action:InitialPair] Failed to generate pair. Total time: ${Date.now() - actionStartTime}ms`); // Remove reference to unused var
+    return errorResult ?? { quizzes: [], error: 'Unknown failure generating exercise pair.' };
+  }
+};
diff --git a/app/components/TextGenerator/Generator.test.tsx b/app/components/TextGenerator/Generator.test.tsx
@@ -2,6 +2,7 @@ import { render, screen, fireEvent } from '@testing-library/react';
 import { vi } from 'vitest';
 import Generator from './Generator';
 import React from 'react';
+import type { QuizData } from '@/lib/domain/schemas';
 
 vi.mock('next-auth/react', () => ({
   useSession: () => ({ status: 'authenticated' }),
@@ -11,7 +12,20 @@ vi.mock('react-i18next', () => ({
   useTranslation: () => ({ t: (key: string) => key }),
 }));
 
-const mockStore = {
+const mockStore: {
+  loading: boolean;
+  quizData: QuizData | null;
+  isAnswered: boolean;
+  generateText: any;
+  feedbackSubmitted: boolean;
+  submitFeedback: any;
+  nextQuizAvailable: boolean;
+  loadNextQuiz: any;
+  resetQuizWithNewData: any;
+  setNextQuizAvailable: any;
+  fetchInitialPair: any;
+  useHoverCredit: any;
+} = {
   loading: false,
   quizData: null,
   isAnswered: false,
@@ -20,6 +34,10 @@ const mockStore = {
   submitFeedback: vi.fn(),
   nextQuizAvailable: false,
   loadNextQuiz: vi.fn(),
+  resetQuizWithNewData: vi.fn(),
+  setNextQuizAvailable: vi.fn(),
+  fetchInitialPair: vi.fn(),
+  useHoverCredit: vi.fn(),
 };
 
 vi.mock('@/store/textGeneratorStore', () => ({
@@ -50,6 +68,10 @@ describe('Generator', () => {
       submitFeedback: vi.fn(),
       nextQuizAvailable: false,
       loadNextQuiz: vi.fn(),
+      resetQuizWithNewData: vi.fn(),
+      setNextQuizAvailable: vi.fn(),
+      fetchInitialPair: vi.fn(),
+      useHoverCredit: vi.fn(),
     });
   });
 
@@ -58,14 +80,20 @@ describe('Generator', () => {
     expect(screen.getByTestId('generate-button')).toBeInTheDocument();
   });
 
-  it('calls generateText when generate button clicked and no nextQuizAvailable', () => {
+  it('calls fetchInitialPair when generate button clicked and quizData is null', () => {
     render(<Generator />);
     fireEvent.click(screen.getByTestId('generate-button'));
-    expect(mockStore.generateText).toHaveBeenCalled();
+    expect(mockStore.fetchInitialPair).toHaveBeenCalled();
   });
 
-  it('calls loadNextQuiz when nextQuizAvailable is true', () => {
-    mockStore.nextQuizAvailable = true;
+  it('calls loadNextQuiz when quizData exists', () => {
+    mockStore.quizData = {
+      paragraph: 'mock paragraph',
+      question: 'mock question?',
+      options: { A: 'a', B: 'b', C: 'c', D: 'd' },
+    };
+    mockStore.isAnswered = true;
+    mockStore.feedbackSubmitted = true;
     render(<Generator />);
     fireEvent.click(screen.getByTestId('generate-button'));
     expect(mockStore.loadNextQuiz).toHaveBeenCalled();
diff --git a/app/components/TextGenerator/Generator.tsx b/app/components/TextGenerator/Generator.tsx
@@ -14,29 +14,13 @@ const Generator = () => {
     loading,
     quizData,
     isAnswered,
-    generateText,
     feedbackSubmitted,
     submitFeedback,
-    nextQuizAvailable,
     loadNextQuiz,
+    fetchInitialPair,
   } = useTextGeneratorStore();
   const contentContainerRef = useRef<HTMLDivElement>(null);
 
-  const generateTextHandler = useCallback(() => {
-    if (contentContainerRef.current) {
-      contentContainerRef.current.scrollIntoView({
-        behavior: 'smooth',
-        block: 'start',
-      });
-    }
-
-    if (nextQuizAvailable) {
-      loadNextQuiz();
-    } else {
-      void generateText();
-    }
-  }, [generateText, nextQuizAvailable, loadNextQuiz]);
-
   const handleFeedbackSubmit = useCallback(
     (is_good: boolean) => {
       if (contentContainerRef.current) {
@@ -99,7 +83,13 @@ const Generator = () => {
 
       {shouldOfferGeneration && (
         <button
-          onClick={generateTextHandler}
+          onClick={() => {
+            if (!quizData) {
+              void fetchInitialPair();
+            } else {
+              loadNextQuiz();
+            }
+          }}
           disabled={loading}
           data-testid="generate-button"
           className={`w-full px-6 py-3 border border-transparent rounded-md shadow-sm text-base font-medium text-white bg-gradient-to-r from-blue-600 via-indigo-600 to-green-600 hover:from-blue-700 hover:via-indigo-700 hover:to-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-900 focus:ring-cyan-500 transition duration-150 ease-in-out flex items-center justify-center ${loading ? 'opacity-75 cursor-not-allowed' : ''}`}
diff --git a/app/store/progressSlice.test.ts b/app/store/progressSlice.test.ts
@@ -105,6 +105,7 @@ const setupStore = () =>
       resetQuizWithNewData: vi.fn(),
       setNextQuizAvailable: vi.fn(),
       loadNextQuiz: vi.fn(),
+      fetchInitialPair: vi.fn(),
       useHoverCredit: vi.fn(),
       setQuizComplete: vi.fn(),
       goToNextQuestion: vi.fn(),
diff --git a/app/store/quizSlice.ts b/app/store/quizSlice.ts
@@ -1,13 +1,14 @@
 import type { StateCreator } from 'zustand';
 import { submitAnswer, submitFeedback } from '@/app/actions/progress';
-import { generateExerciseResponse } from '@/app/actions/exercise';
+import { generateExerciseResponse, generateInitialExercisePair } from '@/app/actions/exercise';
 import type { TextGeneratorState } from './textGeneratorStore';
 import type { CEFRLevel } from '@/lib/domain/language-guidance';
 import {} from '@/hooks/useLanguage';
 import {
   PartialQuizData,
   GenerateExerciseResultSchema,
   SubmitAnswerResultSchema,
+  InitialExercisePairResultSchema,
 } from '@/lib/domain/schemas';
 import type { BaseSlice } from './baseSlice';
 import { createBaseSlice } from './baseSlice';
@@ -49,6 +50,7 @@ export interface QuizSlice extends BaseSlice {
   resetQuizWithNewData: (newQuizData: PartialQuizData, quizId: number) => void;
   setNextQuizAvailable: (info: NextQuizInfo | null) => void;
   loadNextQuiz: () => void;
+  fetchInitialPair: () => Promise<void>;
 
   useHoverCredit: () => boolean;
 }
@@ -160,7 +162,80 @@ export const createQuizSlice: StateCreator<
     }
   },
 
+  fetchInitialPair: async (): Promise<void> => {
+    set({ loading: true, error: null, showContent: false });
+    get().stopPassageSpeech();
+    get().resetQuizState();
+
+    try {
+      const fetchParams = {
+        passageLanguage: get().passageLanguage,
+        questionLanguage: get().generatedQuestionLanguage,
+        cefrLevel: get().cefrLevel,
+      };
+
+      const rawResult = await generateInitialExercisePair(fetchParams);
+
+      const parseResult = InitialExercisePairResultSchema.safeParse(rawResult);
+
+      if (!parseResult.success) {
+        console.error(
+          '[Store] Zod validation error (fetchInitialPair):',
+          parseResult.error.format()
+        );
+        throw new Error(`Invalid API response structure: ${parseResult.error.message}`);
+      }
+
+      const result = parseResult.data;
+
+      if (result.error || result.quizzes.length !== 2) {
+        throw new Error(result.error || 'Invalid number of quizzes received');
+      }
+
+      const [quizInfo1, quizInfo2] = result.quizzes;
+
+      set((state) => {
+        state.quizData = quizInfo1.quizData;
+        state.currentQuizId = quizInfo1.quizId;
+        state.generatedPassageLanguage = fetchParams.passageLanguage;
+
+        state.selectedAnswer = null;
+        state.isAnswered = false;
+        state.relevantTextRange = null;
+        state.feedbackIsCorrect = null;
+        state.feedbackCorrectAnswer = null;
+        state.feedbackCorrectExplanation = null;
+        state.feedbackChosenIncorrectExplanation = null;
+        state.feedbackRelevantText = null;
+        state.showExplanation = false;
+        state.feedbackSubmitted = false;
+        state.hoverCreditsUsed = 0;
+
+        state.nextQuizAvailable = { quizData: quizInfo2.quizData, quizId: quizInfo2.quizId };
+
+        state.showQuestionSection = true;
+        state.showContent = true;
+        state.loading = false;
+        state.error = null;
+
+        console.log('[Store] Initial exercise pair fetched and processed.');
+      });
+    } catch (e) {
+      const errorMessage = e instanceof Error ? e.message : 'Unknown error fetching initial pair';
+      console.error('[Store] Error in fetchInitialPair:', e);
+      get().setError(errorMessage);
+      get().setShowContent(false);
+      set({ loading: false, nextQuizAvailable: null });
+    }
+  },
+
   generateText: async (isPrefetch = false): Promise<void> => {
+    if (!isPrefetch && get().nextQuizAvailable) {
+      console.log('[Store] Using pre-fetched quiz for generateText request.');
+      get().loadNextQuiz();
+      return;
+    }
+
     set({ loading: !isPrefetch, error: null });
     if (!isPrefetch) {
       get().stopPassageSpeech();
diff --git a/lib/ai/exercise-generator.ts b/lib/ai/exercise-generator.ts
@@ -27,7 +27,7 @@ export const generateAndValidateExercise = async (
   options: ExerciseGenerationOptions
 ): Promise<ExerciseContent> => {
   const prompt = generateExercisePrompt(options);
-  console.log('[AI:generateAndValidateExercise] Generated Prompt:\n', prompt);
+  //  console.log('[AI:generateAndValidateExercise] Generated Prompt:\n', prompt);
 
   let aiResponse: unknown;
   try {
diff --git a/lib/domain/schemas.ts b/lib/domain/schemas.ts
@@ -152,3 +152,11 @@ export const apiResponseSchema = z.object({
   result: z.string(),
 });
 export type ApiResponse = z.infer<typeof apiResponseSchema>;
+
+// Schema for the result of generating an initial pair of exercises
+export const InitialExercisePairResultSchema = z.object({
+  quizzes: z.array(GenerateExerciseResultSchema).length(2),
+  error: z.string().nullable(),
+});
+
+export type InitialExercisePairResult = z.infer<typeof InitialExercisePairResultSchema>;
