utilizing dynamic sorting with typed queries in prisma

Question

utilizing dynamic sorting with typed queries in prisma

I'm currently facing an issue while attempting to define a query in prisma dynamically. I encountered a roadblock right at the beginning of the process.

Here's a piece of code that works:

const items = await prisma.styleTags.findMany({
    orderBy: {
        name: 'asc',
    }
});

However, when I try to define the query separately, I run into TypeScript errors.

const orderBy = {
    cname: 'asc',
}
const items2 = await prisma.styleTags.findMany({
    orderBy
});

On the surface, these two approaches should be identical. But somewhere within Prisma's complex web of auto-generated code...

Type '{ cname: string; priority: string; }' is not assignable to type 'Enumerable<StyleTagsOrderByWithRelationInput> | undefined'.
  Type '{ cname: string; priority: string; }' is not assignable to type 'StyleTagsOrderByWithRelationInput'.
    Types of property 'cname' are incompatible.
      Type 'string' is not assignable to type 'SortOrder | undefined'.

The error message

Type 'string' is not assignable to type 'SortOrder | undefined'

prompted me to try passing orderBy: 'name', but that also failed.

For what it's worth, using @ts-ignore makes the code work. However, if Prisma's typechecking needs to be overridden, then its purpose becomes somewhat redundant.

My plan next is to attempt dynamically composing the orderBy based on passed parameters. But first, I need to resolve the issues mentioned above.

Can anyone shed light on why this typechecking issue with Prisma occurs?

typescript orm prisma

Answer 1

Answer №1

Here are some clever solutions you can try:

To prevent TypeScript from inferring the order as a string, wrap the orderBy with as const.
Instead of using "asc," consider using Prisma.orderBy.asc.

Answer 2

Here are some clever solutions you can try:

To prevent TypeScript from inferring the order as a string, wrap the orderBy with as const.
Instead of using "asc," consider using Prisma.orderBy.asc.

Answer 3

Answer №2

This is the logic behind my NextJs API endpoint:

import type { NextApiRequest, NextApiResponse } from 'next';
import prisma from '@/lib/prisma';

export default async function handleRequest(req: NextApiRequest, res: NextApiResponse) {
    const { _page, _limit, _sort, _order} = req.query;
    const limit = +(_limit ?? 20);
    const offset = (+(_page ?? 1) -1 ) * limit;
    const sort = (_sort ?? 'id').toString();
    const order = _order ?? 'asc';

    const orderBy = {[sort]: order};
    const userCount = await prisma.users.count();
    const users = await prisma.users.findMany({
        orderBy,
        skip: offset,
        take: limit
    });

    res.setHeader('Content-Type', 'application/json');
    res.setHeader('x-total-count', userCount);
    res.status(200).json(users);
}

I trust this information will be beneficial.

Answer 4

This is the logic behind my NextJs API endpoint:

import type { NextApiRequest, NextApiResponse } from 'next';
import prisma from '@/lib/prisma';

export default async function handleRequest(req: NextApiRequest, res: NextApiResponse) {
    const { _page, _limit, _sort, _order} = req.query;
    const limit = +(_limit ?? 20);
    const offset = (+(_page ?? 1) -1 ) * limit;
    const sort = (_sort ?? 'id').toString();
    const order = _order ?? 'asc';

    const orderBy = {[sort]: order};
    const userCount = await prisma.users.count();
    const users = await prisma.users.findMany({
        orderBy,
        skip: offset,
        take: limit
    });

    res.setHeader('Content-Type', 'application/json');
    res.setHeader('x-total-count', userCount);
    res.status(200).json(users);
}

I trust this information will be beneficial.

utilizing dynamic sorting with typed queries in prisma

Answer №1

Answer №2

Similar questions

Error Detected: An unhandled error occurred, triggering a promise rejection: TypeError: The super expression must be either null or a function in Angular version 6

Using Angular with THREE JS integration in Javascript

Creating a personalized Typescript type declaration for a npm package in a Create React App

Error encountered while running npm run build in the Dockerfile build process

Is it better to retrieve data on the server side or client side in order to fill a select element in a Next.js form?

Global variable is null in Protractor test when utilized in separate class

Employing Bazel in conjunction with Lerna and Yarn workspaces

Unraveling the Perfect Jest Stack Trace

Implementing try-catch logic for element visibility in Playwright using TypeScript poses limitations

Retrieve Data using Axios and Save in Interface with Multiple Arrays in TypeScript

Utilize clipboard functionality in automated tests while using Selenium WebDriver in conjunction with JavaScript

Create a personalized button | CKEditor Angular 2

The types definition for OpenSeadragon is lacking a property

Error in Typescript: Attempting to access the property 'set' of an undefined value

Distinguishing Literal and Parameterized Routes in Angular 6

Tips for avoiding multiple reference paths in Angular TypeScript: - Simplify your imports

Generate a Jest dummy for testing an IncomingMessage object

Ways to update the value within an object in an array stored in a BehaviorSubject?

Concealing a VueJs component on specific pages

Tips for efficiently deconstructing JSON arrays, objects, and nested arrays