Anidamiento

Anidamiento

Para manejar el anidamiento en GraphQL, lo tenemos que expresar que existe esta relación desde el motor de GraphQL.

para hacer esto, vamos a crear un nuevo tipo en el esquema:

# expresamos una relación entre producto y categoria, añadiendola en su tipo
type Product {
  id: ID!
  name: String!
  price: Float!
  description: String!
  image: String!
  createdAt: String!
  categoryId: ID!
  category: Category!
}

# creamos el tipo de la categoria
type Category {
  id: ID!
  name: String!
  image: String!
}

Si probamos realizar entonces la query obteniendo la categoría del producto:

{
	products {
		id 
		name
		category {
			name
		}
	}
}

Veríamos que lo podemos hacer sin ningún problema. Esto es increíble porque expresar la relación de los productos se puede hacer solo definiéndola de manera explicita en el esquema, sin necesidad de que definamos los resolvers, esto debido a que GraphQL no se mete directamente con el backend, simplemente es un lenguaje de consulta, y esto es posible ya que ya tenemos definido en nuestro backend las relaciones en nuestros productos, y definiéndolas en el esquema, lo hacemos evidente a la hora de que GraphQL lo consulte.

Esto es muy útil para que desde el lado del cliente no tengamos demasiada información innecesaria, lo cual es un problema constante a la hora de usar REST API, pero con GraphQL podemos pedir solo la información que necesitamos y no toda la información.

Se queda cargando el video xd

Si recordamos clases anteriores, también podemos hacer anidamiento de una categoría y regresa todos los productos con esa categoría, ¿De qué manera lo hacemos?
Bueno la forma en la que lo realice fue esta:

1 Creamos un archivo dentro de la carpeta de graphql que se llame category.resolvers.js, luego agregamos para mostrar una categoria por su ID y otro para obtener todas las categorias:

const CategoryService = require('./../services/category.service');
const service = new CategoryService();

const category = (_, { id }) => {
    return service.findOne(id);
}

const categories = (_, args) => {
    return service.find({});
}

module.exports = {
    category,
    categories
}

2.En el archivo de schema.graphql agregamos el type de Categorías:

type Category {
    id: ID!
    name: String!
    image: String!
    products: [Product!]
}

1. Agregaremos nuestra type al Query:

type Query {
    hello: String!
    product(id: ID!): Product
    products: [Product!]!
    category(id: ID!): Category
    categories: [Category!]!
}

1. Llamamos a archivo de category.resolvers.js dentro del archivo de resolvers.js

const { categories, category } = require('./category.resolvers')

1. Por último agregamos dentro de la constante resolvers category y categories

const resolvers = {
    Query: {
        hello: () => "Hello World",
        product,
        products,
        category,
        categories
    },
    Mutation: {
        addProduct,
        updatedProduct,
        deletedProduct
    }
}

1. Ya dentro de Apollo Server verificamos que funcione (esta es para obtener una categoría y dentro de esa categoría traer los productos con esa categoría):

query getCategory($categoryId: ID!) {
  resultados:category(id: $categoryId) {
    id
    name
    products {
      name
    }
  }
}

Las variables tú te encargas de colocarlas.

1. Si quieres ver todas las categorías esta es la query:

query getAllCategories {
  categories {
    id
    name
  }
}

Espero te sirva 💚