Skip to content
Graffle is a work in progress. Learn more.

Alias

This example shows how to write GraphQL aliases in the TypeScript interface. * There are three syntaxes for aliases: *

  1. Full syntax: ["aliasName", selectionSet]
    • Works for all fields
    • Required when field has required arguments or non-scalar selection
  1. Short array: ["aliasName"]
    • Only for scalar fields without required arguments
    • Equivalent to ["aliasName", true]
  1. String only: "aliasName"
    • Only for scalar fields without required arguments
    • Equivalent to ["aliasName", true]
    • Most concise option
ts
// Our website uses Vitepress+Twoslash. Twoslash does not discover the generated Graffle modules.
// Perhaps we can configure Twoslash to include them. Until we figure that out, we have to
// explicitly import them like this.
import './graffle/modules/global.js'
// ---cut---

import { Graffle } from './graffle/$.js'

const pokemon = Graffle.create()

const day = 1000 * 60 * 60 * 24
const year = day * 365.25
const yearsAgo100 = new Date(Date.now() - year * 100)
const yearsAgo1 = new Date(Date.now() - year)

const pokemons = await pokemon.query.$batch({
  pokemons: [
    // Full syntax - required when field has arguments or complex selection
    [`elderPokemons`, {
      $: { filter: { birthday: { lte: yearsAgo100 } } },
      name: true,
      id: `elderId`,       // String syntax (most concise)
//        ^^^^^^^^^^
      hp: [`elderHp`],     // Short array syntax
//        ^^^^^^^^^^^^
    }],
    [`babyPokemons`, {
      $: { filter: { birthday: { gte: yearsAgo1 } } },
      name: `babyName`,    // String syntax (most concise)
//         ^^^^^^^^^^^^
    }],
  ],
})

console.log(pokemons)

Outputs

json
{
  "elderPokemons": [
    {
      "name": "Pikachu",
      "elderId": "1",
      "elderHp": 35
    },
    {
      "name": "Squirtle",
      "elderId": "3",
      "elderHp": 44
    }
  ],
  "babyPokemons": [
    {
      "babyName": "Charizard"
    }
  ]
}

Released under the MIT License.