"use client" import { useEffect, useState } from "react" import { useParams, useRouter } from "next/navigation" import { Calendar, User, BookOpen, Wallet, Award, Share2, Download, CheckCircle, AlertCircle } from "lucide-react" import { toast } from "react-hot-toast" interface Certificate { certificate_id: string share_code: string user_name: string student_name: string course_title: string mentor_name: string instructor_name: string completion_date: string wallet_address?: string issued_by: string view_count: number blockchain_hash?: string public_url?: string verification_url?: string is_verified: boolean is_revoked: boolean } export default function CertificatePage() { const params = useParams() const router = useRouter() const [certificate, setCertificate] = useState(null) const [loading, setLoading] = useState(true) const [error, setError] = useState(null) const certificateId = params?.id as string useEffect(() => { if (certificateId) { fetchCertificate(certificateId) } }, [certificateId]) const fetchCertificate = async (id: string) => { try { setLoading(true) setError(null) console.log(`🔍 Fetching certificate with ID: ${id}`) let response = null // Try verify endpoint first try { console.log(`🔍 Trying verify endpoint: /api/certificate/verify/${id}`) response = await fetch(`http://127.0.0.1:5000/api/certificate/verify/${id}`) if (response.ok) { const data = await response.json() if (data.success && data.verified) { console.log('✅ Found certificate by verify endpoint') setCertificate(data.certificate) setLoading(false) return } } } catch (error) { console.log('Verify endpoint failed, trying next...') } // Try direct ID endpoint try { console.log(`🔍 Trying direct endpoint: /api/certificate/${id}`) response = await fetch(`http://127.0.0.1:5000/api/certificate/${id}`) if (response.ok) { const data = await response.json() if (data.success) { console.log('✅ Found certificate by direct endpoint') setCertificate(data.certificate) setLoading(false) return } } } catch (error) { console.log('Direct endpoint failed') } console.error('❌ Certificate not found in any endpoint') setError("Certificate not found") setLoading(false) } catch (error) { console.error('❌ Error fetching certificate:', error) setError("Failed to load certificate") setLoading(false) } } const handleDownloadPDF = () => { if (!certificate) return try { const certificateHTML = ` Certificate - ${certificate.user_name}

🏆

CERTIFICATE OF COMPLETION

This is to certify that

${certificate.user_name}

has successfully completed the course

"${certificate.course_title}"

✅ Completed on: ${new Date(certificate.completion_date).toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' })}

${certificate.mentor_name}

Course Instructor

Certificate ID: ${certificate.certificate_id}
OpenLearnX Learning Platform
🔒 Blockchain Verified Completion

` const printWindow = window.open('', '_blank') if (printWindow) { printWindow.document.write(certificateHTML) printWindow.document.close() printWindow.onload = () => { setTimeout(() => { printWindow.print() printWindow.close() }, 500) } toast.success("Certificate PDF download initiated!") } else { toast.error("Popup blocked. Please allow popups and try again.") } } catch (error) { console.error('PDF generation error:', error) toast.error("Failed to generate PDF") } } const handleShare = async () => { if (!certificate) return const shareText = `🎓 Check out my certificate of completion for "${certificate.course_title}" from OpenLearnX!\n\nStudent: ${certificate.user_name}\nCertificate ID: ${certificate.certificate_id}\n\n#OpenLearnX #Certificate #Learning` const shareUrl = window.location.href if (navigator.share) { try { await navigator.share({ title: `Certificate - ${certificate.course_title}`, text: shareText, url: shareUrl }) // Track share try { await fetch(`http://127.0.0.1:5000/api/certificate/share/${certificate.certificate_id}`, { method: 'POST' }) } catch (e) { console.log('Share tracking failed:', e) } } catch (error) { console.log('Share cancelled') } } else { try { await navigator.clipboard.writeText(`${shareText}\n\n${shareUrl}`) toast.success("Certificate link copied to clipboard!") // Track share try { await fetch(`http://127.0.0.1:5000/api/certificate/share/${certificate.certificate_id}`, { method: 'POST' }) } catch (e) { console.log('Share tracking failed:', e) } } catch (error) { toast.error("Failed to copy link") } } } if (loading) { return (

Loading certificate...

Certificate ID: {certificateId}

) } if (error) { return (

Certificate Not Found

{error}

Certificate ID: {certificateId}

) } if (!certificate) { return (

No certificate data available

) } return (

Verified Certificate

This certificate has been verified on the blockchain

Verified

🏆