diff --git a/app/courses/[courseId]/layout.tsx b/app/courses/[courseId]/layout.tsx
index c1d7f8a..905a9d5 100644
--- a/app/courses/[courseId]/layout.tsx
+++ b/app/courses/[courseId]/layout.tsx
@@ -1,6 +1,7 @@
 import { ReactNode } from "react";
 import Link from "next/link";
 import { getAuthUser } from "@/lib/auth";
+import CourseBreadcrumb from "@/components/navigation/CourseBreadCrumb";
 
 export default async function CourseLayout({
   children,
@@ -13,30 +14,20 @@ export default async function CourseLayout({
   const isAdmin = user?.organisation?.role === "admin";
   const { courseId } = await params;
 
-  const response = {
-    id: courseId,
-    name: "Sample Course",
-  };
   return (
     <div className="max-w-4xl mx-auto bg-white p-6 rounded shadow">
-      <nav className="text-sm mb-4">
-        <Link href="/courses" className="text-purple-600 hover:underline">
-          Go to All Courses
-        </Link>
-        {/* <span className="mx-2">/</span>
-        <span className="font-medium">{response.name}</span> */}
-      </nav>
+      <CourseBreadcrumb courseId={courseId} />
 
       {isAdmin && (
         <div className="text-right mb-6 space-x-2">
           <Link
-            href={`/courses/${response.id}/edit`}
+            href={`/courses/${courseId}/edit`}
             className="px-4 py-2 bg-purple-600 hover:bg-purple-700 text-white rounded"
           >
             Edit Course Details
           </Link>
           <Link
-            href={`/courses/${response.id}/modules/new`}
+            href={`/courses/${courseId}/modules/new`}
             className="px-4 py-2 bg-purple-600 hover:bg-purple-700 text-white rounded"
           >
             Add new module
diff --git a/app/courses/[courseId]/modules/[moduleId]/page.tsx b/app/courses/[courseId]/modules/[moduleId]/page.tsx
index 5c7337c..1b9ea3d 100644
--- a/app/courses/[courseId]/modules/[moduleId]/page.tsx
+++ b/app/courses/[courseId]/modules/[moduleId]/page.tsx
@@ -10,10 +10,16 @@ export default async function ModulePage({
   const user = await getAuthUser();
   const isAdmin = user?.organisation?.role === "admin";
   const { courseId, moduleId } = await params;
+  const isAiEnabled = user?.organisation?.ai_enabled;
 
   return (
     <div className="max-w-3xl mx-auto bg-white p-6 rounded">
-      <ModuleDetail courseId={courseId} moduleId={moduleId} isAdmin={isAdmin} />
+      <ModuleDetail
+        courseId={courseId}
+        moduleId={moduleId}
+        isAdmin={isAdmin}
+        isAiEnabled={isAiEnabled}
+      />
     </div>
   );
 }
diff --git a/app/page.tsx b/app/page.tsx
index 068fa2b..5cc3666 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -7,20 +7,54 @@ export default async function Home() {
   if (user) {
     redirect("/dashboard");
   }
+
   return (
     <div className="min-h-screen flex flex-col">
-      <div className="flex-1 flex flex-col items-center justify-center p-8 bg-white">
-        <h1 className="text-5xl font-bold text-purple-900 mb-6">SKILLSTACK</h1>
-        <div className="bg-purple-200 rounded-full px-6 py-2 mb-8">
-          <Link href="/auth" className="text-purple-800">
+      <div className="flex-1 flex flex-col items-center justify-center p-8">
+        <h1 className="text-5xl font-bold text-purple-900 mb-4">SKILLSTACK</h1>
+        <p className="text-xl text-gray-700 mb-6 text-center max-w-xl">
+          A corporate learning platform to organize courses for your team,
+          complete with AI chatbot support.
+        </p>
+        <div className="flex space-x-4 mb-10">
+          <Link
+            href="/auth"
+            className="px-6 py-3 bg-purple-600 hover:bg-purple-700 text-white rounded-lg shadow-md"
+          >
             Get Started
           </Link>
         </div>
 
-        <div className="grid grid-cols-2 gap-4 w-full max-w-2xl">
-          <div className="bg-gray-300 h-32"></div>
-          <div className="bg-gray-300 h-48"></div>
+        <div
+          id="features"
+          className="grid grid-cols-1 md:grid-cols-3 gap-6 w-full max-w-4xl"
+        >
+          <div className="flex flex-col items-center p-6 bg-white rounded-xl shadow-sm">
+            <h3 className="text-lg font-semibold mb-2">Course Management</h3>
+            <p className="text-center text-gray-600">
+              Create, organize, and assign courses tailored to your
+              organization’s needs.
+            </p>
+          </div>
+          <div className="flex flex-col items-center p-6 bg-white rounded-xl shadow-sm">
+            <h3 className="text-lg font-semibold mb-2">Employee Learning</h3>
+            <p className="text-center text-gray-600">
+              Empower employees with structured learning paths and progress
+              tracking.
+            </p>
+          </div>
+          <div className="flex flex-col items-center p-6 bg-white rounded-xl shadow-sm">
+            <h3 className="text-lg font-semibold mb-2">AI Chatbot Support</h3>
+            <p className="text-center text-gray-600">
+              Get instant help and guidance through our built-in AI chatbot
+              assistant.
+            </p>
+          </div>
         </div>
+
+        <p className="mt-8 text-center text-gray-500">
+          More features coming soon!
+        </p>
       </div>
     </div>
   );
diff --git a/app/roadmap/page.tsx b/app/roadmap/page.tsx
index 235de26..7ffd4fa 100644
--- a/app/roadmap/page.tsx
+++ b/app/roadmap/page.tsx
@@ -12,6 +12,12 @@ export default function RoadmapPage() {
   const [selectedRoadmap, setSelectedRoadmap] = useState<Roadmap | null>(null);
   const [loading, setLoading] = useState(true);
 
+  let isAiEnabled = user?.organisation?.ai_enabled;
+
+  if (isAiEnabled === undefined) {
+    isAiEnabled = false;
+  }
+
   if (!user || !user.hasCompletedOnboarding) {
     return null;
   }
@@ -137,6 +143,7 @@ export default function RoadmapPage() {
       onDelete={deleteRoadmap}
       onCreateNew={createNewRoadmap}
       onAutoGenerate={autoGenerateRoadmap}
+      isAiEnabled={isAiEnabled}
     />
   );
 }
diff --git a/components/SideNav.tsx b/components/SideNav.tsx
index dea1ddb..8bccf94 100644
--- a/components/SideNav.tsx
+++ b/components/SideNav.tsx
@@ -43,6 +43,8 @@ export default function SideNav() {
   const avatarUrl = `https://avatar.iran.liara.run/username?username=${firstName}+${lastName}&background=f4d9b2&color=FF9800`;
   const [imgSrc, setImgSrc] = useState(avatarUrl);
 
+  const isAiEnabled = user.organisation?.ai_enabled;
+
   return (
     <aside className="sticky top-0 w-64 h-screen bg-white border-r border-gray-200 flex flex-col justify-between overflow-y-auto">
       <div>
@@ -57,40 +59,45 @@ export default function SideNav() {
         </Link>
 
         <nav className="mt-6 px-4 space-y-6">
-          {menuSections.map((section) => (
-            <div key={section.heading}>
-              <p className="text-xs uppercase text-gray-400 tracking-wide px-2 mb-2">
-                {section.heading}
-              </p>
-              <ul className="space-y-1">
-                {section.items.map(({ label, href, icon: Icon }) => {
-                  const isActive = path === href;
-                  return (
-                    <li key={href}>
-                      <Link
-                        href={href}
-                        className={`flex items-center px-2 py-2 rounded-md transition-colors
-                          ${
-                            isActive
-                              ? "bg-purple-100 text-purple-700"
-                              : "text-gray-700 hover:bg-gray-100 hover:text-purple-600"
-                          }`}
-                      >
-                        <Icon
-                          className={`h-5 w-5 flex-shrink-0 ${
-                            isActive ? "text-purple-600" : "text-gray-400"
-                          }`}
-                        />
-                        <span className="ml-3 text-sm font-medium">
-                          {label}
-                        </span>
-                      </Link>
-                    </li>
-                  );
-                })}
-              </ul>
-            </div>
-          ))}
+          {menuSections.map((section) => {
+            const filteredItems = section.items.filter(
+              (item) => item.label !== "Chat History" || isAiEnabled
+            );
+            return (
+              <div key={section.heading}>
+                <p className="text-xs uppercase text-gray-400 tracking-wide px-2 mb-2">
+                  {section.heading}
+                </p>
+                <ul className="space-y-1">
+                  {filteredItems.map(({ label, href, icon: Icon }) => {
+                    const isActive = path === href;
+                    return (
+                      <li key={href}>
+                        <Link
+                          href={href}
+                          className={`flex items-center px-2 py-2 rounded-md transition-colors
+                            ${
+                              isActive
+                                ? "bg-purple-100 text-purple-700"
+                                : "text-gray-700 hover:bg-gray-100 hover:text-purple-600"
+                            }`}
+                        >
+                          <Icon
+                            className={`h-5 w-5 flex-shrink-0 {
+                              isActive ? "text-purple-600" : "text-gray-400"
+                            }`}
+                          />
+                          <span className="ml-3 text-sm font-medium">
+                            {label}
+                          </span>
+                        </Link>
+                      </li>
+                    );
+                  })}
+                </ul>
+              </div>
+            );
+          })}
         </nav>
       </div>
 
diff --git a/components/auth/signup/SignupForm.tsx b/components/auth/signup/SignupForm.tsx
index 055e5c4..12d03d2 100644
--- a/components/auth/signup/SignupForm.tsx
+++ b/components/auth/signup/SignupForm.tsx
@@ -22,6 +22,11 @@ export default function SignupForm() {
       setError("Passwords do not match");
       return;
     }
+
+    if (password.length < 8) {
+      setError("Password must be at least 8 characters long");
+      return;
+    }
     setLoading(true);
     try {
       const res = await fetch("/api/signup", {
@@ -119,6 +124,9 @@ export default function SignupForm() {
             className="w-full border border-gray-300 rounded-md p-2 focus:ring-2 focus:ring-purple-300 focus:border-purple-500 outline-none transition-all"
             required
           />
+          <p className="text-xs text-gray-500 mt-1">
+            Password must be at least 8 characters long
+          </p>
         </div>
 
         <div>
diff --git a/components/chatbot/ChatHistory.tsx b/components/chatbot/ChatHistory.tsx
index 23c40e5..14ac191 100644
--- a/components/chatbot/ChatHistory.tsx
+++ b/components/chatbot/ChatHistory.tsx
@@ -52,35 +52,68 @@ function groupLogsByModule(logs: ChatLog[]) {
 export default function ChatHistoryPage() {
   const [logs, setLogs] = useState<ChatLog[]>([]);
   const [openPanels, setOpenPanels] = useState<Record<string, boolean>>({});
+  const [clearError, setClearError] = useState<string | null>(null);
 
   useEffect(() => {
-    const fetchLogs = async () => {
-      try {
-        const res = await fetch("/api/chatbot/history", {
-          credentials: "include",
-        });
-        const data = await res.json();
-        if (data.success && Array.isArray(data.logs)) {
-          setLogs(data.logs);
-          if (data.logs.length > 0) {
-            const mostRecent = data.logs[0];
-            setOpenPanels({
-              [`${mostRecent.course_id}:${mostRecent.module_id}`]: true,
-            });
-          }
+    fetchHistory();
+  }, []);
+
+  async function fetchHistory() {
+    try {
+      const res = await fetch("/api/chatbot/history", {
+        credentials: "include",
+      });
+      const data = await res.json();
+      if (data.success && Array.isArray(data.logs)) {
+        setLogs(data.logs);
+        if (data.logs.length > 0) {
+          const mostRecent = data.logs[0];
+          setOpenPanels({
+            [`${mostRecent.course_id}:${mostRecent.module_id}`]: true,
+          });
         }
-      } catch (err) {
-        // Ignore errors in loading logs
       }
-    };
-    fetchLogs();
-  }, []);
+    } catch {
+      // ignore load errors
+    }
+  }
+
+  async function doDelete(url: string, body?: object) {
+    setClearError(null);
+    try {
+      const res = await fetch(url, {
+        method: "DELETE",
+        credentials: "include",
+        headers: { "Content-Type": "application/json" },
+        body: body ? JSON.stringify(body) : undefined,
+      });
+      if (!res.ok) throw new Error("Failed to clear logs");
+      await fetchHistory();
+    } catch (err: any) {
+      setClearError(err.message || "Failed to clear logs");
+    }
+  }
 
   const grouped = groupLogsByModule(logs);
 
   return (
     <div className="bg-gray-50 border rounded-xl p-5 shadow">
-      <h3 className="font-bold text-lg mb-4">Your Chatbot Q&A History</h3>
+      <div className="flex justify-between items-center mb-4">
+        <h3 className="font-bold text-lg">Your Chatbot Q&A History</h3>
+        <button
+          onClick={() => {
+            if (!confirm("Clear all chat history?")) return;
+            doDelete("/api/chatbot/all-logs");
+          }}
+          className="text-sm text-red-600 hover:underline"
+        >
+          Clear all chat history
+        </button>
+      </div>
+      {clearError && (
+        <div className="text-red-500 text-xs mb-2">{clearError}</div>
+      )}
+
       {logs.length === 0 ? (
         <div className="text-gray-400 text-sm">No questions asked yet!</div>
       ) : (
@@ -90,49 +123,69 @@ export default function ChatHistoryPage() {
             const isOpen = openPanels[panelKey] || false;
             return (
               <div key={panelKey} className="border rounded bg-white">
-                {/* Panel header */}
-                <button
-                  className={`w-full text-left flex items-center justify-between px-4 py-3 cursor-pointer select-none ${
-                    isOpen ? "bg-purple-50" : "bg-gray-100"
-                  }`}
-                  onClick={() =>
-                    setOpenPanels((prev) => ({
-                      ...prev,
-                      [panelKey]: !prev[panelKey],
-                    }))
-                  }
-                >
-                  <span className="flex flex-col gap-1">
-                    <span>
-                      <Link
-                        href={`/courses/${mod.course_id}`}
-                        className="font-semibold text-purple-800 hover:underline"
-                        onClick={(e) => e.stopPropagation()}
-                      >
-                        {mod.course}
-                      </Link>
-                      <span className="text-gray-400 px-1">/</span>
-                      <Link
-                        href={`/courses/${mod.course_id}/modules/${mod.module_id}`}
-                        className="italic text-blue-700 hover:underline"
-                        onClick={(e) => e.stopPropagation()}
-                      >
-                        {mod.module}
-                      </Link>
-                    </span>
-                    <span className="text-xs text-gray-500">
-                      {mod.logs.length}{" "}
-                      {mod.logs.length === 1 ? "question" : "questions"}
+                <div className="flex items-center justify-between px-4 py-3">
+                  <button
+                    className={`flex-1 text-left cursor-pointer select-none $
+                      isOpen ? "bg-purple-50" : "bg-gray-100"
+                    }`}
+                    onClick={() =>
+                      setOpenPanels((prev) => ({
+                        ...prev,
+                        [panelKey]: !prev[panelKey],
+                      }))
+                    }
+                  >
+                    <span className="flex flex-col gap-1">
+                      <span>
+                        <Link
+                          href={`/courses/${mod.course_id}`}
+                          className="font-semibold text-purple-800 hover:underline"
+                          onClick={(e) => e.stopPropagation()}
+                        >
+                          {mod.course}
+                        </Link>
+                        <span className="text-gray-400 px-1">/</span>
+                        <Link
+                          href={`/courses/${mod.course_id}/modules/${mod.module_id}`}
+                          className="italic text-blue-700 hover:underline"
+                          onClick={(e) => e.stopPropagation()}
+                        >
+                          {mod.module}
+                        </Link>
+                      </span>
+                      <span className="text-xs text-gray-500">
+                        {mod.logs.length}{" "}
+                        {mod.logs.length === 1 ? "question" : "questions"}
+                      </span>
                     </span>
-                  </span>
-                  <span className="text-xs text-gray-600">
-                    {isOpen ? "▼" : "▶"}
-                  </span>
-                </button>
+                  </button>
+                  <button
+                    onClick={() => {
+                      if (!confirm("Clear history for this module?")) return;
+                      doDelete("/api/chatbot/module-log", {
+                        moduleId: mod.module_id,
+                      });
+                    }}
+                    className="text-xs text-red-600 hover:underline ml-2"
+                  >
+                    Clear module chat history
+                  </button>
+                  <button
+                    onClick={() => {
+                      if (!confirm("Clear history for this course?")) return;
+                      doDelete("/api/chatbot/course-log", {
+                        courseId: mod.course_id,
+                      });
+                    }}
+                    className="text-xs text-red-600 hover:underline ml-2"
+                  >
+                    Clear course chat history
+                  </button>
+                </div>
 
                 {isOpen && (
                   <div className="divide-y">
-                    {mod.logs.map((log, i) => (
+                    {mod.logs.map((log) => (
                       <div key={log.id} className="p-4 space-y-2">
                         <div className="flex items-center gap-2 text-xs text-gray-400">
                           <span>{formatDate(log.created_at)}</span>
diff --git a/components/chatbot/ModuleChatBot.tsx b/components/chatbot/ModuleChatBot.tsx
index 5904854..a9cdae1 100644
--- a/components/chatbot/ModuleChatBot.tsx
+++ b/components/chatbot/ModuleChatBot.tsx
@@ -16,11 +16,11 @@ export default function ModuleChatbot({
   isEnrolled,
 }: ModuleChatbotProps) {
   const [question, setQuestion] = useState("");
-  const [chat, setChat] = useState<
-    { type: "user" | "assistant"; content: string }[]
-  >([]);
+  const [chat, setChat] = useState<ChatMessage[]>([]);
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
+  const [clearing, setClearing] = useState(false);
+  const [clearError, setClearError] = useState<string | null>(null);
 
   if (!isEnrolled) {
     return null;
@@ -46,12 +46,12 @@ export default function ModuleChatbot({
             });
           setChat(logMessages);
         }
-      } catch (err) {
-        // Ignore errors in loading logs
+      } catch {
+        // Ignore load errors
       }
     };
     fetchLogs();
-  }, []);
+  }, [courseId, moduleId]);
 
   const sendQuestion = async (e: React.FormEvent) => {
     e.preventDefault();
@@ -70,7 +70,7 @@ export default function ModuleChatbot({
       });
       const data = await res.json();
 
-      if (data?.success && data.answer) {
+      if (data.success && data.answer) {
         setChat((prev) => [
           ...prev,
           { type: "assistant", content: data.answer },
@@ -78,17 +78,47 @@ export default function ModuleChatbot({
       } else {
         setError(data.message || "Something went wrong.");
       }
-    } catch (err: any) {
+    } catch {
       setError("Failed to get response. Please try again.");
     }
     setLoading(false);
     setQuestion("");
   };
 
+  const clearHistory = async () => {
+    if (!confirm("Clear all chat history for this module?")) return;
+    setClearError(null);
+    setClearing(true);
+    try {
+      const res = await fetch("/api/chatbot/module-log", {
+        method: "DELETE",
+        credentials: "include",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ moduleId }),
+      });
+      if (!res.ok) throw new Error("Failed to clear history");
+      setChat([]);
+    } catch (err: any) {
+      setClearError(err.message || "Could not clear history.");
+    }
+    setClearing(false);
+  };
+
   return (
     <div className="bg-gray-50 border rounded-xl p-5 shadow">
-      <h3 className="font-bold text-lg mb-2">Module Assistant</h3>
-      <div>Note: Bot does not have access to course materials.</div>
+      <div className="flex justify-between items-center mb-2">
+        <h3 className="font-bold text-lg">Module Assistant</h3>
+        <button
+          onClick={clearHistory}
+          disabled={clearing}
+          className="text-sm text-red-600 hover:underline disabled:opacity-50"
+        >
+          {clearing ? "Clearing..." : "Clear History"}
+        </button>
+      </div>
+      <div className="text-xs text-gray-500 mb-2">
+        Note: Bot does not have access to course materials.
+      </div>
       <div className="min-h-[120px] max-h-60 overflow-y-auto flex flex-col gap-3 mb-4">
         {chat.length === 0 && (
           <div className="text-gray-400 text-sm">
@@ -115,6 +145,9 @@ export default function ModuleChatbot({
           <div className="text-gray-400 text-xs">Assistant is typing…</div>
         )}
       </div>
+      {clearError && (
+        <div className="text-red-500 text-xs mb-2">{clearError}</div>
+      )}
       {error && <div className="text-red-500 text-xs mb-2">{error}</div>}
       <form onSubmit={sendQuestion} className="flex gap-2">
         <input
diff --git a/components/extra b/components/extra
new file mode 100644
index 0000000..70b0645
--- /dev/null
+++ b/components/extra
@@ -0,0 +1,119 @@
+"use client";
+
+import Image from "next/image";
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { useState } from "react";
+import {
+  HomeIcon,
+  BookOpenIcon,
+  ChartBarIcon,
+  MapIcon,
+  ClockIcon,
+  CogIcon,
+} from "@heroicons/react/24/outline";
+import LogoutButton from "./auth/logout/LogoutButton";
+import { useAuth } from "@/context/AuthContext";
+
+const menuSections = [
+  {
+    heading: "General",
+    items: [
+      { label: "Dashboard", href: "/dashboard", icon: HomeIcon },
+      { label: "My Roadmap", href: "/roadmap", icon: MapIcon },
+      { label: "Courses", href: "/courses", icon: BookOpenIcon },
+      { label: "Reports", href: "/reports", icon: ChartBarIcon },
+    ],
+  },
+  {
+    heading: "Management",
+    items: [
+      // Chat History will be conditionally filtered
+      { label: "Chat History", href: "/chathistory", icon: ClockIcon },
+      { label: "History", href: "/history", icon: ClockIcon },
+      { label: "Settings", href: "/settings", icon: CogIcon },
+    ],
+  },
+];
+
+export default function SideNav() {
+  const path = usePathname();
+  const { user } = useAuth();
+  const firstName = user.firstname || user.email;
+  const lastName = user.lastname || user.email;
+  const avatarUrl = `https://avatar.iran.liara.run/username?username=${firstName}+${lastName}&background=f4d9b2&color=FF9800`;
+  const [imgSrc, setImgSrc] = useState(avatarUrl);
+
+  const isAiEnabled = user.organisation?.ai_enabled;
+
+  return (
+    <aside className="sticky top-0 w-64 h-screen bg-white border-r border-gray-200 flex flex-col justify-between overflow-y-auto">
+      <div>
+        <Link
+          href="/"
+          className="flex items-center px-6 py-4 hover:bg-gray-50 transition-colors"
+        >
+          <Image src="/logo.svg" alt="SkillStack Logo" width={28} height={28} />
+          <span className="ml-2 text-purple-800 font-semibold text-lg">
+            SKILLSTACK
+          </span>
+        </Link>
+
+        <nav className="mt-6 px-4 space-y-6">
+          {menuSections.map((section) => {
+            // Filter out Chat History if AI is disabled
+            const filteredItems = section.items.filter(
+              (item) => item.label !== "Chat History" || isAiEnabled
+            );
+            return (
+              <div key={section.heading}>
+                <p className="text-xs uppercase text-gray-400 tracking-wide px-2 mb-2">
+                  {section.heading}
+                </p>
+                <ul className="space-y-1">
+                  {filteredItems.map(({ label, href, icon: Icon }) => {
+                    const isActive = path === href;
+                    return (
+                      <li key={href}>
+                        <Link
+                          href={href}
+                          className={`flex items-center px-2 py-2 rounded-md transition-colors
+                            ${
+                              isActive
+                                ? "bg-purple-100 text-purple-700"
+                                : "text-gray-700 hover:bg-gray-100 hover:text-purple-600"
+                            }`}
+                        >
+                          <Icon
+                            className={`h-5 w-5 flex-shrink-0 {
+                              isActive ? "text-purple-600" : "text-gray-400"
+                            }`}
+                          />
+                          <span className="ml-3 text-sm font-medium">
+                            {label}
+                          </span>
+                        </Link>
+                      </li>
+                    );
+                  })}
+                </ul>
+              </div>
+            );
+          })}
+        </nav>
+      </div>
+
+      <div className="px-6 py-4 flex flex-col items-center space-y-3">
+        <Image
+          src={imgSrc}
+          alt="Your avatar"
+          width={40}
+          height={40}
+          className="rounded-full"
+          onError={() => setImgSrc("/avatar-placeholder.jpg")}
+        />
+        <LogoutButton />
+      </div>
+    </aside>
+  );
+}
diff --git a/components/navigation/CourseBreadCrumb.tsx b/components/navigation/CourseBreadCrumb.tsx
new file mode 100644
index 0000000..f051958
--- /dev/null
+++ b/components/navigation/CourseBreadCrumb.tsx
@@ -0,0 +1,29 @@
+"use client";
+
+import { usePathname } from "next/navigation";
+import Link from "next/link";
+
+export default function CourseBreadcrumb({ courseId }: { courseId: string }) {
+  const pathname = usePathname();
+
+  if (!pathname) return null;
+
+  let linkHref = "/courses";
+  let label = "Go to All Courses";
+
+  if (pathname.includes(`/courses/${courseId}/modules/`)) {
+    linkHref = `/courses/${courseId}`;
+    label = "← Back to Modules";
+  } else if (pathname.includes(`/courses/${courseId}`)) {
+    linkHref = "/courses";
+    label = "← Back to Courses";
+  }
+
+  return (
+    <div className="mb-4 text-sm">
+      <Link href={linkHref} className="text-purple-600 hover:underline">
+        {label}
+      </Link>
+    </div>
+  );
+}
diff --git a/components/organisation/OrgNav.tsx b/components/organisation/OrgNav.tsx
index fb8490a..f2fb059 100644
--- a/components/organisation/OrgNav.tsx
+++ b/components/organisation/OrgNav.tsx
@@ -44,6 +44,8 @@ export default function OrgNav() {
   const avatarUrl = `https://avatar.iran.liara.run/username?username=${firstName}+${lastName}&background=f4d9b2&color=FF9800`;
   const [imgSrc, setImgSrc] = useState(avatarUrl);
 
+  const isAiEnabled = user.organisation?.ai_enabled;
+
   return (
     <aside className="sticky top-0 w-64 h-screen bg-white border-r border-gray-200 flex flex-col justify-between overflow-y-auto">
       <div>
@@ -58,40 +60,45 @@ export default function OrgNav() {
         </Link>
 
         <nav className="mt-6 px-4 space-y-6">
-          {menuSections.map((section) => (
-            <div key={section.heading}>
-              <p className="text-xs uppercase text-gray-400 tracking-wide px-2 mb-2">
-                {section.heading}
-              </p>
-              <ul className="space-y-1">
-                {section.items.map(({ label, href, icon: Icon }) => {
-                  const isActive = path === href;
-                  return (
-                    <li key={href}>
-                      <Link
-                        href={href}
-                        className={`flex items-center px-2 py-2 rounded-md transition-colors
-                          ${
-                            isActive
-                              ? "bg-purple-100 text-purple-700"
-                              : "text-gray-700 hover:bg-gray-100 hover:text-purple-600"
-                          }`}
-                      >
-                        <Icon
-                          className={`h-5 w-5 flex-shrink-0 ${
-                            isActive ? "text-purple-600" : "text-gray-400"
-                          }`}
-                        />
-                        <span className="ml-3 text-sm font-medium">
-                          {label}
-                        </span>
-                      </Link>
-                    </li>
-                  );
-                })}
-              </ul>
-            </div>
-          ))}
+          {menuSections.map((section) => {
+            const filteredItems = section.items.filter(
+              (item) => item.label !== "Chat History" || isAiEnabled
+            );
+            return (
+              <div key={section.heading}>
+                <p className="text-xs uppercase text-gray-400 tracking-wide px-2 mb-2">
+                  {section.heading}
+                </p>
+                <ul className="space-y-1">
+                  {filteredItems.map(({ label, href, icon: Icon }) => {
+                    const isActive = path === href;
+                    return (
+                      <li key={href}>
+                        <Link
+                          href={href}
+                          className={`flex items-center px-2 py-2 rounded-md transition-colors
+                            ${
+                              isActive
+                                ? "bg-purple-100 text-purple-700"
+                                : "text-gray-700 hover:bg-gray-100 hover:text-purple-600"
+                            }`}
+                        >
+                          <Icon
+                            className={`h-5 w-5 flex-shrink-0 {
+                              isActive ? "text-purple-600" : "text-gray-400"
+                            }`}
+                          />
+                          <span className="ml-3 text-sm font-medium">
+                            {label}
+                          </span>
+                        </Link>
+                      </li>
+                    );
+                  })}
+                </ul>
+              </div>
+            );
+          })}
         </nav>
       </div>
 
diff --git a/components/organisation/courses/ModuleDetail.tsx b/components/organisation/courses/ModuleDetail.tsx
index 3dd02bc..18b2695 100644
--- a/components/organisation/courses/ModuleDetail.tsx
+++ b/components/organisation/courses/ModuleDetail.tsx
@@ -34,9 +34,15 @@ interface Props {
   courseId: string;
   moduleId: string;
   isAdmin: boolean;
+  isAiEnabled: boolean;
 }
 
-export default function ModuleDetail({ courseId, moduleId, isAdmin }: Props) {
+export default function ModuleDetail({
+  courseId,
+  moduleId,
+  isAdmin,
+  isAiEnabled,
+}: Props) {
   const [data, setData] = React.useState<ModuleDetailData | null>(null);
   const [enrolled, setEnrolled] = React.useState<boolean>(false);
   const [answers, setAnswers] = useState<Record<number, number | number[]>>({});
@@ -247,11 +253,13 @@ export default function ModuleDetail({ courseId, moduleId, isAdmin }: Props) {
           )}
         </div>
         <div className="mt-8">
-          <ModuleChatBot
-            courseId={courseId}
-            moduleId={moduleId}
-            isEnrolled={enrolled}
-          />
+          {isAiEnabled && (
+            <ModuleChatBot
+              courseId={courseId}
+              moduleId={moduleId}
+              isEnrolled={enrolled}
+            />
+          )}
         </div>
       </div>
     );
@@ -329,9 +337,9 @@ export default function ModuleDetail({ courseId, moduleId, isAdmin }: Props) {
     return (
       <div className="space-y-6">
         <h2 className="text-3xl font-bold">{data.title} — Results</h2>
-        {results.map((r) => (
+        {results.map((r, index) => (
           <div key={r.questionId} className="p-4 border rounded space-y-2">
-            <p className="font-medium">Question {r.questionId}</p>
+            <p className="font-medium">Question {index + 1}</p>
             <p>
               Your answers:&nbsp;
               {r.selectedOptions.map((o) => o.text).join(", ")}
@@ -370,14 +378,16 @@ export default function ModuleDetail({ courseId, moduleId, isAdmin }: Props) {
           answers will be lost
         </p>
       )}
-      {quiz?.questions.map((q) => (
+      {quiz?.questions.map((q, index) => (
         <div key={q.id} className="space-y-2">
-          <p className="font-medium">{q.question_text}</p>
+          <p className="font-medium">
+            {index + 1}. {q.question_text}
+          </p>
           {q.options.map((opt) => (
             <label key={opt.id} className="flex items-center space-x-2">
               <input
                 type={q.question_type === "true_false" ? "radio" : "checkbox"}
-                name={`q-${q.id}`}
+                name={`q-${index + 1}`}
                 value={opt.id}
                 checked={
                   q.question_type === "true_false"
diff --git a/components/organisation/settings/OrgSettings.tsx b/components/organisation/settings/OrgSettings.tsx
index 6079f43..c199a08 100644
--- a/components/organisation/settings/OrgSettings.tsx
+++ b/components/organisation/settings/OrgSettings.tsx
@@ -72,11 +72,18 @@ export default function OrgSettings() {
         }),
       });
       if (!res.ok) throw new Error("Failed to save settings");
-      setName(name);
-      setDescription(description);
-      setAiEnabled(aiEnabled);
+      // setName(name);
+      // setDescription(description);
+      // setAiEnabled(aiEnabled);
       setError(null);
       setMessage("Settings saved successfully");
+      setInitialData({
+        id: organisationId,
+        organisation_name: name,
+        description,
+        ai_enabled: aiEnabled,
+      });
+      window.location.reload();
     } catch (err: any) {
       setError(err.message || "Failed to save settings");
       setMessage(null);
diff --git a/components/roadmap/RoadmapEditor.tsx b/components/roadmap/RoadmapEditor.tsx
index 86dc052..ffb2b61 100644
--- a/components/roadmap/RoadmapEditor.tsx
+++ b/components/roadmap/RoadmapEditor.tsx
@@ -14,16 +14,17 @@ export default function RoadmapEditor({ roadmap, onBack, onUpdate }: Props) {
   const [roadmapName, setRoadmapName] = useState(roadmap.name);
   const [items, setItems] = useState<RoadmapItem[]>([]);
   const [availableModules, setAvailableModules] = useState<Module[]>([]);
-  const [channelRecommendations, setChannelRecommendations] = useState<{[key: string]: Module[]}>({});
+  // const [channelRecommendations, setChannelRecommendations] = useState<{[key: string]: Module[]}>({});
   const [loading, setLoading] = useState(true);
   const [saving, setSaving] = useState(false);
   const [showModuleSelector, setShowModuleSelector] = useState(false);
-  const [showChannelRecommendations, setShowChannelRecommendations] = useState(false);
+  // const [showChannelRecommendations, setShowChannelRecommendations] =
+  // useState(false);
 
   useEffect(() => {
     fetchRoadmapItems();
     fetchAvailableModules();
-    fetchChannelRecommendations();
+    // fetchChannelRecommendations();
   }, [roadmap.id]);
 
   const fetchRoadmapItems = async () => {
@@ -78,44 +79,44 @@ export default function RoadmapEditor({ roadmap, onBack, onUpdate }: Props) {
     }
   };
 
-  const fetchChannelRecommendations = async () => {
-    try {
-      const response = await fetch("/api/materials/by-user-skills", {
-        credentials: "include",
-      });
-      
-      if (response.ok) {
-        const data = await response.json();
-        const modules = data.materials || [];
-        
-        // Group modules by channel
-        const groupedByChannel: {[key: string]: Module[]} = {};
-        
-        modules.forEach((module: Module) => {
-          if (module.channel) {
-            const channelName = module.channel.name;
-            if (!groupedByChannel[channelName]) {
-              groupedByChannel[channelName] = [];
-            }
-            groupedByChannel[channelName].push(module);
-          }
-        });
-        
-        // Sort channels by number of modules and limit to top 3 modules per channel
-        const sortedChannels: {[key: string]: Module[]} = {};
-        Object.entries(groupedByChannel)
-          .sort(([,a], [,b]) => b.length - a.length)
-          .forEach(([channel, modules]) => {
-            sortedChannels[channel] = modules.slice(0, 3);
-          });
-        
-        setChannelRecommendations(sortedChannels);
-      }
-    } catch (error) {
-      console.error("Failed to fetch channel recommendations:", error);
-      setChannelRecommendations({});
-    }
-  };
+  // const fetchChannelRecommendations = async () => {
+  //   try {
+  //     const response = await fetch("/api/materials/by-user-skills", {
+  //       credentials: "include",
+  //     });
+
+  //     if (response.ok) {
+  //       const data = await response.json();
+  //       const modules = data.materials || [];
+
+  //       // Group modules by channel
+  //       const groupedByChannel: { [key: string]: Module[] } = {};
+
+  //       modules.forEach((module: Module) => {
+  //         if (module.channel) {
+  //           const channelName = module.channel.name;
+  //           if (!groupedByChannel[channelName]) {
+  //             groupedByChannel[channelName] = [];
+  //           }
+  //           groupedByChannel[channelName].push(module);
+  //         }
+  //       });
+
+  //       // Sort channels by number of modules and limit to top 3 modules per channel
+  //       const sortedChannels: { [key: string]: Module[] } = {};
+  //       Object.entries(groupedByChannel)
+  //         .sort(([, a], [, b]) => b.length - a.length)
+  //         .forEach(([channel, modules]) => {
+  //           sortedChannels[channel] = modules.slice(0, 3);
+  //         });
+
+  //       setChannelRecommendations(sortedChannels);
+  //     }
+  //   } catch (error) {
+  //     console.error("Failed to fetch channel recommendations:", error);
+  //     setChannelRecommendations({});
+  //   }
+  // };
 
   const updateRoadmapName = async () => {
     if (roadmapName.trim() === roadmap.name) return;
@@ -239,7 +240,7 @@ export default function RoadmapEditor({ roadmap, onBack, onUpdate }: Props) {
         <div className="flex justify-between items-center mb-4">
           <h3 className="text-lg font-medium">Learning Modules</h3>
           <div className="space-x-2">
-            <button
+            {/* <button
               onClick={() => setShowChannelRecommendations(true)}
               className="px-3 py-2 bg-purple-600 hover:bg-purple-700 text-white rounded text-sm"
               title="View channel-based recommendations"
@@ -252,7 +253,7 @@ export default function RoadmapEditor({ roadmap, onBack, onUpdate }: Props) {
               title="Refresh enrollment status"
             >
               🔄 Refresh
-            </button>
+            </button> */}
             <button
               onClick={() => setShowModuleSelector(true)}
               className="px-4 py-2 bg-green-600 hover:bg-green-700 text-white rounded"
@@ -295,7 +296,7 @@ export default function RoadmapEditor({ roadmap, onBack, onUpdate }: Props) {
                     <span className="text-sm font-medium text-gray-500">
                       #{index + 1}
                     </span>
-                    <div className="flex-1">
+                    <div className="flex-1 space-y-2">
                       <div className="flex items-center space-x-2">
                         <h4 className="font-medium">{item.module_title}</h4>
                         {isAccessible ? (
@@ -335,7 +336,9 @@ export default function RoadmapEditor({ roadmap, onBack, onUpdate }: Props) {
                         )}
                       </div>
                       <div className="flex items-center space-x-2 text-sm text-gray-600">
-                        <span>{item.course_name} • {item.module_type}</span>
+                        <span>
+                          {item.course_name} • {item.module_type}
+                        </span>
                         {(item.channel || item.level) && (
                           <div className="flex gap-1">
                             {item.channel && (
@@ -445,7 +448,9 @@ export default function RoadmapEditor({ roadmap, onBack, onUpdate }: Props) {
                             )}
                           </div>
                           <div className="flex items-center space-x-2 text-sm text-gray-600">
-                            <span>{module.course_name} • {module.module_type}</span>
+                            <span>
+                              {module.course_name} • {module.module_type}
+                            </span>
                             {(module.channel || module.level) && (
                               <div className="flex gap-1">
                                 {module.channel && (
@@ -469,8 +474,9 @@ export default function RoadmapEditor({ roadmap, onBack, onUpdate }: Props) {
                           {module.skills && (
                             <p className="text-xs text-gray-500 mt-1">
                               Skills:{" "}
-                              {module.skills.filter((skill) => skill).join(", ") ||
-                                "None"}
+                              {module.skills
+                                .filter((skill) => skill)
+                                .join(", ") || "None"}
                             </p>
                           )}
                         </div>
@@ -489,11 +495,13 @@ export default function RoadmapEditor({ roadmap, onBack, onUpdate }: Props) {
         </div>
       )}
 
-      {showChannelRecommendations && (
+      {/* {showChannelRecommendations && (
         <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
           <div className="bg-white rounded-lg p-6 max-w-4xl w-full max-h-96 overflow-y-auto">
             <div className="flex justify-between items-center mb-4">
-              <h3 className="text-lg font-medium">Channel-Based Recommendations</h3>
+              <h3 className="text-lg font-medium">
+                Channel-Based Recommendations
+              </h3>
               <button
                 onClick={() => setShowChannelRecommendations(false)}
                 className="text-gray-500 hover:text-gray-700"
@@ -503,71 +511,90 @@ export default function RoadmapEditor({ roadmap, onBack, onUpdate }: Props) {
             </div>
 
             {Object.keys(channelRecommendations).length === 0 ? (
-              <p className="text-gray-600">No channel-based recommendations available.</p>
+              <p className="text-gray-600">
+                No channel-based recommendations available.
+              </p>
             ) : (
               <div className="space-y-6">
-                {Object.entries(channelRecommendations).map(([channelName, modules]) => (
-                  <div key={channelName} className="border rounded-lg p-4">
-                    <h4 className="font-medium mb-3 flex items-center">
-                      <span className="inline-flex items-center bg-blue-100 text-blue-800 px-2 py-1 rounded-full text-sm font-medium mr-2">
-                        {channelName}
-                      </span>
-                      <span className="text-sm text-gray-600">({modules.length} modules)</span>
-                    </h4>
-                    <div className="space-y-2">
-                      {modules
-                        .filter(module => !items.some(item => item.module_id === module.id))
-                        .map(module => (
-                          <div
-                            key={module.id}
-                            className="flex items-center justify-between p-3 bg-gray-50 rounded hover:bg-gray-100"
-                          >
-                            <div className="flex-1">
-                              <div className="flex items-center space-x-2">
-                                <h5 className="font-medium">{module.module_title}</h5>
-                                {module.level && (
-                                  <span className="inline-flex items-center bg-green-100 text-green-800 px-2 py-1 rounded-full text-xs font-medium">
-                                    {module.level.name}
-                                  </span>
-                                )}
-                                {module.matching_skills && module.matching_skills > 0 && (
-                                  <span className="inline-flex items-center bg-yellow-100 text-yellow-800 px-2 py-1 rounded-full text-xs font-medium">
-                                    {module.matching_skills} skills match
-                                  </span>
+                {Object.entries(channelRecommendations).map(
+                  ([channelName, modules]) => (
+                    <div key={channelName} className="border rounded-lg p-4">
+                      <h4 className="font-medium mb-3 flex items-center">
+                        <span className="inline-flex items-center bg-blue-100 text-blue-800 px-2 py-1 rounded-full text-sm font-medium mr-2">
+                          {channelName}
+                        </span>
+                        <span className="text-sm text-gray-600">
+                          ({modules.length} modules)
+                        </span>
+                      </h4>
+                      <div className="space-y-2">
+                        {modules
+                          .filter(
+                            (module) =>
+                              !items.some(
+                                (item) => item.module_id === module.id
+                              )
+                          )
+                          .map((module) => (
+                            <div
+                              key={module.id}
+                              className="flex items-center justify-between p-3 bg-gray-50 rounded hover:bg-gray-100"
+                            >
+                              <div className="flex-1">
+                                <div className="flex items-center space-x-2">
+                                  <h5 className="font-medium">
+                                    {module.module_title}
+                                  </h5>
+                                  {module.level && (
+                                    <span className="inline-flex items-center bg-green-100 text-green-800 px-2 py-1 rounded-full text-xs font-medium">
+                                      {module.level.name}
+                                    </span>
+                                  )}
+                                  {module.matching_skills &&
+                                    module.matching_skills > 0 && (
+                                      <span className="inline-flex items-center bg-yellow-100 text-yellow-800 px-2 py-1 rounded-full text-xs font-medium">
+                                        {module.matching_skills} skills match
+                                      </span>
+                                    )}
+                                </div>
+                                <p className="text-sm text-gray-600 mt-1">
+                                  {module.course_name} • {module.module_type}
+                                </p>
+                                {module.description && (
+                                  <p className="text-xs text-gray-500 mt-1">
+                                    {module.description}
+                                  </p>
                                 )}
                               </div>
-                              <p className="text-sm text-gray-600 mt-1">
-                                {module.course_name} • {module.module_type}
-                              </p>
-                              {module.description && (
-                                <p className="text-xs text-gray-500 mt-1">
-                                  {module.description}
-                                </p>
-                              )}
+                              <button
+                                onClick={() => {
+                                  addModule(module.id);
+                                  setShowChannelRecommendations(false);
+                                }}
+                                className="px-3 py-1 bg-blue-600 hover:bg-blue-700 text-white rounded text-sm ml-2"
+                              >
+                                Add to Roadmap
+                              </button>
                             </div>
-                            <button
-                              onClick={() => {
-                                addModule(module.id);
-                                setShowChannelRecommendations(false);
-                              }}
-                              className="px-3 py-1 bg-blue-600 hover:bg-blue-700 text-white rounded text-sm ml-2"
-                            >
-                              Add to Roadmap
-                            </button>
-                          </div>
-                        ))
-                      }
-                      {modules.filter(module => !items.some(item => item.module_id === module.id)).length === 0 && (
-                        <p className="text-sm text-gray-500 italic">All modules from this channel are already in your roadmap.</p>
-                      )}
+                          ))}
+                        {modules.filter(
+                          (module) =>
+                            !items.some((item) => item.module_id === module.id)
+                        ).length === 0 && (
+                          <p className="text-sm text-gray-500 italic">
+                            All modules from this channel are already in your
+                            roadmap.
+                          </p>
+                        )}
+                      </div>
                     </div>
-                  </div>
-                ))}
+                  )
+                )}
               </div>
             )}
           </div>
         </div>
-      )}
+      )} */}
     </div>
   );
 }
diff --git a/components/roadmap/RoadmapList.tsx b/components/roadmap/RoadmapList.tsx
index 56dfd0b..26b0f9a 100644
--- a/components/roadmap/RoadmapList.tsx
+++ b/components/roadmap/RoadmapList.tsx
@@ -1,5 +1,3 @@
-"use client";
-
 import { useState } from "react";
 import { Roadmap } from "./types";
 
@@ -8,15 +6,27 @@ interface Props {
   onSelect: (roadmap: Roadmap) => void;
   onDelete: (roadmapId: number) => void;
   onCreateNew: () => void;
-  onAutoGenerate: () => void;
+  onAutoGenerate: () => Promise<{
+    roadmap?: Roadmap;
+    modulesAdded?: number;
+  } | void>;
+  isAiEnabled: boolean;
 }
 
-export default function RoadmapList({ roadmaps, onSelect, onDelete, onCreateNew, onAutoGenerate }: Props) {
+export default function RoadmapList({
+  roadmaps,
+  onSelect,
+  onDelete,
+  onCreateNew,
+  onAutoGenerate,
+  isAiEnabled,
+}: Props) {
   const [deletingId, setDeletingId] = useState<number | null>(null);
+  const [autoGenMessage, setAutoGenMessage] = useState<string | null>(null);
 
   const handleDelete = async (roadmapId: number) => {
     if (!confirm("Are you sure you want to delete this roadmap?")) return;
-    
+
     setDeletingId(roadmapId);
     try {
       await onDelete(roadmapId);
@@ -25,17 +35,45 @@ export default function RoadmapList({ roadmaps, onSelect, onDelete, onCreateNew,
     }
   };
 
+  const handleAutoGenerate = async () => {
+    setAutoGenMessage(null);
+    try {
+      const result = await onAutoGenerate();
+      if (
+        !result ||
+        (result.modulesAdded !== undefined && result.modulesAdded === 0)
+      ) {
+        setAutoGenMessage(
+          "No new modules to recommend. You can create it manually if you want."
+        );
+      }
+    } catch (err: any) {
+      const msg = err?.message || "Failed to auto-generate roadmap.";
+      if (msg.toLowerCase().includes("same set of modules")) {
+        setAutoGenMessage(
+          "No new modules to recommend. You can create it manually if you want."
+        );
+      } else {
+        setAutoGenMessage(msg);
+      }
+    }
+  };
+
   return (
     <div className="space-y-6">
       <div className="flex justify-between items-center">
-        <h2 className="text-2xl font-semibold text-purple-600">My Learning Roadmaps</h2>
+        <h2 className="text-2xl font-semibold text-purple-600">
+          My Learning Roadmaps
+        </h2>
         <div className="space-x-2">
-          <button
-            onClick={onAutoGenerate}
-            className="px-4 py-2 bg-green-600 hover:bg-green-700 text-white rounded"
-          >
-            ✨ Auto-Generate
-          </button>
+          {isAiEnabled && (
+            <button
+              onClick={handleAutoGenerate}
+              className="px-4 py-2 bg-green-600 hover:bg-green-700 text-white rounded"
+            >
+              ✨ Auto-Generate
+            </button>
+          )}
           <button
             onClick={onCreateNew}
             className="px-4 py-2 bg-purple-600 hover:bg-purple-700 text-white rounded"
@@ -45,16 +83,31 @@ export default function RoadmapList({ roadmaps, onSelect, onDelete, onCreateNew,
         </div>
       </div>
 
+      {autoGenMessage && (
+        <div className="bg-yellow-100 text-yellow-800 p-4 rounded flex justify-between items-center">
+          <span>{autoGenMessage}</span>
+          <button
+            onClick={() => setAutoGenMessage(null)}
+            className="ml-4 font-bold text-lg leading-none"
+            aria-label="Dismiss"
+          >
+            ×
+          </button>
+        </div>
+      )}
+
       {roadmaps.length === 0 ? (
         <div className="text-center py-8">
           <p className="text-gray-600 mb-4">You don't have any roadmaps yet.</p>
           <div className="space-x-3">
-            <button
-              onClick={onAutoGenerate}
-              className="px-6 py-3 bg-green-600 hover:bg-green-700 text-white rounded-lg"
-            >
-              ✨ Auto-Generate Roadmap
-            </button>
+            {isAiEnabled && (
+              <button
+                onClick={handleAutoGenerate}
+                className="px-6 py-3 bg-green-600 hover:bg-green-700 text-white rounded-lg"
+              >
+                ✨ Auto-Generate Roadmap
+              </button>
+            )}
             <button
               onClick={onCreateNew}
               className="px-6 py-3 bg-purple-600 hover:bg-purple-700 text-white rounded-lg"
@@ -94,4 +147,4 @@ export default function RoadmapList({ roadmaps, onSelect, onDelete, onCreateNew,
       )}
     </div>
   );
-}
\ No newline at end of file
+}
diff --git a/context/AuthContext.tsx b/context/AuthContext.tsx
index 3efe6a7..9018487 100644
--- a/context/AuthContext.tsx
+++ b/context/AuthContext.tsx
@@ -14,6 +14,7 @@ export interface OrganisationMembership {
   id: number;
   organisationname: string;
   role: OrgRole;
+  ai_enabled: boolean;
 }
 
 export interface User {