diff --git a/src/components/GenerateCourse/GenerateAICourse.tsx b/src/components/GenerateCourse/GenerateAICourse.tsx
index 5b889eac4..8687d7944 100644
--- a/src/components/GenerateCourse/GenerateAICourse.tsx
+++ b/src/components/GenerateCourse/GenerateAICourse.tsx
@@ -4,6 +4,9 @@ import { isLoggedIn } from '../../lib/jwt';
import { type AiCourse } from '../../lib/ai';
import { AICourseContent } from './AICourseContent';
import { generateCourse } from '../../helper/generate-ai-course';
+import { useQuery } from '@tanstack/react-query';
+import { getAiCourseOptions } from '../../queries/ai-course';
+import { queryClient } from '../../stores/query-client';
type GenerateAICourseProps = {};
@@ -23,6 +26,20 @@ export function GenerateAICourse(props: GenerateAICourseProps) {
done: [],
});
+ // Once the course is generated, we fetch the course from the database
+ // so that we get the up-to-date course data and also so that we
+ // can reload the changes (e.g. progress) etc using queryClient.setQueryData
+ const { data: aiCourse } = useQuery(
+ getAiCourseOptions({ aiCourseSlug: courseSlug }),
+ queryClient,
+ );
+
+ useEffect(() => {
+ if (aiCourse) {
+ setCourse(aiCourse);
+ }
+ }, [aiCourse]);
+
useEffect(() => {
if (term || difficulty) {
return;
diff --git a/src/components/Navigation/Navigation.astro b/src/components/Navigation/Navigation.astro
index 3ad861757..bebe897f9 100644
--- a/src/components/Navigation/Navigation.astro
+++ b/src/components/Navigation/Navigation.astro
@@ -20,12 +20,12 @@ import { CourseAnnouncement } from '../SQLCourse/CourseAnnouncement';