Update src/components/logo/Logo.tsx

src/components/logo/Logo.tsx

@@ -8,16 +8,16 @@ type LogoProps = {
   isMini: boolean;
   isAi: boolean;
   isActive: boolean;
-  speakingVolume?: number;  // ولوم صدای خروجی (ربات)
-  isUserSpeaking?: boolean; // وضعیت صحبت کردن ورودی (کاربر)
+  speakingVolume?: number;
+  isUserSpeaking?: boolean;
 }
 
 export default function Logo({ isAi, isActive, isMini, speakingVolume = 0, isUserSpeaking = false }: LogoProps) {
   if (!isActive) return null;
 
-  // --- منطق انیمیشن صدای ربات ---
-  // مقیاس موج بر اساس حجم صدای ربات
   const aiVoiceScale = 1 + (speakingVolume * 1.5);
+  const isAiSpeaking = speakingVolume > 0.01;
+
   const animatedCircleStyle: React.CSSProperties = {
     transition: 'transform 0.15s ease-out',
     transform: `scale(${aiVoiceScale})`
@@ -25,40 +25,24 @@ export default function Logo({ isAi, isActive, isMini, speakingVolume = 0, isUse
 
   return (
     <div className={cn("w-fit flex items-center justify-center")}>
-      {/* Pre-loading Tailwind colors (برای اطمینان از وجود کلاس‌های رنگ) */}
       <div className={"hidden bg-green-200 bg-green-300 bg-green-400 bg-blue-200 bg-blue-300 bg-blue-400 dark:bg-green-700 dark:bg-green-600 dark:bg-green-500 dark:bg-blue-700 dark:bg-blue-600 dark:bg-blue-500"}>
         color pre-loader
       </div>
       
       <div className={cn("relative", isMini ? "w-[80px] h-[80px]" : "w-[200px] h-[200px]")}>
-        {/* انیمیشن پینگ اصلی که همیشه فعال است */}
-        <div className={cn(
-            "absolute rounded-full opacity-50 animate-ping",
-            isAi ? "bg-green-200 dark:bg-green-700" : "bg-blue-200 dark:bg-blue-700",
-            isMini ? "inset-[10px]" : "inset-[40px]"
-        )} />
+        <div className={cn("absolute rounded-full opacity-50 animate-ping", isAi ? "bg-green-200" : "bg-blue-200", isMini ? "inset-[10px]" : "inset-[40px]")} />
         
-        {/* این دایره با صدای ربات بزرگ و کوچک می‌شود */}
-        <div 
-            className={cn(
-                "absolute rounded-full opacity-50",
-                isAi ? "bg-green-200 dark:bg-green-700" : "bg-blue-200 dark:bg-blue-700",
-                isMini ? "inset-[10px]" : "inset-[40px]"
-            )} 
-            style={animatedCircleStyle} 
-        />
+        <div className={cn("absolute rounded-full opacity-50", isAi ? "bg-green-200" : "bg-blue-200", isMini ? "inset-[10px]" : "inset-[40px]")} style={animatedCircleStyle} />
         
-        {/* بقیه دایره‌های ثابت پس‌زمینه */}
-        <div className={cn("absolute inset-0 rounded-full opacity-50", isAi ? "bg-green-200 dark:bg-green-700" : "bg-blue-200 dark:bg-blue-700")} />
-        <div className={cn("absolute rounded-full opacity-50", isAi ? "bg-green-300 dark:bg-green-600" : "bg-blue-300 dark:bg-blue-600", isMini ? "inset-[5px]" : "inset-[20px]")} />
-        <div className={cn("absolute rounded-full opacity-50", isAi ? "bg-green-400 dark:bg-green-500" : "bg-blue-400 dark:bg-blue-500", isMini ? "inset-[12px]" : "inset-[50px]")} />
+        <div className={cn("absolute inset-0 rounded-full opacity-50", isAi ? "bg-green-200" : "bg-blue-200")} />
+        <div className={cn("absolute rounded-full opacity-50", isAi ? "bg-green-300" : "bg-blue-300", isMini ? "inset-[5px]" : "inset-[20px]")} />
+        <div className={cn("absolute rounded-full opacity-50", isAi ? "bg-green-400" : "bg-blue-400", isMini ? "inset-[12px]" : "inset-[50px]")} />
         
         <div className={cn("z-10 absolute flex items-center justify-center inset-0")}>
-          {/* --- 👇 تغییر اصلی اینجاست 👇 --- */}
-          {/* isUserSpeaking به آیکون پاس داده می‌شود تا فقط آدمک تکان بخورد */}
           {humanAiIcon({ 
             size: isMini ? 24 : 45,
-            isUserSpeaking: isUserSpeaking 
+            isUserSpeaking: isUserSpeaking,
+            isAiSpeaking: isAiSpeaking,
           })}
         </div>
       </div>