refactor: simplify mobile agent button interaction (#416)

packages/ui/src/components/chat/MobileAgentButton.tsx

@@ -6,12 +6,11 @@ import { getAgentDisplayName } from './mobileControlsUtils';
 import { getAgentColor } from '@/lib/agentColors';
 
 interface MobileAgentButtonProps {
-    onCycleAgent: () => void;
     onOpenAgentPanel: () => void;
     className?: string;
 }
 
-export const MobileAgentButton: React.FC<MobileAgentButtonProps> = ({ onCycleAgent, onOpenAgentPanel, className }) => {
+export const MobileAgentButton: React.FC<MobileAgentButtonProps> = ({ onOpenAgentPanel, className }) => {
     const { currentAgentName, getVisibleAgents } = useConfigStore();
     const currentSessionId = useSessionStore((state) => state.currentSessionId);
     const sessionAgentName = useSessionStore((state) =>
@@ -23,56 +22,16 @@ export const MobileAgentButton: React.FC<MobileAgentButtonProps> = ({ onCycleAge
     const agentLabel = getAgentDisplayName(agents, uiAgentName);
     const agentColor = getAgentColor(uiAgentName);
 
-    const longPressTimerRef = React.useRef<ReturnType<typeof setTimeout> | null>(null);
-    const isLongPressRef = React.useRef(false);
-
-    const handlePointerDown = (event: React.PointerEvent) => {
-        event.preventDefault();
-        isLongPressRef.current = false;
-        longPressTimerRef.current = setTimeout(() => {
-            isLongPressRef.current = true;
-            onOpenAgentPanel();
-        }, 500);
-    };
-
-    const handlePointerUp = () => {
-        if (longPressTimerRef.current) {
-            clearTimeout(longPressTimerRef.current);
-            longPressTimerRef.current = null;
-        }
-        if (!isLongPressRef.current) {
-            onCycleAgent();
-        }
-    };
-
-    const handlePointerLeave = () => {
-        if (longPressTimerRef.current) {
-            clearTimeout(longPressTimerRef.current);
-            longPressTimerRef.current = null;
-        }
-    };
-
-    React.useEffect(() => {
-        return () => {
-            if (longPressTimerRef.current) {
-                clearTimeout(longPressTimerRef.current);
-            }
-        };
-    }, []);
-
     return (
         <button
             type="button"
-            onPointerDown={handlePointerDown}
-            onPointerUp={handlePointerUp}
-            onPointerLeave={handlePointerLeave}
-            onContextMenu={(e) => e.preventDefault()}
+            onClick={onOpenAgentPanel}
             className={cn(
                 'inline-flex min-w-0 items-center select-none',
                 'rounded-lg border border-border/50 px-1.5',
                 'typography-micro font-medium',
                 'focus:outline-none hover:bg-[var(--interactive-hover)]',
-                'touch-pan-x',
+                'touch-manipulation active:scale-95 transition-transform',
                 className
             )}
             style={{