Paginación y filtros avanzados

Clase 9 de 23 • Curso Avanzado de Node.js con GraphQL, Apollo Server y Prisma

Diego Vergara

student•

Les dejo los type definitions que usa el profesor

input AvoWhereInput{
  name: StringFilterInput
  price: Float

}

input StringFilterInput{

  equals:String
  in:[String]
  notIn:[String]
  lt:String
  lte:String
  gt:String
  gte:String
  contains:String
  startsWith:String
  endsWith:String
  not:String
}

Steve Anthony Luzquiños Agama

student•

Si quieren dejar paginado por defecto, podrían usar este approach:

const getAllAvocados = async (
  parent: unknown,
  { skip, take }: { skip?: number; take?: number } = { skip: 0, take: 10 },
  { orm }: ResolverContext
): Promise<(Avocado & { attributes: Attributes | null })[]> => {
  try {
    return await orm.avocado.findMany({
      include: {
        attributes: true
      },
      skip,
      take
    })
  } catch (error) {
    console.error('Error getting all the avocados')
    console.error(error)
    throw error
  }
}

Con esto se aseguran de que siempre devolverán solo los 10 primeros, si es que no se especifican los atributos skip y take.

Emmanuel Rodríguez

student•

Hola 👋 También es posible anexarlo mediante definición en tu schema de GraphQL:

extend type Query {
   account(id: ID!): Account!
   accounts(skip: Int, take: Int, where: FilterAccount): [Account!]!
}

Sin embargo, te recomiendo el uso de una interfaz para tus filtros:

export interface Filters {
    skip: number
    take: number
    where: {
        AND?: Array<{
            [key: string]: any
        }>
        OR?: Array<{
            [key: string]: any
        }>
        [key: string]: any
    }
}

Emmanuel Rodríguez

student•

Filtros

📚 Repositorio

🛠 Commit

Configuración

La generación de filtros en Prisma son bastante sencillos, permitiendo que su implementación sea bajo el patrón de diseño facade.

Al anexar una interfaz para su causa:

export interface Filters {
    skip: number
    take: number
    where: {
        AND?: Array<{
            [key: string]: any
        }>
        OR?: Array<{
            [key: string]: any
        }>
        [key: string]: any
    }
}

Nos permitirá utilizarla como definición de parámetros mediante su opcionalidad en el modelo:

// Account.entity.ts
import { Filters } from '@libs/Prisma'
// mode code ...
export type Filter = Partial<Filters>

Así mismo, permitiendo su abstracción al nivel del controlador para su definición:

// Account.controller.ts
export default class AccountController {
   // more code ...
    /**
     * @description Find all accounts.
     * @returns Account */
    async findAccounts(filter: Filter) {
        return await this.model.findMany({
            skip: Number(filter.skip) || 0,
            take: Number(filter.take) || 10,
        })
    }
   // more code ...
}

O mediante definición en esquema de GraphQL:

extend type Query {
   account(id: ID!): Account!
   accounts(skip: Int = 0, take: Int = 10, where: FilterAccount): [Account!]!
}

José Luis Encastin Flores

student•

No conocía el patrón facade, gracias por el dato!

input AvoWhereInput{
  name: StringFilterInput
  price: Float

}

input StringFilterInput{

  equals:String
  in:[String]
  notIn:[String]
  lt:String
  lte:String
  gt:String
  gte:String
  contains:String
  startsWith:String
  endsWith:String
  not:String
}

const getAllAvocados = async (
  parent: unknown,
  { skip, take }: { skip?: number; take?: number } = { skip: 0, take: 10 },
  { orm }: ResolverContext
): Promise<(Avocado & { attributes: Attributes | null })[]> => {
  try {
    return await orm.avocado.findMany({
      include: {
        attributes: true
      },
      skip,
      take
    })
  } catch (error) {
    console.error('Error getting all the avocados')
    console.error(error)
    throw error
  }
}

export interface Filters {
    skip: number
    take: number
    where: {
        AND?: Array<{
            [key: string]: any
        }>
        OR?: Array<{
            [key: string]: any
        }>
        [key: string]: any
    }
}

export interface Filters {
    skip: number
    take: number
    where: {
        AND?: Array<{
            [key: string]: any
        }>
        OR?: Array<{
            [key: string]: any
        }>
        [key: string]: any
    }
}

// Account.controller.ts
export default class AccountController {
   // more code ...
    /**
     * @description Find all accounts.
     * @returns Account */
    async findAccounts(filter: Filter) {
        return await this.model.findMany({
            skip: Number(filter.skip) || 0,
            take: Number(filter.take) || 10,
        })
    }
   // more code ...
}

Paginación y filtros avanzados

Introducción

¿Por qué GraphQL?

Arquitectura backend con Node.js y GraphQL

Construyendo una query simple con Apollo Server

Scalars, filtros y queries avanzadas

Base de datos y ORM

ORMs, Prisma y automatización

Modelando la base datos y schema

Resolvers para mutaciones y filtros

Filtros en Prisma

Paginación y filtros avanzados

Archivos estáticos

Archivos estáticos con Express.js y Apollo Server

Producción

Protección de recursos en GraphQL

Testing

Pruebas End to End: Estrategias y Herramientas Efectivas

Preparando la app para producción

Preparando el servidor para Heroku

Introspección

Bases de datos en producción

Deploying

Próximos pasos

Reto: guestbook

Desventajas de GraphQL

Frameworks de GraphQL

Conectemos el frontend