import Tabs from '@/components/tabs'; import { Separator } from '@/components/ui/separator'; import { TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'; import LandingLayout from '@/layouts/landing-layout'; import { SharedData } from '@/types/global'; import { Head } from '@inertiajs/react'; import { ReactNode } from 'react'; import CourseHeader from './partials/course-header'; import CoursePreview from './partials/course-preview'; import CourseReviews from './partials/course-reviews'; import Curriculum from './partials/curriculum'; import Details from './partials/details'; import Instructor from './partials/instructor'; import Overview from './partials/overview'; export interface CourseDetailsProps extends SharedData { course: Course; enrollment: CourseEnrollment; watchHistory: WatchHistory | null; approvalStatus: CourseApprovalValidation; wishlists: CourseWishlist[]; reviews: Pagination; totalReviews: CourseTotalReview; } const Show = ({ course, system, translate }: CourseDetailsProps & { translate: any }) => { const { button, frontend } = translate; const tabs = [ { value: 'overview', label: button.overview, Component: , }, { value: 'curriculum', label: button.curriculum, Component: , }, { value: 'details', label: button.details, Component:
, }, { value: 'instructor', label: button.instructor, Component: , }, { value: 'reviews', label: button.reviews, Component: , }, ].filter((tab) => { if (tab.value === 'instructor') { return system.sub_type === 'collaborative' ? true : false; } return true; }); // Generate meta information for the course const pageTitle = course.meta_title || `${course.title} | ${system.fields?.name}`; const pageDescription = course.meta_description || course.short_description || course.description || frontend.learn_comprehensive_course; const pageKeywords = course.meta_keywords || `${course.title}, ${frontend.online_course_learning_lms}, ${system.fields?.keywords || 'LMS'}`; const ogTitle = course.og_title || course.title; const ogDescription = course.og_description || pageDescription; const courseImage = course.thumbnail || ''; const siteName = system.fields?.name; const siteUrl = window.location.href; return ( <> {pageTitle} {/* Open Graph Tags */} {/* Open Graph Image */} {/* Twitter Card Tags */} {courseImage && } {/* Course-specific meta */} {course.instructor && } {/* Schema.org structured data */}
{tabs.map(({ label, value }) => ( {label} ))}
{tabs.map(({ value, Component }) => ( {Component} ))}
); }; Show.layout = (page: ReactNode) => ; export default Show;