Filtragem de nomes mais dinâmica e simplificação do script

Olá, com base na última aula, estava incomodado com meu filtro, onde só filtrava caso digitasse o nome exato do paciente, porém eu queria poder buscar por parte do nome do paciente e ele me retornasse a lista da mesma maneira heheh

Aí acabei adicionando duas validações simples usando métodos básicos de String, o .includes() que recebe um texto como parâmetro e retorna se o texto faz parte da string em questão ou não, aí como ele é case-sensitive, bastou recuperar o textContent combinado com o método .toLowerCase() para ficar tudo minúsculo, ex:

    var nome = tdNome.textContent.toLowerCase();

e para validar o texto e tornar ou não o elemento invisível, bastou combinar os métodos dentro do if:

    if(!nome.includes(this.value.toLowerCase())){
      item.classList.add("invisivel");
    }else{
      item.classList.remove("invisivel");
    }

Ahh, e desta forma não é necessário criar uma validação extra para verificar se o campo filtro está vazio, pois caso esteja vazio, a expressão "this.value.toLowerCase()" retornará uma string vazia, e quando chamamos o método ".includes()" e passamos uma string vazia, ele retorna o valor "true".

Segue o código abaixo caso queiram utilizar como referência:

var campoFiltro = document.querySelector("#filtrar-tabela");

campoFiltro.addEventListener("input", function(){
  var pacientes = document.querySelectorAll(".paciente");
  pacientes.forEach((item) => {
    var tdNome = item.querySelector(".info-nome");
    var nome = tdNome.textContent.toLowerCase();
    if(!nome.includes(this.value.toLowerCase())){
      item.classList.add("invisivel");
    }else{
      item.classList.remove("invisivel");
    }
  });
})