"use client"; import React, { useState } from 'react'; import Link from 'next/link'; import { PlaySquare, ThumbsUp, Activity, BarChart2, AlertCircle, TrendingUp, HelpCircle, Shield, Award, Users, DollarSign, Sparkles, Zap, CheckCircle2 } from 'lucide-react'; interface LikeData { id: string; dateCreated: string; likes: number; dislikes: number; rating: number; viewCount: number; deleted: boolean; } export default function LikeCounterPage() { const [url, setUrl] = useState(''); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); const [data, setData] = useState(null); const extractVideoId = (url: string) => { const regExp = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|&v=)([^#&?]*).*/; const match = url.match(regExp); return (match && match[2].length === 11) ? match[2] : null; }; const handleCheck = async (e: React.FormEvent) => { e.preventDefault(); setError(null); setData(null); setLoading(true); try { const videoId = extractVideoId(url); if (!videoId) { throw new Error("Invalid YouTube URL. Please enter a valid video link."); } const response = await fetch(`https://returnyoutubedislikeapi.com/votes?videoId=${videoId}`); if (!response.ok) { throw new Error("Failed to fetch data. The API might be down or rate limited."); } const result = await response.json(); setData(result); } catch (err: any) { setError(err.message || "An error occurred"); } finally { setLoading(false); } }; const formatNumber = (num: number) => { return new Intl.NumberFormat('en-US').format(num); }; const calculateEngagementRate = (likes: number, views: number) => { if (views === 0) return '0.00'; return ((likes / views) * 100).toFixed(2); }; return ( <> {/* Structured Data: WebApplication & FAQPage */}