diff --git a/src/components/content/combined/CombinedDetails.js b/src/components/content/combined/CombinedDetails.js
index f28124f..18f8d0e 100644
--- a/src/components/content/combined/CombinedDetails.js
+++ b/src/components/content/combined/CombinedDetails.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, useRef } from "react";
 import axios from "axios";
 import { useToast } from "@/hooks/useToast";
 import { Tag } from "primereact/tag";
@@ -13,6 +13,8 @@ import { getTotalFromZaps } from "@/utils/lightning";
 import { useSession } from "next-auth/react";
 import useWindowWidth from "@/hooks/useWindowWidth";
 import dynamic from "next/dynamic";
+import { Toast } from "primereact/toast";
+import MoreOptionsMenu from "@/components/ui/MoreOptionsMenu";
 
 const MDDisplay = dynamic(
     () => import("@uiw/react-markdown-preview"),
@@ -29,6 +31,62 @@ const CombinedDetails = ({ processedEvent, topics, title, summary, image, price,
     const { showToast } = useToast();
     const windowWidth = useWindowWidth();
     const isMobileView = windowWidth <= 768;
+    const menuRef = useRef(null);
+    const toastRef = useRef(null);
+
+    const handleDelete = async () => {
+        try {
+            const response = await axios.delete(`/api/resources/${processedEvent.d}`);
+            if (response.status === 204) {
+                showToast('success', 'Success', 'Resource deleted successfully.');
+                router.push('/');
+            }
+        } catch (error) {
+            if (error.response?.data?.error?.includes("Invalid `prisma.resource.delete()`")) {
+                showToast('error', 'Error', 'Resource cannot be deleted because it is part of a course, delete the course first.');
+            } else {
+                showToast('error', 'Error', 'Failed to delete resource. Please try again.');
+            }
+        }
+    };
+
+    const authorMenuItems = [
+        {
+            label: 'Edit',
+            icon: 'pi pi-pencil',
+            command: () => router.push(`/details/${processedEvent.id}/edit`)
+        },
+        {
+            label: 'Delete',
+            icon: 'pi pi-trash',
+            command: handleDelete
+        },
+        {
+            label: 'View Nostr note',
+            icon: 'pi pi-globe',
+            command: () => {
+                window.open(`https://habla.news/a/${nAddress}`, '_blank');
+            }
+        }
+    ];
+
+    const userMenuItems = [
+        {
+            label: 'View Nostr note',
+            icon: 'pi pi-globe',
+            command: () => {
+                window.open(`https://habla.news/a/${nAddress}`, '_blank');
+            }
+        }
+    ];
+
+    if (course) {
+        userMenuItems.unshift({
+            label: isMobileView ? 'Course' : 'Open Course',
+            icon: 'pi pi-external-link',
+            command: () => window.open(`/course/${course}`, '_blank')
+        });
+    }
 
     useEffect(() => {
         if (isLesson) {
@@ -49,22 +107,6 @@ const CombinedDetails = ({ processedEvent, topics, title, summary, image, price,
         }
     }, [zaps, processedEvent]);
 
-    const handleDelete = async () => {
-        try {
-            const response = await axios.delete(`/api/resources/${processedEvent.d}`);
-            if (response.status === 204) {
-                showToast('success', 'Success', 'Resource deleted successfully.');
-                router.push('/');
-            }
-        } catch (error) {
-            if (error.response?.data?.error?.includes("Invalid `prisma.resource.delete()`")) {
-                showToast('error', 'Error', 'Resource cannot be deleted because it is part of a course, delete the course first.');
-            } else {
-                showToast('error', 'Error', 'Failed to delete resource. Please try again.');
-            }
-        }
-    };
-
     const renderPaymentMessage = () => {
         if (session?.user?.role?.subscribed && decryptedContent) {
             return <GenericButton tooltipOptions={{ position: 'top' }} tooltip="You are subscribed so you can access all paid content" icon="pi pi-check" label="Subscribed" severity="success" outlined size="small" className="cursor-default hover:opacity-100 hover:bg-transparent focus:ring-0" />;
@@ -124,37 +166,9 @@ const CombinedDetails = ({ processedEvent, topics, title, summary, image, price,
         return null;
     };
 
-    const renderAdditionalLinks = () => {
-        if (processedEvent?.additionalLinks?.length > 0) {
-            return (
-                <div className="my-4">
-                    <p>Additional Links:</p>
-                    {processedEvent.additionalLinks.map((link, index) => (
-                        <div key={index} className="mb-2">
-                            <a
-                                className="text-blue-500 hover:underline hover:text-blue-600 break-words"
-                                href={link}
-                                target="_blank"
-                                rel="noopener noreferrer"
-                                style={{
-                                    wordBreak: 'break-word',
-                                    overflowWrap: 'break-word',
-                                    display: 'inline-block',
-                                    maxWidth: '100%'
-                                }}
-                            >
-                                {link}
-                            </a>
-                        </div>
-                    ))}
-                </div>
-            );
-        }
-        return null;
-    };
-
     return (
         <div className="w-full">
+            <Toast ref={toastRef} />
             <div className="relative w-full h-[400px] mb-8">
                 <Image
                     alt="background image"
@@ -168,18 +182,22 @@ const CombinedDetails = ({ processedEvent, topics, title, summary, image, price,
                 <div className="mb-8 bg-gray-800/70 rounded-lg p-4 max-mob:rounded-t-none max-tab:rounded-t-none">
                     <div className="flex flex-row items-center justify-between w-full">
                         <h1 className='text-4xl font-bold text-white'>{title}</h1>
-                        <div className="flex flex-wrap gap-2">
-                            {topics?.map((topic, index) => (
-                                <Tag className='text-[#f8f8ff]' key={index} value={topic} />
-                            ))}
-                            {isLesson && <Tag size="small" className="text-[#f8f8ff]" value="lesson" />}
-                        </div>
+                        <ZapDisplay
+                            zapAmount={zapAmount}
+                            event={processedEvent}
+                            zapsLoading={zapsLoading && zapAmount === 0}
+                        />
+                    </div>
+                    <div className="flex flex-wrap gap-2 mt-2 mb-4">
+                        {topics?.map((topic, index) => (
+                            <Tag className='text-[#f8f8ff]' key={index} value={topic} />
+                        ))}
+                        {isLesson && <Tag size="small" className="text-[#f8f8ff]" value="lesson" />}
                     </div>
                     {summary?.split('\n').map((line, index) => (
                         <p key={index}>{line}</p>
                     ))}
-                    {renderAdditionalLinks()}
-                    <div className='flex items-center justify-between'>
+                    <div className='flex items-center justify-between mt-8'>
                         <div className='flex items-center'>
                             <Image
                                 alt="avatar image"
@@ -195,54 +213,16 @@ const CombinedDetails = ({ processedEvent, topics, title, summary, image, price,
                                 </a>
                             </p>
                         </div>
-                        <ZapDisplay
-                            zapAmount={zapAmount}
-                            event={processedEvent}
-                            zapsLoading={zapsLoading && zapAmount === 0}
-                        />
+                        <div className="flex justify-end">
+                            <MoreOptionsMenu 
+                                menuItems={authorView ? authorMenuItems : userMenuItems}
+                                additionalLinks={processedEvent?.additionalLinks || []}
+                                isMobileView={isMobileView}
+                            />
+                        </div>
                     </div>
-                    <div className='w-full mt-8 flex flex-wrap justify-between items-center'>
-                        {authorView ? (
-                            <div className='flex space-x-2 mt-4 sm:mt-0'>
-                                {renderPaymentMessage()}
-                                <div className="flex flex-row gap-2">
-                                    <GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined />
-                                    <GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined />
-                                    <GenericButton
-                                        tooltip={isMobileView ? null : "View Nostr Note"}
-                                        tooltipOptions={{ position: 'left' }}
-                                        icon="pi pi-external-link"
-                                        outlined
-                                        onClick={() => window.open(`https://habla.news/a/${nAddress}`, '_blank')}
-                                    />
-                                </div>
-                            </div>
-                        ) : (
-                            <div className="w-full flex flex-row justify-between gap-2">
-                                {renderPaymentMessage()}
-                                <div className="flex flex-row justify-end gap-2">
-                                    {course && (
-                                        <GenericButton
-                                            size={isMobileView ? 'small' : null}
-                                            outlined
-                                            icon="pi pi-external-link"
-                                            onClick={() => window.open(`/course/${course}`, '_blank')}
-                                            label={isMobileView ? "Course" : "Open Course"}
-                                            tooltip="This is a lesson in a course"
-                                            tooltipOptions={{ position: 'top' }}
-                                        />
-                                    )}
-                                    <GenericButton
-                                        size={isMobileView ? 'small' : null}
-                                        tooltip={isMobileView ? null : "View Nostr Note"}
-                                        tooltipOptions={{ position: 'left' }}
-                                        icon="pi pi-external-link"
-                                        outlined
-                                        onClick={() => window.open(`https://habla.news/a/${nAddress}`, '_blank')}
-                                    />
-                                </div>
-                            </div>
-                        )}
+                    <div className='w-full mt-4'>
+                        {renderPaymentMessage()}
                     </div>
                 </div>
                 {renderContent()}
diff --git a/src/components/content/courses/CombinedLesson.js b/src/components/content/courses/CombinedLesson.js
index 3428395..f026390 100644
--- a/src/components/content/courses/CombinedLesson.js
+++ b/src/components/content/courses/CombinedLesson.js
@@ -4,7 +4,6 @@ import Image from "next/image";
 import ZapDisplay from "@/components/zaps/ZapDisplay";
 import { useImageProxy } from "@/hooks/useImageProxy";
 import { useZapsQuery } from "@/hooks/nostrQueries/zaps/useZapsQuery";
-import GenericButton from "@/components/buttons/GenericButton";
 import { nip19 } from "nostr-tools";
 import { Divider } from "primereact/divider";
 import { getTotalFromZaps } from "@/utils/lightning";
@@ -12,6 +11,10 @@ import dynamic from "next/dynamic";
 import useWindowWidth from "@/hooks/useWindowWidth";
 import appConfig from "@/config/appConfig";
 import useTrackVideoLesson from '@/hooks/tracking/useTrackVideoLesson';
+import { Menu } from "primereact/menu";
+import { Toast } from "primereact/toast";
+import MoreOptionsMenu from "@/components/ui/MoreOptionsMenu";
+import { useSession } from "next-auth/react";
 
 const MDDisplay = dynamic(
     () => import("@uiw/react-markdown-preview"),
@@ -26,13 +29,16 @@ const CombinedLesson = ({ lesson, course, decryptionPerformed, isPaid, setComple
     const [videoDuration, setVideoDuration] = useState(null);
     const [videoPlayed, setVideoPlayed] = useState(false);
     const mdDisplayRef = useRef(null);
+    const menuRef = useRef(null);
+    const toastRef = useRef(null);
     const { zaps, zapsLoading, zapsError } = useZapsQuery({ event: lesson, type: "lesson" });
     const { returnImageProxy } = useImageProxy();
     const windowWidth = useWindowWidth();
     const isMobileView = windowWidth <= 768;
     const isVideo = lesson?.type === 'video';
+    const { data: session } = useSession();
 
-    const { isCompleted: videoCompleted, isTracking: videoTracking } = useTrackVideoLesson({
+    const { isCompleted: videoCompleted, isTracking: videoTracking, markLessonAsCompleted } = useTrackVideoLesson({
         lessonId: lesson?.d,
         videoDuration,
         courseId: course?.d,
@@ -41,6 +47,61 @@ const CombinedLesson = ({ lesson, course, decryptionPerformed, isPaid, setComple
         decryptionPerformed
     });
 
+    const buildMenuItems = () => {
+        const items = [];
+        
+        const hasAccess = session?.user && (
+            !isPaid ||
+            decryptionPerformed ||
+            session.user.role?.subscribed
+        );
+        
+        if (hasAccess) {
+            items.push({
+                label: 'Mark as completed',
+                icon: 'pi pi-check-circle',
+                command: async () => {
+                    try {
+                        await markLessonAsCompleted();
+                        setCompleted(lesson.id);
+                        toastRef.current.show({
+                            severity: 'success',
+                            summary: 'Success',
+                            detail: 'Lesson marked as completed',
+                            life: 3000
+                        });
+                    } catch (error) {
+                        console.error('Failed to mark lesson as completed:', error);
+                        toastRef.current.show({
+                            severity: 'error',
+                            summary: 'Error',
+                            detail: 'Failed to mark lesson as completed',
+                            life: 3000
+                        });
+                    }
+                }
+            });
+        }
+        
+        items.push({
+            label: 'Open lesson',
+            icon: 'pi pi-arrow-up-right',
+            command: () => {
+                window.open(`/details/${lesson.id}`, '_blank');
+            }
+        });
+        
+        items.push({
+            label: 'View Nostr note',
+            icon: 'pi pi-globe',
+            command: () => {
+                window.open(`https://habla.news/a/${nAddress}`, '_blank');
+            }
+        });
+        
+        return items;
+    };
+
     useEffect(() => {
         const handleYouTubeMessage = (event) => {
             if (event.origin !== "https://www.youtube.com") return;
@@ -168,6 +229,7 @@ const CombinedLesson = ({ lesson, course, decryptionPerformed, isPaid, setComple
 
     return (
         <div className="w-full">
+            <Toast ref={toastRef} />
             {isVideo ? renderContent() : (
                 <>
                     <div className="relative w-[80%] h-[200px] mx-auto mb-24">
@@ -185,13 +247,18 @@ const CombinedLesson = ({ lesson, course, decryptionPerformed, isPaid, setComple
                 <div className={`${!isVideo && 'mb-8 bg-gray-800/70 rounded-lg p-4'}`}>
                     <div className="flex flex-row items-center justify-between w-full">
                         <h1 className='text-3xl font-bold text-white'>{lesson.title}</h1>
-                        <div className="flex flex-wrap gap-2">
-                            {lesson.topics && lesson.topics.length > 0 && (
-                                lesson.topics.map((topic, index) => (
-                                    <Tag className='text-white' key={index} value={topic}></Tag>
-                                ))
-                            )}
-                        </div>
+                        <ZapDisplay
+                            zapAmount={zapAmount}
+                            event={lesson}
+                            zapsLoading={zapsLoading}
+                        />
+                    </div>
+                    <div className="flex flex-wrap gap-2 mt-2 mb-4">
+                        {lesson.topics && lesson.topics.length > 0 && (
+                            lesson.topics.map((topic, index) => (
+                                <Tag className='text-white' key={index} value={topic}></Tag>
+                            ))
+                        )}
                     </div>
                     <div className='text-xl text-gray-200 mb-4 mt-4'>{lesson.summary && (
                         <div className="text-xl mt-4">
@@ -201,7 +268,7 @@ const CombinedLesson = ({ lesson, course, decryptionPerformed, isPaid, setComple
                         </div>
                     )}
                     </div>
-                    <div className='flex items-center justify-between'>
+                    <div className='flex items-center justify-between mt-8'>
                         <div className='flex items-center'>
                             <Image
                                 alt="avatar image"
@@ -217,41 +284,18 @@ const CombinedLesson = ({ lesson, course, decryptionPerformed, isPaid, setComple
                                 </a>
                             </p>
                         </div>
-                        <ZapDisplay
-                            zapAmount={zapAmount}
-                            event={lesson}
-                            zapsLoading={zapsLoading}
-                        />
-                    </div>
-                    <div className="w-full flex flex-row justify-end">
-                        <GenericButton
-                            tooltip={isMobileView ? null : "View Nostr Note"}
-                            tooltipOptions={{ position: 'left' }}
-                            icon="pi pi-external-link"
-                            outlined
-                            onClick={() => {
-                                window.open(`https://habla.news/a/${nAddress}`, '_blank');
-                            }}
-                        />
+                        <div className="flex justify-end">
+                            <MoreOptionsMenu 
+                                menuItems={buildMenuItems()}
+                                additionalLinks={lesson?.additionalLinks || []}
+                                isMobileView={isMobileView}
+                            />
+                        </div>
                     </div>
                 </div>
                 {!isVideo && <Divider />}
-                {lesson?.additionalLinks && lesson.additionalLinks.length > 0 && (
-                    <div className='mt-6 bg-gray-800/90 rounded-lg p-4'>
-                        <h3 className='text-lg font-semibold mb-2 text-white'>External links:</h3>
-                        <ul className='list-disc list-inside text-white'>
-                            {lesson.additionalLinks.map((link, index) => (
-                                <li key={index}>
-                                    <a href={link} target="_blank" rel="noopener noreferrer" className='text-blue-300 hover:underline'>
-                                        {new URL(link).hostname}
-                                    </a>
-                                </li>
-                            ))}
-                        </ul>
-                    </div>
-                )}
+                {!isVideo && renderContent()}
             </div>
-            {!isVideo && renderContent()}
         </div>
     );
 };
diff --git a/src/components/content/courses/CourseDetails.js b/src/components/content/courses/CourseDetails.js
index 82c9c7f..d61b595 100644
--- a/src/components/content/courses/CourseDetails.js
+++ b/src/components/content/courses/CourseDetails.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState, useCallback } from 'react';
+import React, { useEffect, useState, useCallback, useRef } from 'react';
 import axios from 'axios';
 import { useToast } from "@/hooks/useToast";
 import { Tag } from 'primereact/tag';
@@ -19,6 +19,8 @@ import appConfig from "@/config/appConfig";
 import useTrackCourse from '@/hooks/tracking/useTrackCourse';
 import WelcomeModal from '@/components/onboarding/WelcomeModal';
 import { ProgressSpinner } from 'primereact/progressspinner';
+import { Toast } from "primereact/toast";
+import MoreOptionsMenu from "@/components/ui/MoreOptionsMenu";
 
 export default function CourseDetails({ processedEvent, paidCourse, lessons, decryptionPerformed, handlePaymentSuccess, handlePaymentError }) {
     const [zapAmount, setZapAmount] = useState(0);
@@ -32,6 +34,40 @@ export default function CourseDetails({ processedEvent, paidCourse, lessons, dec
     const windowWidth = useWindowWidth();
     const isMobileView = windowWidth <= 768;
     const { ndk } = useNDKContext();
+    const menuRef = useRef(null);
+    const toastRef = useRef(null);
+
+    const handleDelete = async () => {
+        try {
+            const response = await axios.delete(`/api/courses/${processedEvent.d}`);
+            if (response.status === 204) {
+                showToast('success', 'Success', 'Course deleted successfully.');
+                router.push('/');
+            }
+        } catch (error) {
+            showToast('error', 'Error', 'Failed to delete course. Please try again.');
+        }
+    }
+
+    const menuItems = [
+        {
+            label: processedEvent?.pubkey === session?.user?.pubkey ? 'Edit' : null,
+            icon: 'pi pi-pencil',
+            command: () => router.push(`/course/${processedEvent.d}/edit`),
+            visible: processedEvent?.pubkey === session?.user?.pubkey
+        },
+        {
+            label: processedEvent?.pubkey === session?.user?.pubkey ? 'Delete' : null,
+            icon: 'pi pi-trash',
+            command: handleDelete,
+            visible: processedEvent?.pubkey === session?.user?.pubkey
+        },
+        {
+            label: 'View Nostr note',
+            icon: 'pi pi-globe',
+            command: () => window.open(`https://nostr.band/${nAddress}`, '_blank')
+        }
+    ];
 
     const { isCompleted } = useTrackCourse({
         courseId: processedEvent?.d,
@@ -74,18 +110,6 @@ export default function CourseDetails({ processedEvent, paidCourse, lessons, dec
         }
     }, [zaps, processedEvent]);
 
-    const handleDelete = async () => {
-        try {
-            const response = await axios.delete(`/api/courses/${processedEvent.d}`);
-            if (response.status === 204) {
-                showToast('success', 'Success', 'Course deleted successfully.');
-                router.push('/');
-            }
-        } catch (error) {
-            showToast('error', 'Error', 'Failed to delete course. Please try again.');
-        }
-    }
-
     const renderPaymentMessage = () => {
         if (session?.user && session.user?.role?.subscribed && decryptionPerformed) {
             return <GenericButton tooltipOptions={{ position: 'top' }} tooltip={`You are subscribed so you can access all paid content`} icon="pi pi-check" label="Subscribed" severity="success" outlined size="small" className="cursor-default hover:opacity-100 hover:bg-transparent focus:ring-0" />
@@ -101,45 +125,18 @@ export default function CourseDetails({ processedEvent, paidCourse, lessons, dec
 
         if (paidCourse && !decryptionPerformed) {
             return (
-                <CoursePaymentButton
-                    lnAddress={author?.lud16}
-                    amount={processedEvent.price}
-                    onSuccess={handlePaymentSuccess}
-                    onError={handlePaymentError}
-                    courseId={processedEvent.d}
-                />
-            );
-        }
-
-        return null;
-    };
-
-    const renderAdditionalLinks = () => {
-        if (processedEvent?.additionalLinks && processedEvent.additionalLinks.length > 0) {
-            return (
-                <div className="my-4">
-                    <p>Additional Links:</p>
-                    {processedEvent.additionalLinks.map((link, index) => (
-                        <div key={index} className="mb-2">
-                            <a 
-                                className="text-blue-500 hover:underline hover:text-blue-600 break-words"
-                                href={link} 
-                                target="_blank" 
-                                rel="noopener noreferrer"
-                                style={{ 
-                                    wordBreak: 'break-word', 
-                                    overflowWrap: 'break-word',
-                                    display: 'inline-block',
-                                    maxWidth: '100%'
-                                }}
-                            >
-                                {link}
-                            </a>
-                        </div>
-                    ))}
+                <div className='w-fit'>
+                    <CoursePaymentButton
+                        lnAddress={author?.lud16}
+                        amount={processedEvent.price}
+                        onSuccess={handlePaymentSuccess}
+                        onError={handlePaymentError}
+                        courseId={processedEvent.d}
+                    />
                 </div>
             );
         }
+
         return null;
     };
 
@@ -149,7 +146,8 @@ export default function CourseDetails({ processedEvent, paidCourse, lessons, dec
 
     return (
         <div className="w-full">
-                  <WelcomeModal />
+            <Toast ref={toastRef} />
+            <WelcomeModal />
             <div className="relative w-full h-[400px] mb-8">
                 <Image
                     alt="course image"
@@ -165,13 +163,18 @@ export default function CourseDetails({ processedEvent, paidCourse, lessons, dec
                     {isCompleted && <Tag severity="success" value="Completed" />}
                     <div className="flex flex-row items-center justify-between w-full">
                         <h1 className='text-4xl font-bold text-white'>{processedEvent.name}</h1>
-                        <div className="flex flex-wrap gap-2">
-                            {processedEvent.topics && processedEvent.topics.length > 0 && (
-                                processedEvent.topics.map((topic, index) => (
-                                    <Tag className='text-white' key={index} value={topic}></Tag>
-                                ))
-                            )}
-                        </div>
+                        <ZapDisplay
+                            zapAmount={zapAmount}
+                            event={processedEvent}
+                            zapsLoading={zapsLoading && zapAmount === 0}
+                        />
+                    </div>
+                    <div className="flex flex-wrap gap-2 mt-2 mb-4">
+                        {processedEvent.topics && processedEvent.topics.length > 0 && (
+                            processedEvent.topics.map((topic, index) => (
+                                <Tag className='text-white' key={index} value={topic}></Tag>
+                            ))
+                        )}
                     </div>
                     <div className='text-xl text-gray-200 mb-4 mt-4 max-mob:text-base'>{processedEvent.description && (
                         processedEvent.description.split('\n').map((line, index) => (
@@ -179,7 +182,7 @@ export default function CourseDetails({ processedEvent, paidCourse, lessons, dec
                         ))
                     )}
                     </div>
-                    <div className='flex items-center justify-between'>
+                    <div className='flex items-center justify-between mt-8'>
                         <div className='flex items-center'>
                             <Image
                                 alt="avatar image"
@@ -195,26 +198,16 @@ export default function CourseDetails({ processedEvent, paidCourse, lessons, dec
                                 </a>
                             </p>
                         </div>
-                        <ZapDisplay
-                            zapAmount={zapAmount}
-                            event={processedEvent}
-                            zapsLoading={zapsLoading && zapAmount === 0}
-                        />
+                        <div className="flex justify-end">
+                            <MoreOptionsMenu
+                                menuItems={menuItems}
+                                additionalLinks={processedEvent?.additionalLinks || []}
+                                isMobileView={isMobileView}
+                            />
+                        </div>
                     </div>
-                    <div className='w-full mt-8 flex flex-wrap justify-between items-center'>
+                    <div className='w-full mt-4'>
                         {renderPaymentMessage()}
-                        {processedEvent?.pubkey === session?.user?.pubkey ? (
-                            <div className='flex space-x-2 mt-4 sm:mt-0'>
-                                <GenericButton onClick={() => router.push(`/course/${processedEvent.d}/edit`)} label="Edit" severity='warning' outlined />
-                                <GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined />
-                                <GenericButton outlined icon="pi pi-external-link" onClick={() => window.open(`https://nostr.band/${nAddress}`, '_blank')} tooltip={isMobileView ? null : "View Nostr Event"} tooltipOptions={{ position: paidCourse ? 'left' : 'right' }} />
-                            </div>
-                        ) : (
-                            <div className='flex space-x-2 mt-4 sm:mt-0'>
-                                <GenericButton className='my-2' outlined icon="pi pi-external-link" onClick={() => window.open(`https://nostr.band/${nAddress}`, '_blank')} tooltip={isMobileView ? null : "View Nostr Event"} tooltipOptions={{ position: paidCourse ? 'left' : 'right' }} />
-                            </div>
-                        )}
-                        {renderAdditionalLinks()}
                     </div>
                 </div>
             </div>
diff --git a/src/components/content/courses/CourseLesson.js b/src/components/content/courses/CourseLesson.js
index 2b04dd8..34ba3a9 100644
--- a/src/components/content/courses/CourseLesson.js
+++ b/src/components/content/courses/CourseLesson.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, useRef } from "react";
 import { Tag } from "primereact/tag";
 import Image from "next/image";
 import { useImageProxy } from "@/hooks/useImageProxy";
@@ -6,6 +6,13 @@ import { getTotalFromZaps } from "@/utils/lightning";
 import ZapDisplay from "@/components/zaps/ZapDisplay";
 import dynamic from "next/dynamic";
 import { useZapsQuery } from "@/hooks/nostrQueries/zaps/useZapsQuery";
+import { Toast } from "primereact/toast";
+import useTrackDocumentLesson from "@/hooks/tracking/useTrackDocumentLesson";
+import useWindowWidth from "@/hooks/useWindowWidth";
+import { nip19 } from "nostr-tools";
+import appConfig from "@/config/appConfig";
+import MoreOptionsMenu from "@/components/ui/MoreOptionsMenu";
+import { useSession } from "next-auth/react";
 
 const MDDisplay = dynamic(
     () => import("@uiw/react-markdown-preview"),
@@ -14,10 +21,88 @@ const MDDisplay = dynamic(
     }
 );
 
-const CourseLesson = ({ lesson, course, decryptionPerformed, isPaid }) => {
+const CourseLesson = ({ lesson, course, decryptionPerformed, isPaid, setCompleted }) => {
     const [zapAmount, setZapAmount] = useState(0);
     const { zaps, zapsLoading, zapsError } = useZapsQuery({ event: lesson, type: "lesson" });
     const { returnImageProxy } = useImageProxy();
+    const menuRef = useRef(null);
+    const toastRef = useRef(null);
+    const windowWidth = useWindowWidth();
+    const isMobileView = windowWidth <= 768;
+    const { data: session } = useSession();
+    
+    const readTime = lesson?.content ? Math.max(30, Math.ceil(lesson.content.length / 20)) : 60;
+    
+    const { isCompleted, isTracking, markLessonAsCompleted } = useTrackDocumentLesson({
+        lessonId: lesson?.d,
+        courseId: course?.d,
+        readTime,
+        paidCourse: isPaid,
+        decryptionPerformed
+    });
+    
+    const buildMenuItems = () => {
+        const items = [];
+        
+        const hasAccess = session?.user && (
+            !isPaid ||
+            decryptionPerformed ||
+            session.user.role?.subscribed
+        );
+        
+        if (hasAccess) {
+            items.push({
+                label: 'Mark as completed',
+                icon: 'pi pi-check-circle',
+                command: async () => {
+                    try {
+                        await markLessonAsCompleted();
+                        setCompleted && setCompleted(lesson.id);
+                        toastRef.current.show({
+                            severity: 'success',
+                            summary: 'Success',
+                            detail: 'Lesson marked as completed',
+                            life: 3000
+                        });
+                    } catch (error) {
+                        console.error('Failed to mark lesson as completed:', error);
+                        toastRef.current.show({
+                            severity: 'error',
+                            summary: 'Error',
+                            detail: 'Failed to mark lesson as completed',
+                            life: 3000
+                        });
+                    }
+                }
+            });
+        }
+        
+        items.push({
+            label: 'Open lesson',
+            icon: 'pi pi-arrow-up-right',
+            command: () => {
+                window.open(`/details/${lesson.id}`, '_blank');
+            }
+        });
+        
+        items.push({
+            label: 'View Nostr note',
+            icon: 'pi pi-globe',
+            command: () => {
+                if (lesson?.d) {
+                    const addr = nip19.naddrEncode({
+                        pubkey: lesson.pubkey,
+                        kind: lesson.kind,
+                        identifier: lesson.d,
+                        relays: appConfig.defaultRelayUrls || []
+                    });
+                    window.open(`https://habla.news/a/${addr}`, '_blank');
+                }
+            }
+        });
+        
+        return items;
+    };
 
     useEffect(() => {
         if (!zaps || zapsLoading || zapsError) return;
@@ -26,6 +111,12 @@ const CourseLesson = ({ lesson, course, decryptionPerformed, isPaid }) => {
 
         setZapAmount(total);
     }, [zaps, zapsLoading, zapsError, lesson]);
+    
+    useEffect(() => {
+        if (isCompleted && !isTracking && setCompleted) {
+            setCompleted(lesson.id);
+        }
+    }, [isCompleted, isTracking, lesson.id, setCompleted]);
 
     const renderContent = () => {
         if (isPaid && decryptionPerformed) {
@@ -42,53 +133,56 @@ const CourseLesson = ({ lesson, course, decryptionPerformed, isPaid }) => {
 
     return (
         <div className='w-full px-24 pt-12 mx-auto mt-4 max-tab:px-0 max-mob:px-0 max-tab:pt-2 max-mob:pt-2'>
+            <Toast ref={toastRef} />
             <div className='w-full flex flex-row justify-between max-tab:flex-col max-mob:flex-col'>
                 <div className='w-[75vw] mx-auto flex flex-row items-start justify-between max-tab:flex-col max-mob:flex-col max-tab:w-[95vw] max-mob:w-[95vw]'>
                     <div className='flex flex-col items-start max-w-[45vw] max-tab:max-w-[100vw] max-mob:max-w-[100vw]'>
-                        <div className='pt-2 flex flex-row justify-start w-full'>
+                        <div className="flex flex-row items-center justify-between w-full">
+                            <h1 className='text-4xl'>{lesson?.title}</h1>
+                            <ZapDisplay 
+                                zapAmount={zapAmount} 
+                                event={lesson} 
+                                zapsLoading={zapsLoading} 
+                            />
+                        </div>
+                        <div className='pt-2 flex flex-row justify-start w-full mt-2 mb-4'>
                             {lesson && lesson.topics && lesson.topics.length > 0 && (
                                 lesson.topics.map((topic, index) => (
                                     <Tag className='mr-2 text-white' key={index} value={topic}></Tag>
                                 ))
                             )}
                         </div>
-                        <h1 className='text-4xl mt-6'>{lesson?.title}</h1>
-                        <p className='text-xl mt-6'>{lesson?.summary && (
-                        <div className="text-xl mt-4">
-                            {lesson.summary.split('\n').map((line, index) => (
-                                <p key={index}>{line}</p>
-                            ))}
-                        </div>
-                    )}
-                    </p>
-                        {lesson?.additionalLinks && lesson.additionalLinks.length > 0 && (
-                            <div className='mt-6'>
-                                <h3 className='text-lg font-semibold mb-2'>External links:</h3>
-                                <ul className='list-disc list-inside'>
-                                    {lesson.additionalLinks.map((link, index) => (
-                                        <li key={index}>
-                                            <a href={link} target="_blank" rel="noopener noreferrer" className='text-blue-500 hover:underline'>
-                                                {new URL(link).hostname}
-                                            </a>
-                                        </li>
-                                    ))}
-                                </ul>
+                        <div className='text-xl mt-6'>{lesson?.summary && (
+                            <div className="text-xl mt-4">
+                                {lesson.summary.split('\n').map((line, index) => (
+                                    <p key={index}>{line}</p>
+                                ))}
                             </div>
                         )}
-                        <div className='flex flex-row w-full mt-6 items-center'>
-                            <Image
-                                alt="avatar thumbnail"
-                                src={returnImageProxy(lesson.author?.avatar, lesson.author?.pubkey)}
-                                width={50}
-                                height={50}
-                                className="rounded-full mr-4"
-                            />
-                            <p className='text-lg'>
-                                Created by{' '}
-                                <a rel='noreferrer noopener' target='_blank' className='text-blue-500 hover:underline'>
-                                    {lesson.author?.username || lesson.author?.pubkey}
-                                </a>
-                            </p>
+                        </div>
+                        <div className='flex items-center justify-between w-full mt-8'>
+                            <div className='flex flex-row w-fit items-center'>
+                                <Image
+                                    alt="avatar thumbnail"
+                                    src={returnImageProxy(lesson.author?.avatar, lesson.author?.pubkey)}
+                                    width={50}
+                                    height={50}
+                                    className="rounded-full mr-4"
+                                />
+                                <p className='text-lg'>
+                                    Created by{' '}
+                                    <a rel='noreferrer noopener' target='_blank' className='text-blue-500 hover:underline'>
+                                        {lesson.author?.username || lesson.author?.pubkey}
+                                    </a>
+                                </p>
+                            </div>
+                            <div className="flex justify-end">
+                                <MoreOptionsMenu 
+                                    menuItems={buildMenuItems()}
+                                    additionalLinks={lesson?.additionalLinks || []}
+                                    isMobileView={isMobileView}
+                                />
+                            </div>
                         </div>
                     </div>
                     <div className='flex flex-col max-tab:mt-12 max-mob:mt-12'>
@@ -101,9 +195,6 @@ const CourseLesson = ({ lesson, course, decryptionPerformed, isPaid }) => {
                                     height={194}
                                     className="w-[344px] h-[194px] object-cover object-top rounded-lg"
                                 />
-                                <div className="w-full flex justify-end">
-                                    <ZapDisplay zapAmount={zapAmount} event={lesson} zapsLoading={zapsLoading} />
-                                </div>
                             </div>
                         )}
                     </div>
diff --git a/src/components/content/courses/DocumentLesson.js b/src/components/content/courses/DocumentLesson.js
index 5efecab..0e25f4e 100644
--- a/src/components/content/courses/DocumentLesson.js
+++ b/src/components/content/courses/DocumentLesson.js
@@ -1,10 +1,9 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, useRef } from "react";
 import { Tag } from "primereact/tag";
 import Image from "next/image";
 import ZapDisplay from "@/components/zaps/ZapDisplay";
 import { useImageProxy } from "@/hooks/useImageProxy";
 import { useZapsQuery } from "@/hooks/nostrQueries/zaps/useZapsQuery";
-import GenericButton from "@/components/buttons/GenericButton";
 import { nip19 } from "nostr-tools";
 import { Divider } from "primereact/divider";
 import { getTotalFromZaps } from "@/utils/lightning";
@@ -12,6 +11,9 @@ import dynamic from "next/dynamic";
 import useWindowWidth from "@/hooks/useWindowWidth";
 import appConfig from "@/config/appConfig";
 import useTrackDocumentLesson from "@/hooks/tracking/useTrackDocumentLesson";
+import { Toast } from "primereact/toast";
+import MoreOptionsMenu from "@/components/ui/MoreOptionsMenu";
+import { useSession } from "next-auth/react";
 
 const MDDisplay = dynamic(
     () => import("@uiw/react-markdown-preview"),
@@ -27,16 +29,74 @@ const DocumentLesson = ({ lesson, course, decryptionPerformed, isPaid, setComple
     const { returnImageProxy } = useImageProxy();
     const windowWidth = useWindowWidth();
     const isMobileView = windowWidth <= 768;
+    const menuRef = useRef(null);
+    const toastRef = useRef(null);
     // todo implement real read time needs to be on form
     const readTime = 120;
+    const { data: session } = useSession();
 
-    const { isCompleted, isTracking } = useTrackDocumentLesson({
+    const { isCompleted, isTracking, markLessonAsCompleted } = useTrackDocumentLesson({
         lessonId: lesson?.d,
         courseId: course?.d,
         readTime: readTime,
         paidCourse: isPaid,
         decryptionPerformed: decryptionPerformed,
     });
+    
+    const buildMenuItems = () => {
+        const items = [];
+        
+        const hasAccess = session?.user && (
+            !isPaid ||
+            decryptionPerformed ||
+            session.user.role?.subscribed
+        );
+        
+        if (hasAccess) {
+            items.push({
+                label: 'Mark as completed',
+                icon: 'pi pi-check-circle',
+                command: async () => {
+                    try {
+                        await markLessonAsCompleted();
+                        setCompleted && setCompleted(lesson.id);
+                        toastRef.current.show({
+                            severity: 'success',
+                            summary: 'Success',
+                            detail: 'Lesson marked as completed',
+                            life: 3000
+                        });
+                    } catch (error) {
+                        console.error('Failed to mark lesson as completed:', error);
+                        toastRef.current.show({
+                            severity: 'error',
+                            summary: 'Error',
+                            detail: 'Failed to mark lesson as completed',
+                            life: 3000
+                        });
+                    }
+                }
+            });
+        }
+        
+        items.push({
+            label: 'Open lesson',
+            icon: 'pi pi-arrow-up-right',
+            command: () => {
+                window.open(`/details/${lesson.id}`, '_blank');
+            }
+        });
+        
+        items.push({
+            label: 'View Nostr note',
+            icon: 'pi pi-globe',
+            command: () => {
+                window.open(`https://habla.news/a/${nAddress}`, '_blank');
+            }
+        });
+        
+        return items;
+    };
 
     useEffect(() => {
         if (!zaps || zapsLoading || zapsError) return;
@@ -86,6 +146,7 @@ const DocumentLesson = ({ lesson, course, decryptionPerformed, isPaid, setComple
 
     return (
         <div className="w-full">
+            <Toast ref={toastRef} />
             <div className="relative w-[80%] h-[200px] mx-auto mb-24">
                 <Image
                     alt="lesson background image"
@@ -99,13 +160,18 @@ const DocumentLesson = ({ lesson, course, decryptionPerformed, isPaid, setComple
                 <div className="mb-8 bg-gray-800/70 rounded-lg p-4">
                     <div className="flex flex-row items-center justify-between w-full">
                         <h1 className='text-3xl font-bold text-white'>{lesson.title}</h1>
-                        <div className="flex flex-wrap gap-2">
-                            {lesson.topics && lesson.topics.length > 0 && (
-                                lesson.topics.map((topic, index) => (
-                                    <Tag className='text-white' key={index} value={topic}></Tag>
-                                ))
-                            )}
-                        </div>
+                        <ZapDisplay
+                            zapAmount={zapAmount}
+                            event={lesson}
+                            zapsLoading={zapsLoading}
+                        />
+                    </div>
+                    <div className="flex flex-wrap gap-2 mt-2 mb-4">
+                        {lesson.topics && lesson.topics.length > 0 && (
+                            lesson.topics.map((topic, index) => (
+                                <Tag className='text-white' key={index} value={topic}></Tag>
+                            ))
+                        )}
                     </div>
                     <div className='text-xl text-gray-200 mb-4 mt-4'>{lesson.summary && (
                         <div className="text-xl mt-4">
@@ -115,7 +181,7 @@ const DocumentLesson = ({ lesson, course, decryptionPerformed, isPaid, setComple
                         </div>
                     )}
                     </div>
-                    <div className='flex items-center justify-between'>
+                    <div className='flex items-center justify-between mt-8'>
                         <div className='flex items-center'>
                             <Image
                                 alt="avatar image"
@@ -131,41 +197,18 @@ const DocumentLesson = ({ lesson, course, decryptionPerformed, isPaid, setComple
                                 </a>
                             </p>
                         </div>
-                        <ZapDisplay
-                            zapAmount={zapAmount}
-                            event={lesson}
-                            zapsLoading={zapsLoading}
-                        />
-                    </div>
-                    <div className="w-full flex flex-row justify-end">
-                        <GenericButton
-                            tooltip={isMobileView ? null : "View Nostr Note"}
-                            tooltipOptions={{ position: 'left' }}
-                            icon="pi pi-external-link"
-                            outlined
-                            onClick={() => {
-                                window.open(`https://habla.news/a/${nAddress}`, '_blank');
-                            }}
-                        />
+                        <div className="flex justify-end">
+                            <MoreOptionsMenu 
+                                menuItems={buildMenuItems()}
+                                additionalLinks={lesson?.additionalLinks || []}
+                                isMobileView={isMobileView}
+                            />
+                        </div>
                     </div>
                 </div>
                 <Divider />
-            {lesson?.additionalLinks && lesson.additionalLinks.length > 0 && (
-                <div className='mt-6 bg-gray-800/90 rounded-lg p-4'>
-                    <h3 className='text-lg font-semibold mb-2 text-white'>External links:</h3>
-                    <ul className='list-disc list-inside text-white'>
-                        {lesson.additionalLinks.map((link, index) => (
-                            <li key={index}>
-                                <a href={link} target="_blank" rel="noopener noreferrer" className='text-blue-300 hover:underline'>
-                                    {new URL(link).hostname}
-                                </a>
-                            </li>
-                        ))}
-                    </ul>
-                </div>
-            )}
+                {renderContent()}
             </div>
-            {renderContent()}
         </div>
     )
 }
diff --git a/src/components/content/courses/VideoLesson.js b/src/components/content/courses/VideoLesson.js
index d2b9fb8..feb803b 100644
--- a/src/components/content/courses/VideoLesson.js
+++ b/src/components/content/courses/VideoLesson.js
@@ -3,7 +3,6 @@ import { Tag } from "primereact/tag";
 import Image from "next/image";
 import ZapDisplay from "@/components/zaps/ZapDisplay";
 import { useImageProxy } from "@/hooks/useImageProxy";
-import GenericButton from "@/components/buttons/GenericButton";
 import { useZapsQuery } from "@/hooks/nostrQueries/zaps/useZapsQuery";
 import { nip19 } from "nostr-tools";
 import { getTotalFromZaps } from "@/utils/lightning";
@@ -12,6 +11,9 @@ import { Divider } from "primereact/divider";
 import appConfig from "@/config/appConfig";
 import useWindowWidth from "@/hooks/useWindowWidth";
 import useTrackVideoLesson from '@/hooks/tracking/useTrackVideoLesson';
+import { Toast } from "primereact/toast";
+import MoreOptionsMenu from "@/components/ui/MoreOptionsMenu";
+import { useSession } from "next-auth/react";
 
 const MDDisplay = dynamic(
     () => import("@uiw/react-markdown-preview"),
@@ -30,8 +32,11 @@ const VideoLesson = ({ lesson, course, decryptionPerformed, isPaid, setCompleted
     const [videoDuration, setVideoDuration] = useState(null);
     const [videoPlayed, setVideoPlayed] = useState(false);
     const mdDisplayRef = useRef(null);
+    const menuRef = useRef(null);
+    const toastRef = useRef(null);
+    const { data: session } = useSession();
 
-    const { isCompleted, isTracking } = useTrackVideoLesson({
+    const { isCompleted, isTracking, markLessonAsCompleted } = useTrackVideoLesson({
         lessonId: lesson?.d,
         videoDuration,
         courseId: course?.d,
@@ -39,6 +44,61 @@ const VideoLesson = ({ lesson, course, decryptionPerformed, isPaid, setCompleted
         paidCourse: isPaid,
         decryptionPerformed
     });
+    
+    const buildMenuItems = () => {
+        const items = [];
+        
+        const hasAccess = session?.user && (
+            !isPaid ||
+            decryptionPerformed ||
+            session.user.role?.subscribed
+        );
+        
+        if (hasAccess) {
+            items.push({
+                label: 'Mark as completed',
+                icon: 'pi pi-check-circle',
+                command: async () => {
+                    try {
+                        await markLessonAsCompleted();
+                        setCompleted(lesson.id);
+                        toastRef.current.show({
+                            severity: 'success',
+                            summary: 'Success',
+                            detail: 'Lesson marked as completed',
+                            life: 3000
+                        });
+                    } catch (error) {
+                        console.error('Failed to mark lesson as completed:', error);
+                        toastRef.current.show({
+                            severity: 'error',
+                            summary: 'Error',
+                            detail: 'Failed to mark lesson as completed',
+                            life: 3000
+                        });
+                    }
+                }
+            });
+        }
+        
+        items.push({
+            label: 'Open lesson',
+            icon: 'pi pi-arrow-up-right',
+            command: () => {
+                window.open(`/details/${lesson.id}`, '_blank');
+            }
+        });
+        
+        items.push({
+            label: 'View Nostr note',
+            icon: 'pi pi-globe',
+            command: () => {
+                window.open(`https://habla.news/a/${nAddress}`, '_blank');
+            }
+        });
+        
+        return items;
+    };
 
     useEffect(() => {
         const handleYouTubeMessage = (event) => {
@@ -148,20 +208,27 @@ const VideoLesson = ({ lesson, course, decryptionPerformed, isPaid, setCompleted
 
     return (
         <div className="w-full">
+            <Toast ref={toastRef} />
             {renderContent()}
             <Divider />
             <div className="bg-gray-800/90 rounded-lg p-4 m-4">
                 <div className="w-full flex flex-col items-start justify-start mt-2 px-2">
-                    <div className="flex flex-row items-center gap-2 w-full">
+                    <div className="flex flex-row items-center justify-between w-full">
                         <h1 className='text-3xl text-white'>{lesson.title}</h1>
+                        <ZapDisplay
+                            zapAmount={zapAmount}
+                            event={lesson}
+                            zapsLoading={zapsLoading}
+                        />
+                    </div>
+                    <div className="flex flex-wrap gap-2 mt-2 mb-4">
                         {lesson.topics && lesson.topics.length > 0 && (
                             lesson.topics.map((topic, index) => (
-                                <Tag className='mt-2 text-white' key={index} value={topic}></Tag>
+                                <Tag className='text-white' key={index} value={topic}></Tag>
                             ))
                         )}
                     </div>
-                    <div className='flex flex-row items-center justify-between w-full'>
-                        <div className='text-xl mt-4 text-gray-200'>{lesson.summary && (
+                    <div className='text-xl mt-4 text-gray-200'>{lesson.summary && (
                         <div className="text-xl mt-4">
                             {lesson.summary.split('\n').map((line, index) => (
                                 <p key={index}>{line}</p>
@@ -169,55 +236,31 @@ const VideoLesson = ({ lesson, course, decryptionPerformed, isPaid, setCompleted
                         </div>
                     )}
                     </div>
-                        <ZapDisplay
-                            zapAmount={zapAmount}
-                            event={lesson}
-                            zapsLoading={zapsLoading}
+                </div>
+                <div className='flex items-center justify-between mt-8'>
+                    <div className='flex items-center'>
+                        <Image
+                            alt="avatar image"
+                            src={returnImageProxy(lesson.author?.avatar, lesson.author?.username)}
+                            width={50}
+                            height={50}
+                            className="rounded-full mr-4"
+                        />
+                        <p className='text-lg text-white'>
+                            Created by{' '}
+                            <a rel='noreferrer noopener' target='_blank' className='text-blue-300 hover:underline'>
+                                {lesson.author?.username || lesson.author?.pubkey}
+                            </a>
+                        </p>
+                    </div>
+                    <div className="flex justify-end">
+                        <MoreOptionsMenu 
+                            menuItems={buildMenuItems()}
+                            additionalLinks={lesson?.additionalLinks || []}
+                            isMobileView={isMobileView}
                         />
                     </div>
                 </div>
-                <div className='w-full flex flex-col space-y-4 mt-4'>
-                    <div className='flex flex-row justify-between items-center'>
-                        <div className='flex flex-row w-fit items-center'>
-                            <Image
-                                alt="avatar image"
-                                src={returnImageProxy(lesson.author?.avatar, lesson.author?.username)}
-                                width={50}
-                                height={50}
-                                className="rounded-full mr-4"
-                            />
-                            <p className='text-lg text-white'>
-                                Created by{' '}
-                                <a rel='noreferrer noopener' target='_blank' className='text-blue-300 hover:underline'>
-                                    {lesson.author?.username || lesson.author?.pubkey}
-                                </a>
-                            </p>
-                        </div>
-                        <GenericButton
-                            tooltip={isMobileView ? null : "View Nostr Note"}
-                            tooltipOptions={{ position: 'left' }}
-                            icon="pi pi-external-link"
-                            outlined
-                            onClick={() => {
-                                window.open(`https://habla.news/a/${nAddress}`, '_blank');
-                            }}
-                        />
-                    </div>
-                </div>
-                {lesson?.additionalLinks && lesson.additionalLinks.length > 0 && (
-                    <div className='mt-6'>
-                        <h3 className='text-lg font-semibold mb-2 text-white'>External links:</h3>
-                        <ul className='list-disc list-inside text-white'>
-                            {lesson.additionalLinks.map((link, index) => (
-                                <li key={index}>
-                                    <a href={link} target="_blank" rel="noopener noreferrer" className='text-blue-300 hover:underline'>
-                                        {new URL(link).hostname}
-                                    </a>
-                                </li>
-                            ))}
-                        </ul>
-                    </div>
-                )}
             </div>
         </div>
     )
diff --git a/src/components/content/documents/DocumentDetails.js b/src/components/content/documents/DocumentDetails.js
index 6bc2617..9d28be7 100644
--- a/src/components/content/documents/DocumentDetails.js
+++ b/src/components/content/documents/DocumentDetails.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, useRef } from "react";
 import axios from "axios";
 import { useToast } from "@/hooks/useToast";
 import { Tag } from "primereact/tag";
@@ -13,6 +13,8 @@ import { getTotalFromZaps } from "@/utils/lightning";
 import { useSession } from "next-auth/react";
 import useWindowWidth from "@/hooks/useWindowWidth";
 import dynamic from "next/dynamic";
+import { Toast } from "primereact/toast";
+import MoreOptionsMenu from "@/components/ui/MoreOptionsMenu";
 
 const MDDisplay = dynamic(
     () => import("@uiw/react-markdown-preview"),
@@ -31,25 +33,8 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
     const { showToast } = useToast();
     const windowWidth = useWindowWidth();
     const isMobileView = windowWidth <= 768;
-
-    useEffect(() => {
-        if (zaps.length > 0) {
-            const total = getTotalFromZaps(zaps, processedEvent);
-            setZapAmount(total);
-        }
-    }, [zaps, processedEvent]);
-
-    useEffect(() => {
-        if (isLesson) {
-            axios.get(`/api/resources/${processedEvent.d}`).then(res => {
-                if (res.data && res.data.lessons[0]?.courseId) {
-                    setCourse(res.data.lessons[0]?.courseId);
-                }
-            }).catch(err => {
-                console.error('err', err);
-            });
-        }
-    }, [processedEvent.d, isLesson]);
+    const menuRef = useRef(null);
+    const toastRef = useRef(null);
 
     const handleDelete = async () => {
         try {
@@ -70,6 +55,63 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
         }
     }
 
+    const authorMenuItems = [
+        {
+            label: 'Edit',
+            icon: 'pi pi-pencil',
+            command: () => router.push(`/details/${processedEvent.id}/edit`)
+        },
+        {
+            label: 'Delete',
+            icon: 'pi pi-trash',
+            command: handleDelete
+        },
+        {
+            label: 'View Nostr note',
+            icon: 'pi pi-globe',
+            command: () => {
+                window.open(`https://habla.news/a/${nAddress}`, '_blank');
+            }
+        }
+    ];
+
+    const userMenuItems = [
+        {
+            label: 'View Nostr note',
+            icon: 'pi pi-globe',
+            command: () => {
+                window.open(`https://habla.news/a/${nAddress}`, '_blank');
+            }
+        }
+    ];
+
+    if (course) {
+        userMenuItems.unshift({
+            label: isMobileView ? 'Course' : 'Open Course',
+            icon: 'pi pi-external-link',
+            command: () => window.open(`/course/${course}`, '_blank')
+        });
+    }
+
+    useEffect(() => {
+        if (zaps.length > 0) {
+            const total = getTotalFromZaps(zaps, processedEvent);
+            setZapAmount(total);
+        }
+    }, [zaps, processedEvent]);
+
+    useEffect(() => {
+        if (isLesson) {
+            axios.get(`/api/resources/${processedEvent.d}`).then(res => {
+                if (res.data && res.data.lessons[0]?.courseId) {
+                    setCourse(res.data.lessons[0]?.courseId);
+                }
+            }).catch(err => {
+                console.error('err', err);
+            });
+        }
+    }, [processedEvent.d, isLesson]);
+
     const renderPaymentMessage = () => {
         if (session?.user && session.user?.role?.subscribed && decryptedContent) {
             return <GenericButton tooltipOptions={{ position: 'top' }} tooltip={`You are subscribed so you can access all paid content`} icon="pi pi-check" label="Subscribed" severity="success" outlined size="small" className="cursor-default hover:opacity-100 hover:bg-transparent focus:ring-0" />
@@ -99,7 +141,7 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
             return (
                 <div className="w-full px-4">
 
-                    <div className="w-full p-8 rounded-lg flex flex-col items-center justify-center bg-gray-800">
+                    <div className="w-full p-8 rounded-lg flex flex-col items-center justify-center">
                         <div className="mx-auto py-auto">
                             <i className="pi pi-lock text-[60px] text-red-500"></i>
                         </div>
@@ -127,6 +169,7 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
 
     return (
         <div className="w-full">
+            <Toast ref={toastRef} />
             <div className="relative w-full h-[400px] mb-8">
                 <Image
                     alt="background image"
@@ -140,42 +183,24 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
                 <div className="mb-8 bg-gray-800/70 rounded-lg p-4 max-mob:rounded-t-none max-tab:rounded-t-none">
                     <div className="flex flex-row items-center justify-between w-full">
                         <h1 className='text-4xl font-bold text-white'>{title}</h1>
-                        <div className="flex flex-wrap gap-2">
-                            {topics && topics.length > 0 && (
-                                topics.map((topic, index) => (
-                                    <Tag className='text-[#f8f8ff]' key={index} value={topic}></Tag>
-                                ))
-                            )}
-                            {isLesson && <Tag size="small" className="text-[#f8f8ff]" value="lesson" />}
-                        </div>
+                        <ZapDisplay
+                            zapAmount={zapAmount}
+                            event={processedEvent}
+                            zapsLoading={zapsLoading && zapAmount === 0}
+                        />
+                    </div>
+                    <div className="flex flex-wrap gap-2 mt-2 mb-4">
+                        {topics && topics.length > 0 && (
+                            topics.map((topic, index) => (
+                                <Tag className='text-[#f8f8ff]' key={index} value={topic}></Tag>
+                            ))
+                        )}
+                        {isLesson && <Tag size="small" className="text-[#f8f8ff]" value="lesson" />}
                     </div>
                     {(summary)?.split('\n').map((line, index) => (
                         <p key={index}>{line}</p>
                     ))}
-                    {processedEvent?.additionalLinks && processedEvent?.additionalLinks.length > 0 && (
-                        <div className="my-4">
-                            <p>Additional Links:</p>
-                            {processedEvent.additionalLinks.map((link, index) => (
-                                <div key={index} className="mb-2">
-                                    <a
-                                        className="text-blue-500 hover:underline hover:text-blue-600 break-words"
-                                        href={link}
-                                        target="_blank"
-                                        rel="noopener noreferrer"
-                                        style={{
-                                            wordBreak: 'break-word',
-                                            overflowWrap: 'break-word',
-                                            display: 'inline-block',
-                                            maxWidth: '100%'
-                                        }}
-                                    >
-                                        {link}
-                                    </a>
-                                </div>
-                            ))}
-                        </div>
-                    )}
-                    <div className='flex items-center justify-between'>
+                    <div className='flex items-center justify-between mt-8'>
                         <div className='flex items-center'>
                             <Image
                                 alt="avatar image"
@@ -191,48 +216,16 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
                                 </a>
                             </p>
                         </div>
-                        <ZapDisplay
-                            zapAmount={zapAmount}
-                            event={processedEvent}
-                            zapsLoading={zapsLoading && zapAmount === 0}
-                        />
+                        <div className="flex justify-end">
+                            <MoreOptionsMenu 
+                                menuItems={authorView ? authorMenuItems : userMenuItems}
+                                additionalLinks={processedEvent?.additionalLinks || []}
+                                isMobileView={isMobileView}
+                            />
+                        </div>
                     </div>
-                    <div className='w-full mt-8 flex flex-wrap justify-between items-center'>
-                        {authorView ? (
-                            <div className='flex space-x-2 mt-4 sm:mt-0'>
-                                {renderPaymentMessage()}
-                                <div className="flex flex-row gap-2">
-                                    <GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined />
-                                    <GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined />
-                                    <GenericButton
-                                        tooltip={isMobileView ? null : "View Nostr Note"}
-                                        tooltipOptions={{ position: 'left' }}
-                                        icon="pi pi-external-link"
-                                        outlined
-                                        onClick={() => {
-                                            window.open(`https://habla.news/a/${nAddress}`, '_blank');
-                                        }}
-                                    />
-                                </div>
-                            </div>
-                        ) : (
-                            <div className="w-full flex flex-row justify-between gap-2">
-                                {renderPaymentMessage()}
-                                <div className="flex flex-row justify-end gap-2">
-                                    {course && <GenericButton size={isMobileView ? 'small' : null} outlined icon="pi pi-external-link" onClick={() => window.open(`/course/${course}`, '_blank')} label={isMobileView ? "Course" : "Open Course"} tooltip="This is a lesson in a course" tooltipOptions={{ position: 'top' }} />}
-                                    <GenericButton
-                                        size={isMobileView ? 'small' : null}
-                                        tooltip={isMobileView ? null : "View Nostr Note"}
-                                        tooltipOptions={{ position: 'left' }}
-                                        icon="pi pi-external-link"
-                                        outlined
-                                        onClick={() => {
-                                            window.open(`https://habla.news/a/${nAddress}`, '_blank');
-                                        }}
-                                    />
-                                </div>
-                            </div>
-                        )}
+                    <div className='w-full mt-4'>
+                        {renderPaymentMessage()}
                     </div>
                 </div>
                 {renderContent()}
diff --git a/src/components/content/videos/VideoDetails.js b/src/components/content/videos/VideoDetails.js
index b2bd5bd..167e698 100644
--- a/src/components/content/videos/VideoDetails.js
+++ b/src/components/content/videos/VideoDetails.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, useRef } from "react";
 import axios from "axios";
 import { useToast } from "@/hooks/useToast";
 import { Tag } from "primereact/tag";
@@ -13,6 +13,8 @@ import { getTotalFromZaps } from "@/utils/lightning";
 import { useSession } from "next-auth/react";
 import useWindowWidth from "@/hooks/useWindowWidth";
 import dynamic from "next/dynamic";
+import { Toast } from "primereact/toast";
+import MoreOptionsMenu from "@/components/ui/MoreOptionsMenu";
 
 const MDDisplay = dynamic(
     () => import("@uiw/react-markdown-preview"),
@@ -31,25 +33,8 @@ const VideoDetails = ({ processedEvent, topics, title, summary, image, price, au
     const { showToast } = useToast();
     const windowWidth = useWindowWidth();
     const isMobileView = windowWidth <= 768;
-
-    useEffect(() => {
-        if (isLesson) {
-            axios.get(`/api/resources/${processedEvent.d}`).then(res => {
-                if (res.data && res.data.lessons[0]?.courseId) {
-                    setCourse(res.data.lessons[0]?.courseId);
-                }
-            }).catch(err => {
-                console.error('err', err);
-            });
-        }
-    }, [processedEvent.d, isLesson]);
-
-    useEffect(() => {
-        if (zaps.length > 0) {
-            const total = getTotalFromZaps(zaps, processedEvent);
-            setZapAmount(total);
-        }
-    }, [zaps, processedEvent]);
+    const menuRef = useRef(null);
+    const toastRef = useRef(null);
 
     const handleDelete = async () => {
         try {
@@ -70,6 +55,63 @@ const VideoDetails = ({ processedEvent, topics, title, summary, image, price, au
         }
     }
 
+    const authorMenuItems = [
+        {
+            label: 'Edit',
+            icon: 'pi pi-pencil',
+            command: () => router.push(`/details/${processedEvent.id}/edit`)
+        },
+        {
+            label: 'Delete',
+            icon: 'pi pi-trash',
+            command: handleDelete
+        },
+        {
+            label: 'View Nostr note',
+            icon: 'pi pi-globe',
+            command: () => {
+                window.open(`https://habla.news/a/${nAddress}`, '_blank');
+            }
+        }
+    ];
+
+    const userMenuItems = [
+        {
+            label: 'View Nostr note',
+            icon: 'pi pi-globe',
+            command: () => {
+                window.open(`https://habla.news/a/${nAddress}`, '_blank');
+            }
+        }
+    ];
+
+    if (course) {
+        userMenuItems.unshift({
+            label: isMobileView ? 'Course' : 'Open Course',
+            icon: 'pi pi-external-link',
+            command: () => window.open(`/course/${course}`, '_blank')
+        });
+    }
+
+    useEffect(() => {
+        if (isLesson) {
+            axios.get(`/api/resources/${processedEvent.d}`).then(res => {
+                if (res.data && res.data.lessons[0]?.courseId) {
+                    setCourse(res.data.lessons[0]?.courseId);
+                }
+            }).catch(err => {
+                console.error('err', err);
+            });
+        }
+    }, [processedEvent.d, isLesson]);
+
+    useEffect(() => {
+        if (zaps.length > 0) {
+            const total = getTotalFromZaps(zaps, processedEvent);
+            setZapAmount(total);
+        }
+    }, [zaps, processedEvent]);
+
     const renderPaymentMessage = () => {
         if (session?.user && session.user?.role?.subscribed && decryptedContent) {
             return <GenericButton tooltipOptions={{ position: 'top' }} tooltip={`You are subscribed so you can access all paid content`} icon="pi pi-check" label="Subscribed" severity="success" outlined size="small" className="cursor-default hover:opacity-100 hover:bg-transparent focus:ring-0" />
@@ -130,37 +172,9 @@ const VideoDetails = ({ processedEvent, topics, title, summary, image, price, au
         return null;
     }
 
-    const renderAdditionalLinks = () => {
-        if (processedEvent?.additionalLinks && processedEvent.additionalLinks.length > 0) {
-            return (
-                <div className="my-4">
-                    <p>Additional Links:</p>
-                    {processedEvent.additionalLinks.map((link, index) => (
-                        <div key={index} className="mb-2">
-                            <a
-                                className="text-blue-500 hover:underline hover:text-blue-600 break-words"
-                                href={link}
-                                target="_blank"
-                                rel="noopener noreferrer"
-                                style={{
-                                    wordBreak: 'break-word',
-                                    overflowWrap: 'break-word',
-                                    display: 'inline-block',
-                                    maxWidth: '100%'
-                                }}
-                            >
-                                {link}
-                            </a>
-                        </div>
-                    ))}
-                </div>
-            );
-        }
-        return null;
-    };
-
     return (
         <div className="w-full">
+            <Toast ref={toastRef} />
             {renderContent()}
             <div className="bg-gray-800/90 rounded-lg p-4 m-4 max-mob:m-0 max-tab:m-0 max-mob:rounded-t-none max-tab:rounded-t-none">
                 <div className={`w-full flex flex-col items-start justify-start mt-2 px-2`}>
@@ -183,65 +197,39 @@ const VideoDetails = ({ processedEvent, topics, title, summary, image, price, au
                         </div>
                     </div>
                     <div className='flex flex-row items-center justify-between w-full'>
-                        <div className="mt-4 max-mob:text-base max-tab:text-base">
+                        <div className="my-4 max-mob:text-base max-tab:text-base">
                             {(summary)?.split('\n').map((line, index) => (
                                 <p key={index}>{line}</p>
                             ))}
-                            {renderAdditionalLinks()}
                         </div>
                     </div>
-                    <div className='flex items-center'>
-                        <Image
-                            alt="avatar image"
-                            src={returnImageProxy(author?.avatar, author?.username)}
-                            width={50}
-                            height={50}
-                            className="rounded-full mr-4"
-                        />
-                        <p className='text-lg text-white'>
-                            By{' '}
-                            <a rel='noreferrer noopener' target='_blank' className='text-blue-300 hover:underline'>
-                                {author?.username}
-                            </a>
-                        </p>
+                    <div className='flex items-center justify-between w-full'>
+                        <div className='flex items-center'>
+                            <Image
+                                alt="avatar image"
+                                src={returnImageProxy(author?.avatar, author?.username)}
+                                width={50}
+                                height={50}
+                                className="rounded-full mr-4"
+                            />
+                            <p className='text-lg text-white'>
+                                By{' '}
+                                <a rel='noreferrer noopener' target='_blank' className='text-blue-300 hover:underline'>
+                                    {author?.username}
+                                </a>
+                            </p>
+                        </div>
+                        <div className="flex justify-end">
+                            <MoreOptionsMenu 
+                                menuItems={authorView ? authorMenuItems : userMenuItems}
+                                additionalLinks={processedEvent?.additionalLinks || []}
+                                isMobileView={isMobileView}
+                            />
+                        </div>
                     </div>
                 </div>
-                <div className="w-full flex flex-row justify-end mt-4">
-                    {authorView ? (
-                        <div className='flex space-x-2 mt-4 sm:mt-0'>
-                            {renderPaymentMessage()}
-                            <div className="flex flex-row justify-end">
-                                <GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined />
-                                <GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined />
-                                <GenericButton
-                                    tooltip={isMobileView ? null : "View Nostr Note"}
-                                    tooltipOptions={{ position: 'left' }}
-                                    icon="pi pi-external-link"
-                                    outlined
-                                    onClick={() => {
-                                        window.open(`https://habla.news/a/${nAddress}`, '_blank');
-                                    }}
-                                />
-                            </div>
-                        </div>
-                    ) : (
-                        <div className="w-full flex flex-row justify-between">
-                            {renderPaymentMessage()}
-                            <div className="flex flex-row justify-end">
-                                {course && <GenericButton size={isMobileView ? 'small' : null} outlined icon="pi pi-external-link" onClick={() => window.open(`/course/${course}`, '_blank')} label={isMobileView ? "Course" : "Open Course"} tooltip="This is a lesson in a course" tooltipOptions={{ position: 'top' }} />}
-                                <GenericButton
-                                    size={isMobileView ? 'small' : null}
-                                    tooltip={isMobileView ? null : "View Nostr Note"}
-                                    tooltipOptions={{ position: 'left' }}
-                                    icon="pi pi-external-link"
-                                    outlined
-                                    onClick={() => {
-                                        window.open(`https://habla.news/a/${nAddress}`, '_blank');
-                                    }}
-                                />
-                            </div>
-                        </div>
-                    )}
+                <div className="w-full flex justify-start mt-4">
+                    {renderPaymentMessage()}
                 </div>
             </div>
         </div>
diff --git a/src/components/ui/MoreOptionsMenu.js b/src/components/ui/MoreOptionsMenu.js
new file mode 100644
index 0000000..de13f99
--- /dev/null
+++ b/src/components/ui/MoreOptionsMenu.js
@@ -0,0 +1,69 @@
+import React, { useRef } from "react";
+import { Menu } from "primereact/menu";
+import GenericButton from "@/components/buttons/GenericButton";
+
+/**
+ * A reusable component for displaying a "more options" menu with optional additional links section
+ * 
+ * @param {Object} props - Component props
+ * @param {Array} props.menuItems - Array of primary menu items
+ * @param {Array} props.additionalLinks - Array of additional links to add to the menu
+ * @param {boolean} props.isMobileView - Whether the view is mobile
+ * @param {function} props.onLinkClick - Function to be called when a link is clicked
+ */
+const MoreOptionsMenu = ({ 
+    menuItems, 
+    additionalLinks = [], 
+    isMobileView = false,
+    onLinkClick = (url) => window.open(url, '_blank')
+}) => {
+    const menuRef = useRef(null);
+    
+    // Create a copy of the menu items
+    const updatedMenuItems = [...menuItems];
+    
+    // Add a separator and additional links if they exist
+    if (additionalLinks && additionalLinks.length > 0) {
+        // Add separator
+        updatedMenuItems.push({ separator: true, className: "my-2" });
+        
+        // Add header for additional links
+        updatedMenuItems.push({ 
+            label: 'EXTERNAL LINKS', 
+            disabled: true,
+            className: 'text-sm font-semibold text-gray-400'
+        });
+        
+        // Add each additional link
+        additionalLinks.forEach((link, index) => {
+            let hostname;
+            try {
+                hostname = new URL(link).hostname;
+            } catch (e) {
+                hostname = link; // Fallback if URL parsing fails
+            }
+            
+            updatedMenuItems.push({
+                label: `${hostname}`,
+                icon: 'pi pi-external-link',
+                command: () => onLinkClick(link)
+            });
+        });
+    }
+    
+    return (
+        <div className="more-options-menu">
+            <Menu model={updatedMenuItems} popup ref={menuRef} />
+            <GenericButton
+                icon="pi pi-ellipsis-v"
+                onClick={(e) => menuRef.current.toggle(e)}
+                aria-label="More options"
+                className="p-button-text"
+                tooltip={isMobileView ? null : "More options"}
+                tooltipOptions={{ position: 'top' }}
+            />
+        </div>
+    );
+};
+
+export default MoreOptionsMenu; 
\ No newline at end of file
diff --git a/src/hooks/tracking/useTrackDocumentLesson.js b/src/hooks/tracking/useTrackDocumentLesson.js
index c61a712..35bc9e7 100644
--- a/src/hooks/tracking/useTrackDocumentLesson.js
+++ b/src/hooks/tracking/useTrackDocumentLesson.js
@@ -105,7 +105,7 @@ const useTrackDocumentLesson = ({ lessonId, courseId, readTime, paidCourse, decr
     }
   }, [timeSpent, markLessonAsCompleted, readTime, isAdmin]);
 
-  return { isCompleted, isTracking };
+  return { isCompleted, isTracking, markLessonAsCompleted };
 };
 
 export default useTrackDocumentLesson;
\ No newline at end of file
diff --git a/src/hooks/tracking/useTrackVideoLesson.js b/src/hooks/tracking/useTrackVideoLesson.js
index f322977..e778fbf 100644
--- a/src/hooks/tracking/useTrackVideoLesson.js
+++ b/src/hooks/tracking/useTrackVideoLesson.js
@@ -134,7 +134,7 @@ const useTrackVideoLesson = ({lessonId, videoDuration, courseId, videoPlayed, pa
     }
   }, [timeSpent, videoDuration, markLessonAsCompleted, isAdmin]);
 
-  return { isCompleted, isTracking };
+  return { isCompleted, isTracking, markLessonAsCompleted };
 };
 
 export default useTrackVideoLesson;
\ No newline at end of file