Spaces:
Sleeping
Sleeping
File size: 2,049 Bytes
9cf8f52 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 | import React from 'react';
import { motion } from 'motion/react';
import { Cpu, Sparkles, MessageSquare } from 'lucide-react';
interface FloatingAIButtonProps {
onClick: () => void;
isOpen: boolean;
lang?: 'ar' | 'en';
}
export function FloatingAIButton({ onClick, isOpen, lang = 'ar' }: FloatingAIButtonProps) {
return (
<div className="fixed bottom-6 right-6 z-40">
<AnimatePulseRing />
<button
id="floating-sentry-fab"
type="button"
onClick={onClick}
className="relative group h-14 w-14 rounded-full bg-gradient-to-tr from-indigo-600 via-purple-600 to-cyan-500 text-white flex items-center justify-center shadow-xl shadow-indigo-500/30 border border-white/20 transition-all hover:scale-110 active:scale-95 duration-200 focus:outline-none"
>
{/* Hover label block */}
<span className="absolute right-16 pr-2 py-1 px-3 rounded-xl bg-slate-950/90 text-[11px] font-black uppercase text-cyan-400 whitespace-nowrap border border-slate-800 opacity-0 group-hover:opacity-100 transition-opacity duration-200 pointer-events-none shadow-md">
{lang === 'ar' ? '🧠 مساعد الذكاء الاصطناعي و Sentry' : '🧠 Sentry AI Co-Pilot'}
</span>
{/* Small sparkling badge */}
<span className="absolute -top-1 -right-1 flex h-4 w-4 items-center justify-center rounded-full bg-cyan-400 font-extrabold text-[8px] text-slate-900 border border-slate-950 animate-bounce">
AI
</span>
{isOpen ? (
<Cpu className="h-6 w-6 animate-pulse" />
) : (
<div className="relative">
<Cpu className="h-6 w-6 animate-spin-slow" />
<Sparkles className="h-3 w-3 absolute -bottom-1 -right-1 text-white animate-pulse" />
</div>
)}
</button>
</div>
);
}
function AnimatePulseRing() {
return (
<span className="absolute inline-flex h-full w-full rounded-full bg-indigo-500/20 animate-ping -z-10 pointer-events-none scale-125" />
);
}
|