Wednesday, February 19, 2025

SEO Analysis Dashboard

import React, { useState } from 'react'; import { AlertTriangle, CheckCircle, XCircle, Info, ChevronDown, ChevronUp } from 'lucide-react'; import { motion, AnimatePresence } from 'framer-motion'; const SEOAnalyzer = () => { const [url, setUrl] = useState(''); const [content, setContent] = useState(''); const [loading, setLoading] = useState(false); const [results, setResults] = useState(null); const [expandedSections, setExpandedSections] = useState({}); const analyzeSEO = async (e) => { e.preventDefault(); setLoading(true); // Simulate analysis with setTimeout setTimeout(() => { const analysisResults = { score: 75, sections: { meta: { status: 'warning', score: 70, issues: [ 'Meta description is too short (current: 120 characters, recommended: 150-160)', 'Meta title could be more descriptive' ] }, headings: { status: 'passed', score: 90, issues: [] }, content: { status: 'critical', score: 60, issues: [ 'Keyword density is too low (0.5%)', 'Content length is below recommended minimum' ] }, links: { status: 'warning', score: 80, issues: [ 'Found 2 broken internal links', 'External links missing rel attributes' ] } } }; setResults(analysisResults); setLoading(false); }, 2000); }; const toggleSection = (section) => { setExpandedSections(prev => ({ ...prev, [section]: !prev[section] })); }; const getStatusIcon = (status) => { switch (status) { case 'passed': return ; case 'warning': return ; case 'critical': return ; default: return ; } }; return (

SEO Analysis Dashboard

setUrl(e.target.value)} className="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500" placeholder="https://example.com" required />