How can I filter by selector?

Question

I am trying to filter through a city selector, I want to select the desired city in the selector to return the clinics that contain that province, something escapes me because I do not get the desired result, any help please.////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

import React, { useState, useEffect } from 'react'
import Button from 'react-bootstrap/Button';
import { getClinic } from '../../api/drupalAPI'
import {Clinic} from '@icofcv/common';
import { selectClinics } from '../../actions/detailClinics'
import Form from 'react-bootstrap/Form';

export const SearchFilterClinics = () => {

    const [clinicList, setClinicList] = useState([]);
    const [clinicListFilteredSelect, setClinicListFilteredSelect] = useState([]);
  
    const [filterSelectClinic, setFilterSelectClinic] = useState("");
    
    console.log(filterSelectClinic);
    
    const fetchClinicList = async () => {
        getClinic().then((response)=>{
            console.log(response)
            setClinicList(response);
            setClinicListFilteredSelect(response)
        }).catch ( (error)  => {
            console.error(error);
            throw error;
        });
    }


      ////filter

      const handleChangeSelect = e =>{
        setFilterSelectClinic(e.target.value);
        filterSelect(e.target.value);
      }

       
      const filterSelect=(termSearch)=>{
        const resultFilterSelect = clinicList.filter((element) => {
          if(element.province?.toString().toLowerCase().includes(termSearch.toLowerCase() )
          ){
            return element;
          }
        });
        setClinicListFilteredSelect(resultFilterSelect);
      }

      useEffect (() => {
        fetchClinicList();  
    }, []);

    return  (
                <>
                   

                                Provincia
                                
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                        
                                         
                                   
                                

                                RESULT
                                {
                                    clinicListFilteredSelect.map((clinic) => (
                                        
                                            {clinic.title}
                                            {clinic.propsPhone}
                                            {clinic.mobile}
                                            {clinic.email}
                                            {clinic.province} 
                                            {clinic.registry}
                                        
                                    ))
                                }
                            

                          
                
            )
}

How can I filter by selector?

0 Answers