You MUST use hooks in the execution context of Function Component, you used the useEffect inside a function not in the execution context of Function Component.

const YourComponent = () => {
  const [movieNames, setMovieNames] = useState([]);
  
  const loadMovieNames = async (text) => {
    const response = await axios.get(
      'https://yts.mx/api/v2/list_movies.json?query_term=' + text
    );
    let arrayOfMoviesNames = [];
  
    response.data.data.movies.forEach((i) => {
      arrayOfMoviesNames.push(i.title);
    });
    setMovieNames(arrayOfMoviesNames);
  };


  return (
    <Autocomplete
      placeholder="Search Movie"
      limit={8}
      data={movieNames}
      onChange={(value) => loadMovieNames(value)}
    />
  );
};

It is also possible without useEffect, so without making it so complicated by using useEffect and onChangeHandler both, only use onChangeHandler function to update the movieNames and it will automatically update the DOM texts (I mean where ever you use)...

import React, { useState } from "react";

function MoviesPage(props) {
  const [ movieNames, setMovieNames ] = useState([]);
  const [ searchValue, setSearchValue ] = useState("");

  const onChangeHandler = async (text) => {
    const response = await axios.get(
      'https://yts.mx/api/v2/list_movies.json?query_term=' + text
    );

    let arrayOfMoviesNames = [];

    response.data.data.movies.forEach(i => {
      arrayOfMoviesNames.push(i.title)
    });
    
    setMovieNames(arrayOfMoviesNames);
  }

  return (
    <div>
      <Autocomplete
        placeholder="Search Movie"
        limit={8}
        data={movieNames}
        onChange={(e) => onChangeHandler(e.target.value)}
      />
    </div>
  );
}

export default MoviesPage;

...and just to clarify, you can use useEffect in case of API if you want to initialize the page with the API data. You can use this hook if you don't have any onChange handlers. Another way you can approach is you can update a state hook (like searchData) on the change of the Search Bar, and lastly add the the searchData variable to the useEffect dependency array:

useEffect(() => {
  // use the searchData variable to populate or update the page
  // ...
},
[
  searchData, // <-- talking about this line
]);

So, this was my solution. Hope this helps you mate!

useEffect is a hook, which executes on state change, So keep the useEffect funtion outside the onChangeHandler and add a new state for 'query param' and setQueryState(text) inside the onChangeHandler, and put the state param as dependency in useEffect, So whenever this state gets changed this will call the use effect function automatically.