objection-paginator

Object-oriented, value-based pagination for Objection.js.

Rationale

Objection includes some query builder methods for pagination, but these are implemented using a simple limit and offset, which comes with certain drawbacks. In many use cases-- particularly large datasets and apps with realtime elements-- you'll want a more efficient and consistent solution in place.

One more efficient and consistent solution has been variously called "keyset pagination," "cursor pagination," and "value-based pagination." It involves having the client send you data about the last-fetched item-- usually called a "cursor" but not to be confused with actual SQL Cursors-- allowing you to filter out (with WHERE clauses) any items that occur before it in the sort, esentially resuming where you left off without risking the duplicate data or performance problems.

This kind of pagination is much more complex to implement, as the necessary cursor values are different based on how the data is being sorted. It is understandable that a library like Objection would not support it by default, but it is a common need and should probably be implemented somewhere.

For Objection, it is implemented in a few different packages on npm, including objection-cursor and objection-keyset-pagination. This functionality is absolutely crucial to Batterii, however, so we've opted to implement it ourselves to ensure reliability and control over features.

Unlike these other libraries in this space, this project is designed with strong adherance to OOP priciples and has 100% unit test coverage, along with an extensive suite of integration tests implemented against SQLite. It is also written in TypeScript, and includes exhaustive documentation comments for easy perusal using vscode.

It also has robust support for easily specifying various sorting and filtering methods around the pagination abstraction, including nullable columns and columns loaded in through relationships. See below for a lengthy explanation of these features.

The Paginator Class

objection-paginator is designed with OOP principles, so naturally you define a paginated query by inheriting from a class. In this case, you use the Paginator class, like so:

1import { Paginator } from 'objection-paginator';
2import { Person } from '../models/person';
3import { QueryBuilder } from 'objection';
4
5export class People extends Paginator<Person> {
6	/*
7	 * You can define columns to sort by here. In this case we just specify a
8	 * default sort.
9	 */
10	static sorts = { default: [ 'firstName', 'lastName', 'guid' ] };
11
12	/*
13	 * This is an abstract method that must be provided, and should return a
14	 * query including the whole data set for your paginator. Note that it is
15	 * *not* async. You should return the unexecuted query builder directly, so
16	 * that the Paginator can apply all the additional stuff it needs before
17	 * executing.
18	 */
19	getBaseQuery(): QueryBuilder<User> {
20		return Person.query();
21	}
22}
23

This above example defines a simple paginated query across all entities belonging to the Person model, which will be sorted by firstName, lastName, then id. When specifying a sort, you want to make sure that the combination of sort fields will be unique within the query, to ensure a deterministic sort order. In this case, the combination of firstName and lastName might not be unique, so we include the Person's unique "guid" string field as well.

You can later execute your query like so:

1import { People } from '../paginators/people';
2import { Person } from '../models/person';
3
4async function logSomePeople(): Promise<void> {
5	// Create an instance with the limit configured.
6	const paginator = new People({ limit: 10 });
7
8	// Get the first page.
9	const page = await paginator.execute();
10
11	// This will log the first ten people and the number of people remaining.
12	console.log(page.items, page.remaining):
13
14	// Get the second page.
15	const nextPage = await paginator.execute(page.cursor);
16
17	// This will log the next ten people, and the new number remaining.
18	console.log(nextPage.items, nextPage.remaining);
19}
20
21logSomePeople();

In an API you typically won't be getting more than one page in a single request, so you're usually going to be creating an instance of your paginator and executing it immediately. For this reason, the Paginator class implements the static ::getPage method, which is essentially shorthand for the entire operation:

1import { Page } from 'objection-paginator';
2import { People } from '../paginators/people';
3import { Person } from '../models/person';
4
5async function whateverYourApiFrameworkDoes(
6	clientArgs: { limit?: number; cursor?: string },
7): Promise<Page<Person>> {
8	const { limit, cursor } = clientArgs;
9	return People.getPage({ limit, cursor });
10}

Note that in this case, we are allowing the client to specify the limit and (as normal) provide the cursor. If the limit is not provided, it defaults to 1000. If the cursor it is not provided, we'll start from the beginning. If it is, we will resume from it without storing any state for these queries on the server.

The cursors are simply base64-encoded JSON, but they should be regarded as opaque by clients, who should simply recieve and send them without caring about what is actually in them.

