adding breadcrumbs

src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuizHeader.tsx

@@ -1,7 +1,6 @@
-import { useCourseContext } from "@/app/course/[courseName]/context/courseContext";
-import { getCourseUrl } from "@/services/urlUtils";
-import Link from "next/link";
+import { RightSingleChevron } from "@/components/icons/RightSingleChevron";
 import { UpdateQuizName } from "./UpdateQuizName";
+import { BreadCrumbs } from "@/components/BreadCrumbs";
 
 export default function EditQuizHeader({
   moduleName,
@@ -10,19 +9,18 @@ export default function EditQuizHeader({
   quizName: string;
   moduleName: string;
 }) {
-  const { courseName } = useCourseContext();
   return (
-    <div className="py-1 flex flex-row justify-start gap-3">
-      <Link
-        className="btn"
-        href={getCourseUrl(courseName)}
-        shallow={true}
-        prefetch={true}
-      >
-        {courseName}
-      </Link>
-      <UpdateQuizName quizName={quizName} moduleName={moduleName} />
-      <div>{quizName}</div>
+    <div className="py-1 flex flex-row justify-between">
+      <div className="flex flex-row">
+        <BreadCrumbs />
+        <span className="text-slate-500 cursor-default select-none my-auto">
+          <RightSingleChevron />
+        </span>
+        <div className="my-auto px-3">{quizName}</div>
+      </div>
+      <div className="px-1">
+        <UpdateQuizName quizName={quizName} moduleName={moduleName} />
+      </div>
     </div>
   );
 }