diff --git a/apps/studio/components/interfaces/Support/SupportDiscordCallout.tsx b/apps/studio/components/interfaces/Support/SupportDiscordCallout.tsx new file mode 100644 index 00000000000..106ce3c701d --- /dev/null +++ b/apps/studio/components/interfaces/Support/SupportDiscordCallout.tsx @@ -0,0 +1,79 @@ +import { useEffect, useState } from 'react' +import Link from 'next/link' +import { MoveUpRight } from 'lucide-react' +import { IconDiscord } from 'ui' +import { motion, AnimatePresence } from 'framer-motion' + +interface DynamicStatusProps { + interval?: number +} +const statuses = [ + 'Try asking on Discord! The median reply time is ~12 min', + '75% of questions get a reply within ~54 min', + 'Get help fast on Discord — median reply time is ~12 min', + '90% of questions get a reply within 4h 11m', + 'Discord support: 95% replied within 8h', +] + +export function SupportFormDiscordCallout({ interval = 2500 }: DynamicStatusProps) { + const [currentIndex, setCurrentIndex] = useState(0) + + useEffect(() => { + if (statuses.length <= 1) return + + const timer = setInterval(() => { + setCurrentIndex((prev) => (prev + 1) % statuses.length) + }, interval) + + return () => clearInterval(timer) + }, [interval]) + + return ( +