36 lines
825 B
TypeScript
36 lines
825 B
TypeScript
'use client'
|
|
|
|
import { motion } from 'framer-motion'
|
|
|
|
interface LiveIndicatorProps {
|
|
status: 'live' | 'offline' | 'pending'
|
|
label?: string
|
|
}
|
|
|
|
export function LiveIndicator({ status, label }: LiveIndicatorProps) {
|
|
const colors = {
|
|
live: 'bg-green-500',
|
|
offline: 'bg-red-500',
|
|
pending: 'bg-yellow-500',
|
|
}
|
|
|
|
const labels = {
|
|
live: 'Live',
|
|
offline: 'Offline',
|
|
pending: 'Pending',
|
|
}
|
|
|
|
return (
|
|
<div className="flex items-center gap-2">
|
|
<motion.div
|
|
animate={status === 'live' ? { scale: [1, 1.3, 1] } : {}}
|
|
transition={{ duration: 2, repeat: Infinity }}
|
|
className={`w-2 h-2 rounded-full ${colors[status]}`}
|
|
/>
|
|
<span className="text-xs font-semibold text-gray-600 dark:text-gray-400">
|
|
{label || labels[status]}
|
|
</span>
|
|
</div>
|
|
)
|
|
}
|