En mi aplicación React, tengo un div con el evento onClick para colapsar la barra lateral, funciona bien, pero en las pantallas táctiles activa el evento solo con un doble toque. ¿Cómo puedo deshabilitar esa funcionalidad?

Cuando toco una vez en div , primero está configurando el estado activo como verdadero y justo después como falso

 <div onClick={(e) => handleSideBar} className='dashboard-arrow-dark dashboard-arrow d-flex align-items-center justify-content-center'> {isActive ? <ArrowRightIcon /> : <ArrowLeftIcon/>} </div>

 // collapse side bar const handleSideBar = (e) => { e.preventDefault() setIsActive(!isActive) }