I'm getting the following error:

React Hook useEffect is called in function shoes which is neither a React function component or a custom React Hook function react-hooks/rules-of-hooks

I'm not sure exactly what is the error in my code:

import React, {useState, useEffect} from 'react';

import ../App.css



function shoes() {

    useEffect(() => {

        fetchItems();

    }, []);



    const fetchItems = async () => {

        const data = await fetch('xxxxxxxxxxxxxxxxxxxxx')

        console.log(data)

    };



    return ( < h1 className = main > Shoes < /h1> );

    }

}



export default shoes;