Как типизировать item в map React при рендинге компонентов

Интерфейс

export interface IMovie {
  nameRu: string;
  rating: number;
  posterUrlPreview: string;
  year: number
  filmId: number;
  [key: string]: any;
}

Компонент

import { useTypedSelector } from '../../hooks/useTypedSelector';
import { IMovie, IMoviesState } from '../../types/movies';
import MovieCard from '../MovieCard/MovieCard';
import styles from './styles.module.css';

const MoviesList: React.FC = () => {
  const moviesList = useTypedSelector((state) => state.movies.movies);
  console.log('moviesList:', moviesList)

  return (
    <ul className={styles.list}>
      {moviesList.map((movie: IMovie) => (

        <li key={movie.filmId} className={styles.listItem}>
          <MovieCard
            nameRu={movie.nameRu}
            rating={movie.rating}
            posterUrlPreview={movie.posterUrlPreview}
            type={movie.type}
            year={movie.year}
          />
        </li>
      ))}
    </ul>
  );
};

export default MoviesList;

TypeScript ругается на movie в map при рендинге компонетов. Почему? В movie попадает объект описанный в интерфейсе

Это объект который попадает в movie

Хук

import { TypedUseSelectorHook, useSelector } from "react-redux";
import { rootState } from "../store";

export const useTypedSelector: TypedUseSelectorHook<rootState> = useSelector;

Стор

const rootReducer = combineReducers({
  movies: moviesReducer,
  loader: handleLoader,
});

export const store = createStore(rootReducer, applyMiddleware(thunk));

export type rootState = ReturnType<typeof rootReducer>