"use client"; import React, { useState, useEffect } from "react"; import { motion, AnimatePresence } from "framer-motion"; import { Terminal, Command, Sparkles, ChevronRight, PlusCircle, Lightbulb } from "lucide-react"; const SUGGESTIONS = [ "Create your first cloud infrastructure deployment...", "Import a repository from GitHub or GitLab...", "Invite your team to start collaborating in real-time...", "Check the documentation for API integration tips...", "Initialize a new workspace using a template..." ]; export default function AiTerminalTypewriterEmptyState() { const [index, setIndex] = useState(0); const [subIndex, setSubIndex] = useState(0); const [reverse, setReverse] = useState(false); const [blink, setBlink] = useState(true); useEffect(() => { if (subIndex === SUGGESTIONS[index].length + 1 && !reverse) { setTimeout(() => setReverse(true), 2000); // Pausa al terminar de escribir return; } if (subIndex === 0 && reverse) { setReverse(false); setIndex((prev) => (prev + 1) % SUGGESTIONS.length); return; } const timeout = setTimeout(() => { setSubIndex((prev) => prev + (reverse ? -1 : 1)); }, reverse ? 30 : 70); return () => clearTimeout(timeout); }, [subIndex, index, reverse]); useEffect(() => { const timeout2 = setTimeout(() => setBlink((prev) => !prev), 500); return () => clearTimeout(timeout2); }, [blink]); return (

{/* Background Decor (Cyber Lines) */}

{/* Terminal Header */}

System / Empty_State

{/* Terminal Body / Typewriter Zone */}

Quick Start Suggestions

{/* Typewriter Display */}

{`${SUGGESTIONS[index].substring(0, subIndex)}`}

{/* Quick Actions Footer */}

{/* Ambient Info */}

Waiting for user input • Ready for deployment

); }