got the middle scrolling correct

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

@@ -0,0 +1,11 @@
+import { LocalModule } from "@/models/local/localModules";
+import React from "react";
+
+export default function ExpandableModule({ module }: { module: LocalModule }) {
+  return (
+    <details>
+      <summary> {module.name}</summary>
+      expanded details
+    </details>
+  );
+}

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

@@ -0,0 +1,16 @@
+"use client";
+import { useCourseContext } from "../context/courseContext";
+import ExpandableModule from "./ExpandableModule";
+
+export default function ModuleList() {
+  const {
+    localCourse: { modules },
+  } = useCourseContext();
+  return (
+    <div>
+      {modules.map((m) => (
+        <ExpandableModule key={m.name} module={m} />
+      ))}
+    </div>
+  );
+}