Alternate Sorts

Paginated queries of any kind require a well-defined sorting mechanism, but it does not always have to be the same one for the same dataset. You can allow your clients to specify alternate ways of sorting through the same dataset. Just include them in your static sorts property:

1import { Paginator } from 'objection-paginator';
2import { Person } from '../models/person';
3import { QueryBuilder } from 'objection';
4
5export class People extends Paginator<Person> {
6	static sorts = {
7		default: [ 'firstName', 'lastName', 'guid' ],
8		byLastName: [ 'lastName', 'firstName', 'guid' ],
9	};
10
11	getBaseQuery(): QueryBuilder<User> {
12		return Person.query();
13	}
14}

Then, when consuming your paginator, you can provide the alternate sort name:

1const page = await People.getPage({ limit: 10, sort: 'byLastName' });

Full Sort Descriptors

Thus far, we have simply been specifying column names for sorts, but there's more to this story than that. Perhaps you need to change the sort direction. Cursors also need to be validated to avoid sending invalid queries to the database and causing unecessary DB errors.

By default, the Paginator assumes that your columns are strings, and your sort direction is ascending. If you're sorting a column of a different data type, or you need a descending sort, all you have to do is specify these inside a full sort descriptor object.

If, for example, I'm using an autoincrement integer id instead of a string guid, and I want to support sorting by height (stored as a float in inches) with tallest people first, I could do this:

1import {
2	ColumnType, // You'll use this enum to specify column types...
3	Paginator,
4	SortDirection, // ... and this enum to specify sort directions.
5} from 'objection-paginator';
6import { Person } from '../models/person';
7import { QueryBuilder } from 'objection';
8
9export class People extends Paginator<Person> {
10	static sorts = {
11		default: [
12			'firstName',
13			'lastName',
14			{ column: 'id', columnType: ColumnType.Integer },
15		],
16		tallestFirst: [
17			{
18				column: 'height',
19				columnType: ColumnType.Float,
20				direction: SortDirection.Descending,
21			}
22			'firstName',
23			'lastName',
24			{ column: 'id', columnType: ColumnType.Integer },
25		],
26	};
27
28	getBaseQuery(): QueryBuilder<User> {
29		return Person.query();
30	}
31}

In case you are not using TypeScript and these enums aren't useful to you, they are implemented with string values.

Sort directions match how they are defined in Objection and Knex, with one additional option:

• 'asc' for an ascending sort.
• 'desc' for descending sort.
• 'descnl' for a descending nulls-last sort.

This final sort direction option is effectively the same as a descending sort, unless your column is nullable. See the section on nullable columns for more information.

Supported column types include the following:

• 'string'
• 'integer'
• 'float'
• 'boolean'
• 'date'

Signs, lengths and precisions of these data types are not currently checked. This is done for simplicity, as these type-checking features are less about preventing all database errors, and more about helping developers quickly identify obvious problems. The former would be a major challenge that is outside thie scope of this library.

The date type accepts either javascript Date instances as cursor values, or strings of any kind. This leverages the toJSON method of JS Dates which automatically converts them to ISO strings, which are commpatible with the date types in all Knex-supported databases.

If you need to specify custom validation, you can do so with the validate property of your sort descriptors. If, for example, I need to ensure that an integer is positive (possibly useful for unsigned int columns) I might do this:

1{
2	column: 'id',
3	columnType: ColumnType.Integer,
4	validate: (value: number) => value >= 0;
5}

Unsurprisingly, validation functions should return true for valid values, and false for invalid ones. You can also customize the error message for an invalid value by returning a string instead:

1{
2	column: 'id',
3	columnType: ColumnType.Integer,
4	validate: (value: number) => value >= 0 || 'Value must be non-negative';
5}

Relationships

Paginating over a single table is nice, but Objection's real killer feature is loading related data using methods like withGraphFetched and withGraphJoined. When using the latter of these methods, it is possible to also sort on the joined columns within your Paginator.

To do this, you may need to give your sort descriptors a valuePath, which is the dot-separated object path at which they can find their cursor values within your denormalized result objects. You also may need to specify table names in addition to column names, if you are joining in a table that has some shared column names. Otherwise you'll end up with ambigious column name errors.

The valuePath is actually always present, but it defaults to whatever you provide as the column name. If you need to specify a full table.column specifier, you may have to update the valuePath as well.

