import CourseCard1 from '@/components/cards/course-card-1'; import RatingStars from '@/components/rating-stars'; import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'; import { Button } from '@/components/ui/button'; import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip'; import LandingLayout from '@/layouts/landing-layout'; import { getQueryParams } from '@/lib/route'; import { SharedData } from '@/types/global'; import { Head, router, usePage } from '@inertiajs/react'; import { Book, Grid, List, Star, Users } from 'lucide-react'; import { ReactNode } from 'react'; interface InstructorPageProps extends SharedData { instructor: Instructor; } const Show = ({ instructor, system, translate }: InstructorPageProps & { translate: any }) => { const { url } = usePage(); const urlParams = getQueryParams(url); const viewType = urlParams['view'] ?? 'grid'; const { frontend } = translate; const { id, user, courses, total_reviews_count, total_average_rating, total_enrollments_count } = instructor; // Generate meta information for the instructor const pageTitle = `${user.name} - ${frontend.expert_instructor} | ${system.fields?.name}`; const pageDescription = `${frontend.learn_from} ${user.name}, ${frontend.expert_instructor_with} ${courses.length} ${frontend.courses_and} ${total_enrollments_count} ${frontend.students}. ${frontend.average_rating}: ${total_average_rating ? Number(total_average_rating).toFixed(1) : frontend.new} ${frontend.stars}.`; const pageKeywords = `${user.name}, instructor, online courses, ${system.fields?.keywords || frontend.instructor_fallback_keywords}, teacher, expert`; const instructorImage = user.photo || ''; const siteName = system.fields?.name; const siteUrl = url; const siteOrigin = typeof window !== 'undefined' ? window.location.origin : url.split('/').slice(0, 3).join('/'); const rating = total_average_rating ? Number(total_average_rating).toFixed(1) : null; return (
{pageTitle} {/* Open Graph Tags */} {/* Profile specific Open Graph */} {user.name.split(' ').length > 1 && } {/* Twitter Card Tags */} {instructorImage && } {/* Instructor-specific meta */} {rating && } {/* Schema.org structured data */} {/* Instructor Profile Card */}
{user.name.charAt(0)}

{user.name}

{user.email}

{total_average_rating ? Number(total_average_rating).toFixed(1) : 0}
{total_enrollments_count} {frontend.students}
{courses.length} {frontend.courses}
{total_reviews_count} {frontend.reviews}
{/* Course List Header */}

{frontend.all_courses}

{frontend.grid_view}

{frontend.list_view}

{courses.map((course) => ( ))}
); }; Show.layout = (page: ReactNode) => ; export default Show;