When I try to compile error. Error: Invalid hook call

Question

My code was working until I tried to use Styled-Components, it gives this error Error: Invalid hook call. Hooks can only be called Inside of the body of a Function Component. The only thing I did was change the components, I didn’t touch anything in useEffect or useState and now you’re making this mistake. The error points to the setFeaturedData. Someone could help me ?

import React, { useEffect, useState } from 'react';
import './App.css';
import Tmdb from './Tmdb';
import Meio from './Components/Meio';
import Title from './Components/Title';

export default() => {

const [featuredData, setFeaturedData] = useState(null);
const [keyWords, setKeyWords] = useState(false);
const [featuredSimilar, setFeaturedSimilar] = useState(false);

useEffect(() => {

  const loadAll = async () => {
    let list = await Tmdb.getHomeList();
    setMovieList(list);

    let originals = list.filter(i=> i.slug === 'originals');
    let randonChosen = Math.floor(Math.random() * (originals[0].items.results.length - 1));
    let chosen = originals[0].items.results[randonChosen]
    let chosenInfo = await Tmdb.getMovieInfo(chosen.id, 'tv');
    let chosenKeys = await Tmdb.getKeyWords(chosen.id);
    let chosenFeaturedSimilar = await Tmdb.getSimilar(chosen.id);
    setFeaturedData(chosenInfo);
    setKeyWords(chosenKeys);
    setFeaturedSimilar(chosenFeaturedSimilar);
    console.log(chosenFeaturedSimilar)
  }
  loadAll();
}, []);

  return (
    <div className='page'>
      {featuredData &&
        <Title item={featuredData}/>
      }
      {featuredData &&
        <Meio item={featuredData} keys={keyWords} similar={featuredSimilar}/>
      }
    </div>
  )
}