If, for example, I have a Food model where each food has a unique integer id, and I keep track of people's favorite foods using a favoriteFoodId column, I might associate people with their favorite foods like this:

1import { Model } from 'objection';
2import { Food } from '../models/food';
3
4export class Person extends Model {
5	static tableName = 'people';
6	static relationships = {
7		favoriteFood: {
8			relation: Model.HasOneRelation,
9			modelClass: Food,
10			join: {
11				from: 'people.favoriteFoodId',
12				to: 'food.id',
13			};
14		};
15	};
16
17	id: number;
18	firstName: string;
19	lastName: string;
20	favoriteFoodId: number|null;
21	favoriteFood?: Food|null;
22}
23

Then, I can define a paginated query of people and their favorite foods, sorted by the name of the food, the person's first name, the person's last name, and finally the person id:

1import {
2	ColumnType,
3	Paginator,
4	SortDirection,
5} from 'objection-paginator';
6import { Person } from '../models/person';
7import { QueryBuilder } from 'objection';
8
9export class PeopleWithFavoriteFoods extends Paginator<Person> {
10	static sorts = {
11		default: [
12			/*
13			 * The column we're sorting by is the `name` column in the `foods`
14			 * table. Note that Objection uses the relationship name as a table
15			 * alias for the joined 'foods' table, so you should refer to it
16			 * with that alias, if needed.
17			 *
18			 * This has the added benefit of matching our valuePath exactly,
19			 * removing the need to specify both.
20			 */
21			'favoriteFood.name',
22			'firstName',
23			'lastName',
24			{
25				/*
26				 * We need to specify which id we're talking about here, since
27				 * the `foods` table has its own id column.
28				 *
29				 * This means we also have to specify the value path, since it
30				 * no longer matches the column identifier.
31				 */
32				column: 'people.id',
33				columnType: ColumnType.Integer,
34				valuePath: 'id',
35			},
36		],
37	};
38
39	getBaseQuery(): QueryBuilder<User> {
40		return Person.query().withGraphJoined('favoriteFood', {
41			/*
42			 * We are doing an inner join here to filter out people who don't
43			 * have a known favorite food. If you need to include records with
44			 * nullable columns or relationships, see the section on nullable
45			 * columns below.
46			 */
47			joinOperation: 'innerJoin',
48		});
49	}
50}

Concerning Snake Case Mappers

If you are using Objection's Knex-level snake case mappers, you can expect the column and table names in your sort descriptors to work seamlessly with those.

If you are using the Objection-level mappers, however, you will need to specify using the exact identifier names as they appear in the database, as you would with any orderBy or select statement. Your model properties will be in camel case, of course, but this mismatch means that you will need to specify an explicit valuePath for every single sort descriptor with a column name consisting of more than one word.

Features to deal with this are possible, but none are planned because at Batterii we simply never use the Objection-level mappers becuse the Knex-level ones are so much more consistent and therefore less confusing. If you feel like you really need them, though, and you find continually specifying the valuePath to be intolerable, feel free to raise it as an issue and we'll look into it.

Nullable Columns

If your sort specifies a column that might be null for a given record, you need to explicitly mark this using the nullable option. This will allow nulls through the cursor validators, and also ensure they are handled properly within ORDER BY and WHERE clauses applied by the paginator.

If, for example, we have a height field in our Person model, but we may or may not know the height of an individual person. We can account for this by adding a nullable: true to our sort descriptor for the height field, and updating the sort direction to put nulls last. The result will be people ordered tallest to shortest, with the people whose height we don't know at the end:

1import {
2	ColumnType,
3	Paginator,
4	SortDirection,
5} from 'objection-paginator';
6import { Person } from '../models/person';
7import { QueryBuilder } from 'objection';
8
9export class People extends Paginator<Person> {
10	static sorts = {
11		default: [
12			'firstName',
13			'lastName',
14			{ column: 'id', columnType: ColumnType.Integer },
15		],
16		tallestFirst: [
17			{
18				column: 'height',
19				columnType: ColumnType.Float,
20				nullable: true,
21				direction: SortDirection.DescendingNullsLast,
22			}
23			'firstName',
24			'lastName',
25			{ column: 'id', columnType: ColumnType.Integer },
26		],
27	};
28
29	getBaseQuery(): QueryBuilder<User> {
30		return Person.query();
31	}
32}

