title: React Typescript how to setState
body: <p>I am trying to learn typescript with react and I am pretty confused right now, how will I setState of an interface?
  My code example: </p>
  
  <pre><code>interface Props {
      children: ReactNode | ReactNode[];
  }
  
  export interface IMovie {
      title: string;
      video: boolean;
      poster_path: string;
  }
  </code></pre>
  
  <pre><code>
  export const MoviesContext = createContext&lt;IMovie[] | undefined&gt;([]);
  
  export const MoviesProvider = ({ children }: Props): JSX.Element =&gt; {
      const [movies, setMovies] = useState&lt;IMovie[]&gt;();
  
      return (
              &lt;MoviesContext.Provider value={[movies, setMovies]}&gt;
                  {children}
              &lt;/MoviesContext.Provider&gt;
      );
  };
  </code></pre>
  
  <p>The error I get is "Type (ΙΜovie[] | Dispatch> | undefined>> is not assignable to type IMovie[]"</p>
  
  <p>any other suggestions on what to change on my code welcomed. :)</p>