Search code examples
javascriptreactjsgraphqlapollofaunadb

Apollo GraphQL multiple ID variables in one query


I am wondering if it is possible to pass multiple IDs to a useQuery for apollo hook. Or run a single query per ID, and if so how would I go about doing so.

I have the following query

const DECOR_SHEET = gql`
  query GetDecorSheet($id: ID!) {
    findDecorSheetByID(id:$id){
      refIdArray
      sheetName
      _id
    }
  }
`;

and the following useQuery hook

const { loading, error, data: sheetData } = useQuery(DECOR_SHEET, {
    variables: { id: id },
    context: {
      headers: {
        authorization: cookieBearer,
      },
    },
  });

I have the following IDs 293164663883956749, 293526016787218952 and I would like to return into one object in order to render into a component.

I am using Fauna DB and this is the input graphQL schema

type Catalog {
  decor: Boolean
  clothing: Boolean
  supplies: Boolean
  furniture: Boolean
  owner: User
}

type Decor {
  description: String
  pieces: Int
  purchaser: String
  alterations: Boolean
  cost: Int
  purchaseDate: Date
  category: String
  image: String
  itemNum: Int
  owner: User!
  visible: Boolean
}

type DecorSheet {
  sheetName: String
  refIdArray: String
  owner: User!
}

type User {
  email: String! @unique
  catalog: Catalog
  decor: [Decor!] @relation
  decorSheet: [DecorSheet!] @relation
}

and this is the generated schema

directive @embedded on OBJECT
directive @collection(name: String!) on OBJECT
directive @index(name: String!) on FIELD_DEFINITION
directive @resolver(
  name: String
  paginated: Boolean! = false
) on FIELD_DEFINITION
directive @relation(name: String) on FIELD_DEFINITION
directive @unique(index: String) on FIELD_DEFINITION
type Catalog {
  _id: ID!
  decor: Boolean
  clothing: Boolean
  supplies: Boolean
  owner: User
  furniture: Boolean
  _ts: Long!
}

input CatalogInput {
  decor: Boolean
  clothing: Boolean
  supplies: Boolean
  furniture: Boolean
  owner: CatalogOwnerRelation
}

input CatalogOwnerRelation {
  create: UserInput
  connect: ID
  disconnect: Boolean
}

scalar Date

type Decor {
  purchaseDate: Date
  visible: Boolean
  image: String
  description: String
  _id: ID!
  alterations: Boolean
  cost: Int
  pieces: Int
  category: String
  owner: User!
  purchaser: String
  itemNum: Int
  _ts: Long!
}

input DecorInput {
  description: String
  pieces: Int
  purchaser: String
  alterations: Boolean
  cost: Int
  purchaseDate: Date
  category: String
  image: String
  itemNum: Int
  owner: DecorOwnerRelation
  visible: Boolean
}

input DecorOwnerRelation {
  create: UserInput
  connect: ID
}

type DecorPage {
  data: [Decor]!
  after: String
  before: String
}

type DecorSheet {
  refIdArray: String
  _id: ID!
  sheetName: String
  owner: User!
  _ts: Long!
}

input DecorSheetInput {
  sheetName: String
  refIdArray: String
  owner: DecorSheetOwnerRelation
}

input DecorSheetOwnerRelation {
  create: UserInput
  connect: ID
}

type DecorSheetPage {
  data: [DecorSheet]!
  after: String
  before: String
}

scalar Long

type Mutation {
  updateUser(
    id: ID!
    data: UserInput!
  ): User
  createUser(data: UserInput!): User!
  createDecorSheet(data: DecorSheetInput!): DecorSheet!
  createDecor(data: DecorInput!): Decor!
  deleteCatalog(id: ID!): Catalog
  updateCatalog(
    id: ID!
    data: CatalogInput!
  ): Catalog
  updateDecor(
    id: ID!
    data: DecorInput!
  ): Decor
  updateDecorSheet(
    id: ID!
    data: DecorSheetInput!
  ): DecorSheet
  deleteDecor(id: ID!): Decor
  deleteUser(id: ID!): User
  createCatalog(data: CatalogInput!): Catalog!
  deleteDecorSheet(id: ID!): DecorSheet
}

type Query {
  findUserByID(id: ID!): User
  findCatalogByID(id: ID!): Catalog
  findDecorByID(id: ID!): Decor
  findDecorSheetByID(id: ID!): DecorSheet
}

scalar Time

type User {
  catalog: Catalog
  email: String!
  _id: ID!
  decor(
    _size: Int
    _cursor: String
  ): DecorPage!
  decorSheet(
    _size: Int
    _cursor: String
  ): DecorSheetPage!
  _ts: Long!
}

input UserCatalogRelation {
  create: CatalogInput
  connect: ID
  disconnect: Boolean
}

input UserDecorRelation {
  create: [DecorInput]
  connect: [ID]
  disconnect: [ID]
}

input UserDecorSheetRelation {
  create: [DecorSheetInput]
  connect: [ID]
  disconnect: [ID]
}

input UserInput {
  email: String!
  catalog: UserCatalogRelation
  decor: UserDecorRelation
  decorSheet: UserDecorSheetRelation
}

There is an option to query with Fauna's FQL which may have a way of querying multiple IDs I will have to look into that, but would prefer to do this in graphQL with apollo if possible.

Thanks ahead of time


Solution

  • If it's always exactly two ids, you can fetch both objects in a single query easily using field aliases:

    const DECOR_SHEET = gql`
      query GetDecorSheet($firstId: ID!, $secondId: ID!) {
        firstDecorSheet: findDecorSheetByID(id: $firstId) {
          refIdArray
          sheetName
          _id
        }
        secondDecorSheet: findDecorSheetByID(id: $secondId) {
          refIdArray
          sheetName
          _id
        }
      }
    `;