How can I get Data from Localstorage when working with useContext , useReducer

I use the app from useContext , useReducer to State management and I want to save Data in the ProductList Comp on Localstorage, Save the successful Data, but I can not get the data …

const ProductsList = () => {
  const data = useProducts(); // get data with Custom hook
  const dispatch = useProductsAction(); 


  //GET localStorage
  useEffect(() => {
    console.log("get local");
    const items = JSON.parse(localStorage.getItem("products"));
    if (items) {
      return items;
    }
  }, []);

//SET localStorage
  useEffect(() => {
    localStorage.setItem("products", JSON.stringify(data));
  }, [data]);


  return (
    <div>
      {data.length > 0 ? (
        data.map((i) => {
          return (
            <Products
              key={i.id}
              name={i.name}
              onClick={() => dispatch({ type: "deleteProduct", id: i.id })}
            />
          );
        })
      ) : (
        <h3>Empty</h3>
      )}
    </div>
  );
};

export default ProductsList;

enter image description here