This library explicitly specifies how to sort nulls, so regardless of what database you are using, nulls will occur last in an ascending sort, first in a descending sort, and of course last in a descending nulls-last sort.

Nullable Relationships

Nullable column support works even if the referenced column is from a different table. If we return to our previous PeopleWithFavoriteFoods example, we can include people with unknown favorite foods at the end of our list like so:

1import {
2	ColumnType,
3	Paginator,
4	SortDirection,
5} from 'objection-paginator';
6import { Person } from '../models/person';
7import { QueryBuilder } from 'objection';
8
9export class PeopleWithFavoriteFoods extends Paginator<Person> {
10	static sorts = {
11		default: [
12			{
13				column: 'favoriteFood.name',
14				nullable: true,
15			}
16			'firstName',
17			'lastName',
18			{
19				column: 'people.id',
20				columnType: ColumnType.Integer,
21				valuePath: 'id',
22			},
23		],
24	};
25
26	getBaseQuery(): QueryBuilder<User> {
27		/*
28		 * The join operation for `withGraphJoined` defaults to a left join, so
29		 * there is no need to specify. The favoriteFood for each person will be
30		 * loaded if known, and null if not known.
31		 */
32		return Person.query().withGraphJoined('favoriteFood');
33	}
34}

Paginator Arguments

In many cases, you may need to pass in information which is not known when defining your Paginator subtypes, but is known when instantiating them. For example, you might need to allow a client-specified filter.

Let's say you want to allow a query that includes only people with a certain first name. To accomplish this in a type-safe manner, simply define an interface for your arguments, and both the Paginator constructor and the static ::getPage method will require them as their second argument.

Provided args will be availble as this.args in your getBaseQuery method:

1import { ColumnType, Paginator } from 'objection-paginator';
2import { Person } from '../models/person';
3import { QueryBuilder } from 'objection';
4
5interface PeopleNamedArgs {
6	firstName: string;
7}
8
9export class PeopleNamed extends Paginator<Person, PeopleNamedArgs> {
10	static sorts = {
11		/*
12		 * We don't need to include the firstName in our sort, because it will
13		 * be the same for every result.
14		 */
15		default: [
16			'lastName',
17			{ column: 'id', columnType: ColumnType.Integer },
18		],
19	};
20
21	getBaseQuery(): QueryBuilder<Person> {
22		return Person.query().where({ firstName: this.args.firstName });
23	}
24}

Later, the firstName will be required when you actually use your Paginator:

1const page = await PeopleNamed.getPage({ limit: 10 }, { firstName: 'Steve' });

Of course, if you are using vanilla JS you can skip defining your types and just provide the args object as the second constructor or getPage argument, if and when you need it.

Args introduce some additional considerations for your cursors. A cursor from the same Paginator and sort name, but with different args, is technically still valid since it won't cause database errors. It will not, however, produce the results you probably want. You may end up getting strange results, or completely empty results.

Clients should therefore take care not to change the arguments they're sending while also sending cursors from previous requests. An earlier version of this library attempted to store a hash of arg values within cursors themselves, so the server could detect this situation and throw an appropriate error, but since args are so flexible this proved to be more trouble than it was worth.

Getting Creative With Your Args

Args have a lot of flexibility besides just applying filters to your queries. If you're using an API framework like Koa, you might want to pass the ctx object to your paginators, so that you can do permissions checks and what not based on the currently logged-in user.

