lots of hooks

nextjs/src/app/course/[courseName]/modules/ModuleList.tsx

@@ -1,14 +1,17 @@
 "use client";
+import { useModuleNamesQuery } from "@/hooks/localCourse/localCoursesHooks";
 import { useCourseContext } from "../context/courseContext";
 import ExpandableModule from "./ExpandableModule";
 
 export default function ModuleList() {
+  const { courseName } = useCourseContext();
+  const { data: moduleNames } = useModuleNamesQuery(courseName);
   return (
     <div>
       modules here
-      {/* {modules.map((m) => (
-        <ExpandableModule key={m.name} module={m} />
-      ))} */}
+      {moduleNames.map((m) => (
+        <ExpandableModule key={m} moduleName={m}/>
+      ))}
     </div>
   );
 }