Filtering in React

Good day,

i am having a little problem. I want to filter my products by size, but the products can't be filtered, somehow. When i console.log the products this appears:

[]
[]

filter.js:24 (5) [{…}, {…}, {…}, {…}, {…}]
filter.js:24 (5) [{…}, {…}, {…}, {…}, {…}]

the products array is being consoled 4 times, twice empty and then twice with the products in them. I have checked if i have console.logged the array before, but i dont see anything. I am looking forward to your responses.

My code of the filter:

import React, { useEffect } from 'react'
import { listProduct } from '../../actions/productActions'
import {useDispatch, useSelector} from 'react-redux'






     
const Filter = ()=> {
    const productList = useSelector(state=>state.productList)

    const{products,loading,error}=productList
    const dispatch = useDispatch()
    

    
    

    useEffect( ()=> {
        dispatch(listProduct())
    }, [])
    console.log(products)

  



        return(
            
            <div className="filter">

                <label>
                    Order:
                    <select>
                        <option value="lowest">Lowest to Highest</option>
                        <option value="highest">Highest to Lowest</option>
                    </select>
                </label>
            <label>
            Size:
            <select 
            className="size"
            onChange={
                (e)=> {
                    if(e.target.value === 'S'){
                        
                 return  products.filter(product=> product.size === 'S')
                    }
                    else if(e.target.value === 'XS'){
                        alert('Extra small')
                    }
                    else if(e.target.value === 'M'){
                        alert('MEDIUM')
                    }
                    else if(e.target.value === 'L'){
                        alert('LARGE')
                    }
                    else if(e.target.value === 'XL'){
                        alert('EXTRA LARGE')
                    }
                    else {
                        alert('ALL')
                    }

                }
            
            }
            >
            <option value="">ALL</option>
            <option value="XS">XS</option>
            <option value="S">S</option>
            <option value="M">M</option>
            <option value="L">L</option>
            <option value="XL">XL</option>

            </select>
            </label>
          
        


            </div>
        )
    
}

export default Filter