1import { ColumnType, Page, Paginator } from 'objection-paginator';
2import { Person } from '../models/person';
3import { QueryBuilder } from 'objection';
4import { Context } from '../path/to/my/context/typings';
5
6interface PeopleArgs {
7	ctx: Context;
8}
9
10export class People extends Paginator<Person, PeopleArgs> {
11	// Set up our default sort as normal.
12	static sorts = {
13		default: [
14			'firstName',
15			'lastName',
16			{ column: 'id', columnType: ColumnType.Integer },
17		],
18	};
19
20	/*
21	 * We're overriding the constructor to do a check against the user's
22	 * "maxLimit." We're also defaulting *to* the user's maxLimit, if no limit
23	 * was specified, so this has to happen in the constructor.
24	 */
25	constructor(options: PaginatorOptions, args: PeopleArgs) {
26		// Get the user's maxLimit.
27		const { maxLimit } = args.ctx.state.currentUser;
28
29		// Assume we want the user's max limit if none was specified.
30		if (options.limit === undefined) options.limit = maxLimit;
31
32		// If a user-provided limit was too high, throw an error.
33		if (options.limit > maxLimit) {
34			throw new Error(`Maximum limit of ${maxLimit} exceeded`);
35		}
36
37		// Continue creating the paginator normally...
38		super(options, args);
39	}
40
41	getBaseQuery(): QueryBuilder<User> {
42		return Person.query();
43	}
44
45	async execute(cursor?: string): Promise<Page<User>> {
46		/*
47		 * You can do some pre-execution checks here if you want. For example,
48		 * maybe you want to restrict some users to the first page only. The
49		 * following code accomplishes this by throwing when a cursor is
50		 * specified for such a user.
51		 */
52		const { currentUser } = args.ctx.state;
53		if (cursor && currentUser.firstPageOnly) {
54			throw new Error('User can only see the first page of this query');
55		}
56
57		// Execute the query like normal.
58		const page = await super.execute(cursor);
59
60		/*
61		 * You can do post-execution stuff here if you want, also. Maybe this
62		 * user isn't allowed to see the emails of the people they're looking
63		 * at. So, maybe we want to null those out before returning our
64		 * response.
65		 *
66		 * Depending on the API framework you are using, this may or may not be
67		 * the most appropriate place to handle something like this, but the
68		 * option is there if you need it.
69		 */
70		if (!currentUser.canSeeEmails) {
71			for (const person of page.items) {
72				person.email = null;
73			}
74		}
75
76		// Now can return the page.
77		return page;
78	}
79}

Custom Generic Paginators

You may find yourself wanting to implement a feature like the maxLimit checks above, but within a generic class of your own that does not otherwise specify your TModel or TArgs. This will enable you to reuse the code for your checking feature in any of your non-generic subtypes that require it.

You can do this by overriding the constructor, but doing so will require you to re-specify the constructor's typings in the same way they were originally experessed. This can be a bit messy due to the particulars of how TypeScript generics work.

To simplify this process, this module exposes the type aliases it uses, so you can use them yourself. A custom generic Paginator would therefore look something like this:

1import {
2	If,
3	Page,
4	Paginator,
5	PaginatorOptions,
6} from 'objection-paginator';
7import { Context } from '../path/to/my/context/typings';
8import { Model } from 'objection';
9
10/*
11 * This will require a ctx argument for every one of your paginators.
12 * Non-generic subtypes that need to add their own arguments by extending this
13 * interface and providing the new one as TArgs in place of the default.
14 */
15export interface MyPaginatorArgs {
16	ctx: Context;
17}
18
19export abstract class MyPaginator<
20	TModel extends Model,
21	TArgs extends MyPaginatorArgs = PaginatorArgs
22> extends Paginator<TModel, TArgs> {
23	/*
24	 * This is the same implementation as before, just with a generic type
25	 * signature. We do need to use this spread operator and If<T> type to get
26	 * around some TypeScript weirdness.
27	 */
28	constructor(options: PaginatorOptions, ...rest: If<TArgs>) {
29		const [ args ] = rest;
30		const { maxLimit } = args.ctx.state.currentUser;
31		if (options.limit === undefined) options.limit = maxLimit;
32		if (options.limit > maxLimit) {
33			throw new Error(`Maximum limit of ${maxLimit} exceeded`);
34		}
35		super(options, ...rest);
36	}
37}
38

It is also possible to override the static ::getPage method, of course, but this is not recommended because both ES6 and TypeScript get a little crazy when it comes to invoking an original static method within an override. Not to to mention, the real functionality of this class is implemented in the constructor and its #execute method. ::getPage is just a convenience that performs one followed by the other.

Error Handling

This module makes use of Nani to define the errors it throws within an easily-checked heirarchy. The errors it exposes are:

• ObjectionPaginatorError: The base class of all other errors in this module, for namespacing purposes. You won't see any errors thrown of this type that aren't one of its subtypes.
• ConfigurationError: Thrown when a mistake in encountered in the configuration of a Paginator.
• UnknownSortError: Thrown when a paginator is executed with a sort name that does not exist in its static sorts property.
• InvalidCursorError: Indicates that a cursor provided to the execute method of a paginator was invalid. Usually this is a mistake on the part of the client.