How to implement pagination with GraphQL DataLoader?

Question

I have the following GraphQL query:

{
  events {
    name
    images {
      uri
    }
  }
}

Currently, I am not able (don't know how) to handle pagination in that images field, because it is fetched using DataLoader.

The eventImagesLoader (DataLoader) implementation is the following:

import DataLoader from 'dataloader';
import { getRepository } from 'typeorm';
import { EventImage } from '../entities/event-image';

export const eventImagesLoader = () =>
  new DataLoader<string, EventImage[]>(async (eventIds) => {
    const images = await getRepository(EventImage)
      .createQueryBuilder('image')
      .where('image.eventId IN (:...ids)', { ids: eventIds })
      .getMany();

    const imagesMap = new Map<string, EventImage[]>();

    images.forEach((image) =>
      imagesMap.has(image.eventId)
        ? imagesMap.get(image.eventId)!.push(image)
        : imagesMap.set(image.eventId, [image])
    );

    return eventIds.map((eventId) => imagesMap.get(eventId) || []);
  });

The problem that I am facing is to handle the pagination in this scenario, because if you see in the above excerpt of code, I am querying to the database in this way:

const images = await getRepository(EventImage)
  .createQueryBuilder('image')
  .where('image.eventId IN (:...ids)', { ids: eventIds })
  .getMany();

Which translates in a SQL like that:

SELECT * FROM  `event_image` AS image WHERE image.id IN ("id:1", "id:2", "id:n");

And I use DataLoader in this case to batch all database queries into one (the above one).

---

So with that, how am I able to handle pagination?

I would like to do something like that:

{
  events {
    name
    images(page: Int) {
      uri
    }
  }
}