import React, { useMemo, useState } from "react"; import { motion } from "framer-motion"; import { BarChart3, ExternalLink, Globe, Linkedin, Newspaper, Search, TrendingUp, Users, Activity, MousePointerClick } from "lucide-react"; import { Card, CardContent } from "@/components/ui/card"; import { Button } from "@/components/ui/button"; const channels = [ { name: "X — Brand", type: "Social", url: "https://x.com/eldora_rwa", impressions: 48300, engagement: 3067, rate: 6.35, visits: 1500, followers: 624, status: "Primary", }, { name: "X — Founder", type: "Social", url: "https://x.com/swisstatoshi", impressions: 32100, engagement: 2286, rate: 7.12, visits: 1000, followers: 362, status: "High signal", }, { name: "LinkedIn — Brand", type: "Professional", url: "https://www.linkedin.com/company/eldora-rwa/", impressions: 26900, engagement: 1474, rate: 5.48, visits: 684, followers: 182, status: "Credibility", }, { name: "Medium", type: "Content", url: "https://medium.com/@eldora_do", impressions: 17800, engagement: 1444, rate: 8.11, visits: 382, followers: 74, status: "Education", }, { name: "Substack", type: "Newsletter", url: "https://substack.com/@eldora3", impressions: 12800, engagement: 902, rate: 7.05, visits: 318, followers: 96, status: "Retention", }, { name: "Website", type: "Owned", url: "https://eldora.network/", impressions: 21400, engagement: 1169, rate: 5.46, visits: 2100, followers: 0, status: "Conversion", }, { name: "App", type: "Product", url: "https://app.eldora.do/", impressions: 9600, engagement: 611, rate: 6.36, visits: 2600, followers: 0, status: "Activation", }, ]; const daily = [ { date: "Apr 27", impressions: 14200, engagement: 920, visits: 410 }, { date: "Apr 28", impressions: 16600, engagement: 1080, visits: 520 }, { date: "Apr 29", impressions: 18400, engagement: 1210, visits: 590 }, { date: "Apr 30", impressions: 21600, engagement: 1510, visits: 740 }, { date: "May 1", impressions: 19800, engagement: 1320, visits: 680 }, { date: "May 2", impressions: 17000, engagement: 1160, visits: 610 }, { date: "May 3", impressions: 17400, engagement: 1210, visits: 650 }, ]; function formatNumber(num) { if (num >= 1000000) return ${(num / 1000000).toFixed(1)}M; if (num >= 1000) return ${(num / 1000).toFixed(1)}K; return String(num); } function StatCard({ label, value, change, icon: Icon }) { return ( {label} {value} ↑ {change} vs prev week ); } function SimpleLineChart({ data }) { const width = 900; const height = 260; const padding = 36; const maxValue = Math.max(...data.map((d) => d.impressions)); const getX = (i) => padding + (i * (width - padding * 2)) / (data.length - 1); const getY = (value) => height - padding - (value / maxValue) * (height - padding * 2); const buildPath = (key) => data.map((d, i) => ${i === 0 ? "M" : "L"}${getX(i)},${getY(d[key])}).join(" "); return ( {[0, 0.25, 0.5, 0.75, 1].map((ratio) => { const y = height - padding - ratio * (height - padding * 2); return ; })} {data.map((d, i) => ( {d.date} ))} ); } export default function EldoraSocialDashboard() { const [query, setQuery] = useState(""); const [selectedType, setSelectedType] = useState("All"); const filtered = useMemo(() => { return channels.filter((channel) => { const matchQuery = channel.name.toLowerCase().includes(query.toLowerCase()); const matchType = selectedType === "All" || channel.type === selectedType; return matchQuery && matchType; }); }, [query, selectedType]); const totals = useMemo(() => { const sum = channels.reduce( (acc, item) => ({ impressions: acc.impressions + item.impressions, engagement: acc.engagement + item.engagement, visits: acc.visits + item.visits, followers: acc.followers + item.followers, }), { impressions: 0, engagement: 0, visits: 0, followers: 0 } ); return { ...sum, rate: ((sum.engagement / sum.impressions) * 100).toFixed(2) }; }, []); const maxImpressions = Math.max(...channels.map((c) => c.impressions)); const types = ["All", ...new Set(channels.map((c) => c.type))]; return ( e Eldora Social Analytics Channels {channels.slice(0, 5).map((item) => ( {item.type === "Professional" ? : item.type === "Content" || item.type === "Newsletter" ? : } {item.name} ))} All Channels Apr 27 – May 3, 2026 System-level performance across social, content, website, and app channels. Export Report Impressions, Engagement & Visits Over Time ● Impressions● Engagement● Visits Performance by Channel setQuery(e.target.value)} placeholder="Search channel" className="w-44 bg-transparent text-sm outline-none" /> setSelectedType(e.target.value)} className="rounded-2xl border border-slate-200 bg-white px-3 py-2 text-sm outline-none"> {types.map((type) => {type})} {filtered.map((item) => ( {item.name} {item.type} · {item.status} {formatNumber(item.impressions)} {item.rate}% {formatNumber(item.visits)} +{item.followers} ))} ); }