Passing Arguments to GraphQL with Next.JS and Apollo

Solution for Passing Arguments to GraphQL with Next.JS and Apollo
is Given Below:

A lot of this is very new to me since I have been a PHP developer for so long.

I am having a couple of issues that I know are easy to fix. I just have limited experience and am learning.

  1. I cannot seem to pass the argument $token_id. I am using next JS, and I just want to take the number on the [id].js page, and pass it as the token ID.

  2. I can’t seem to get data from traitType, which is an object named “traits” which has an array of objects inside of it.

export async function getStaticProps(context) {

  const client = new ApolloClient({
    uri: 'http://localhost:3000/api/graphql',
    cache: new InMemoryCache()

  const token_id = String(
  const { data } = await client.query({
    query: gql`
          query myQuery($token_id: String!) {
            getData(token_id: $token_id) {

  },{ variables: { token_id } });

    props: {
      data: data,


export async function getStaticPaths() {
  return {
    paths: [], //indicates that no page needs be created at build time
    fallback: 'blocking' //indicates the type of fallback

My Type Definition

    type Blah {
        token_id: String
        name: String
        #traits: [traitType] #TODO: returns nothing since data is array


  type traitType {
      trait_type: String
       value: String


I have to hard code the token

     getData(token_id: "6") {
        traits {

I have tried several variations in the graphql query

query getDataQuery($token_id: String! = "6") {
    getData(token_id: $token_id) {

Returns Null on traits, and $token id is null, and nothing is found

    "traits": [
          "trait_type": null,
      "value": null

And my JSON from mongo db is an array with an object.

    "traits" : [
            "trait_type" : "birthday", 
            "value" : 1627423029.0, 


I can post more than just fragments of code. Sorry for the formatting.

I am looking to hire help and may set github bounties for certain tasks.