<ButtonCounter/>

ButtonCounter.js

import "../styles/Buttons.css";
import "../styles/Todo.css";

const Buttons = ({ 
  todoList, 
  handleCompleteTodo, 
  id, 
  status 
}) => {
  const [counter, setCounter] = useState(0);
  const [completas, setCompletas] = useState(0);
  const [incompletas, setIncompletas] = useState(0);

  let contadorButton = (e) => {
    e.preventDefault();
    e.target.value();
    const completado = todoList.filter(
      (completados) => completados.status === false
    );
    setCompletas(...completado.length, completas);

    const incompletada = todoList.filter(
      (incompletadas) => incompletadas.status === true
    );
    setIncompletas(...incompletada.length, incompletas);

    const toda = todoList.filter((todas) => todas.completed);
    setCounter(...toda.length, counter);
  };

  contadorButton();
  return (
    <div className="Buttons">
      <button onClick={(e) => contadorButton(e)}>Add 1 {counter}</button>
    </div>
  );
};
export default Buttons;

https://github.com/LorenaParraF/todo-react.git