TypeScriptでネストされたtype定義を取り出したい

Question

前提・実現したいこと

TypeScriptでtype定義している型の中にある型を取り出して利用したいです。
下記の items 型を使ってReact Hooksのstateの型の指定をしたいです。
下記の型定義ファイルは自動生成されたもので利用したいitems型のみコピーして貼り付けて利用しても再度上書きされるリスクや項目が変更されるリスクがあり避けたいと思っています。
参照という形で利用できれば非常に良いです。
よろしくお願い致します。

発生している問題・エラーメッセージ

プロパティ 'items' は型 '{ __typename: "ModelMovieConnection"; items: ({ __typename: "Movie"; id: string; title: string; description: string | null; thumbnailPath: string | null; contentPath: string | null; createdAt: string; updatedAt: string; } | null)[] | null; nextToken: string | null; } | null' に存在しません。ts(2339)

該当のソースコード

const [movies, setMovies] = useState<ListMoviesQuery["listMovies"]["items"]>();

export type ListMoviesQuery = {
  listMovies:  {
    __typename: "ModelMovieConnection",
    items:  Array< {
      __typename: "Movie",
      id: string,
      title: string,
      description: string | null,
      thumbnailPath: string | null,
      contentPath: string | null,
      createdAt: string,
      updatedAt: string,
    } | null > | null,
    nextToken: string | null,
  } | null,
};

試したこと

useState<ListMoviesQuery.listMovies>();と書いたところVS CODEのクイックフィックスから提案された修正を実行したら上記のように useState<ListMoviesQuery["listMovies"]と変更されました。
しかし、その更に内側のitemsを参照しようとしたところ上記のようなエラーが発生してしまいました。

補足情報（FW/ツールのバージョンなど）

typescript: 3.9.7
node: 12.18.0

Answer 1

ListMoviesQuery["listMovies"] 自体が nullable なので NonNullable で包むことで正しく型が取り出せるようになると思います

type Items = NonNullable<ListMoviesQuery["listMovies"]>["items"];

const Component = () => {
  const [movies, setMovies] = useState<Items>();
  movies?.map(movie => {
    const id = movie?.id; // string | undefined
  });
};