The developer tools compiler is currently giving me this error:

'return' outside of function. (50:4)
  53 |             <_navbar />

With this block of code, I’m trying to retrieve multiple players name and picture from an NFL Api. Then display this information as cards that people can click on the name taking them to each individual player’s page.
I’m also now getting 'Link' is declared but its value is never read. for the first line of my code which is weird because all of my other routes to my other pages work.

This is the code for the component I’m working with:

import { Link } from "react-router-dom";
import _navbar from "../NavBar/navbar";

export default function _quarterbacksPage() {
    const quarterbacks = [3139477, 4241479, 3918298, 3915511, 2577417];

    const options = {
        method: 'GET',
        headers: {
            'x-rapidapi-key': 'secretkey',
            'x-rapidapi-host': 'nfl-api-data.p.rapidapi.com'
        }
    };
    for (let i = 0; i < quarterbacks.length; i++){
            const [img, setImg] = useState();
            const [name, setName] = useState();
    
        
            const imageUrl = "https://nfl-api-data.p.rapidapi.com/nfl-ath-img?id=" + quarterbacks[i];
            const fetchImage = async () => {
            fetch(imageUrl, options)
            .then(response => response.json())
            .then(response => {
                const data = response.image.href;
                new Blob([data], {type: 'image/png' });  
                setImg(data);
                
            })
          };
    
    
            const FullNameUrl = 'https://nfl-api-data.p.rapidapi.com/nfl-ath-fullinfo?id=' + quarterbacks[i];
            const fetchFullName = async () => {
                fetch(FullNameUrl, options)
                .then(response => response.json())
                .then(response => {
                    const data = response.athlete.fullName;
                    setName(data);
                
                })
            };
    
        useEffect(() => {
            fetchImage();
            fetchFullName();
        }, []);
    }
}

    return (
        <>
            <div>
                <_navbar />
                {quarterbacks.map((quarterback) => (
                    <>
                        <img className={styles.cardImage} src={img} alt="profile picture"></img>
                        <Link key={quarterback} to={`/quarterbacks/${quarterback}`}>
                            <h2 className={styles.cardTitle}>{name}</h2>
                        </Link>
                    </>
                ))}
            
            </div>
        </>
    );