diff --git a/client/components/ArmSwitcher.tsx b/client/components/ArmSwitcher.tsx new file mode 100644 index 00000000..6ef948be --- /dev/null +++ b/client/components/ArmSwitcher.tsx @@ -0,0 +1,130 @@ +import { useState, useEffect } from "react"; +import { useNavigate } from "react-router-dom"; +import { Zap } from "lucide-react"; + +interface Arm { + id: string; + name: string; + label: string; + color: string; + bgColor: string; + textColor: string; + href: string; +} + +const ARMS: Arm[] = [ + { + id: "labs", + name: "Aethex Labs", + label: "Labs", + color: "#FBBF24", + bgColor: "bg-yellow-500/20", + textColor: "text-yellow-400", + href: "/labs", + }, + { + id: "gameforge", + name: "GameForge", + label: "GameForge", + color: "#22C55E", + bgColor: "bg-green-500/20", + textColor: "text-green-400", + href: "/game-development", + }, + { + id: "corp", + name: "Aethex Corp", + label: "Corp", + color: "#3B82F6", + bgColor: "bg-blue-500/20", + textColor: "text-blue-400", + href: "/consulting", + }, + { + id: "foundation", + name: "Aethex Foundation", + label: "Foundation", + color: "#EF4444", + bgColor: "bg-red-500/20", + textColor: "text-red-400", + href: "/community", + }, +]; + +export default function ArmSwitcher() { + const navigate = useNavigate(); + const [currentIndex, setCurrentIndex] = useState(0); + const [isAnimating, setIsAnimating] = useState(true); + const [isHovering, setIsHovering] = useState(false); + + useEffect(() => { + if (!isAnimating || isHovering) return; + + const interval = setInterval(() => { + setCurrentIndex((prev) => (prev + 1) % ARMS.length); + }, 4000); + + return () => clearInterval(interval); + }, [isAnimating, isHovering]); + + const currentArm = ARMS[currentIndex]; + + const handleArmClick = (href: string) => { + navigate(href); + }; + + return ( +