import React, { forwardRef } from 'react';
import styles from './ChatAssistant.module.css';

interface ChatAssistantToggleProps {
  isOpen: boolean;
  onClick: () => void;
}

const ChatAssistantToggle = forwardRef<HTMLButtonElement, ChatAssistantToggleProps>(
  ({ isOpen, onClick }, ref) => {
    return (
      <button
        ref={ref}
        type="button"
        id="chat-assistant-toggle"
        className={styles.chatToggle}
        onClick={onClick}
        aria-expanded={isOpen}
        aria-controls="chat-assistant-panel"
        aria-label={isOpen ? 'Cerrar asistente de chat' : 'Abrir asistente de chat'}
      >
        <i
          className={`${isOpen ? 'ri-close-line' : 'ri-robot-2-line'} ${styles.chatToggleIcon}`}
          aria-hidden="true"
        />
      </button>
    );
  },
);

ChatAssistantToggle.displayName = 'ChatAssistantToggle';

export default ChatAssistantToggle;