Enable AI tutor

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;

src/components/Navigation/Navigation.astro

@@ -20,12 +20,12 @@ import { CourseAnnouncement } from '../SQLCourse/CourseAnnouncement';
         <Icon icon='logo' />
       </a>
 
-      <!-- <a
+      <a
         href='/ai-tutor'
         class='group relative inline text-gray-400 hover:text-white sm:hidden'
       >
         AI Tutor
-      </a> -->
+      </a>
 
       <!-- Desktop navigation items -->
       <div class='hidden gap-5 sm:flex sm:items-center'>
@@ -34,7 +34,7 @@ import { CourseAnnouncement } from '../SQLCourse/CourseAnnouncement';
           Start Here
         </a>
         <RoadmapDropdownMenu client:load />
-        <!-- <a
+        <a
           href='/ai-tutor'
           class='group relative mr-3 text-blue-300 hover:text-white'
         >
@@ -48,7 +48,7 @@ import { CourseAnnouncement } from '../SQLCourse/CourseAnnouncement';
               ></span>
             </span>
           </span>
-        </a> -->
+        </a>
         <a
           href='/teams'
           class='group relative hidden text-gray-400 hover:text-white xl:block'

src/queries/ai-course.ts

@@ -44,6 +44,7 @@ export function getAiCourseOptions(params: GetAICourseParams) {
         `/v1-get-ai-course/${params.aiCourseSlug}`,
       );
     },
+    enabled: !!params.aiCourseSlug,
   };
 }