QMC
QMC

Reputation: 15

Apollo Server / GraphQL - Properties of Nested Array Returning Null

Bear with me, I will explain this the best I can. Please let me know if more information is needed, I am trying to keep this as brief as possible.

I am using Apollo Server and the 'apollo-datasource-rest' plugin to access a REST API. When attempting to get the property values from a nested array of objects I get a null response for each field/property. In addition, the array being queried is only showing a single iteration when multiple are available.

The field in question is the 'cores' field within the Rocket type, i.e., launch.rocket.firstStage.cores

I have attempted various ways of mapping through 'cores' (thinking this was what it wanted) with no success.

To keep things short and simple I'm only including the code for the specific issue. All other parts of the query are operating as expected.

You can view the API response I am hitting here: https://api.spacexdata.com/v3/launches/77

schema.js

const { gql } = require('apollo-server');

const typeDefs = gql`
  type Query {
    singleLaunch(flightNumber: Int!): Launch
  }

  type Launch {
    flightNumber: Int!
    rocket: Rocket
  }

  type Rocket {
    firstStage: Cores
  }

  type Cores {
    cores: [CoreFields]
  }

  type CoreFields {
    flight: Int
    gridfins: Boolean
    legs: Boolean
    reused: Boolean
    landingType: String
    landingVehicle: String
    landingSuccess: Boolean
  }
`;

module.exports = typeDefs;

Data Source - launch.js

const { RESTDataSource } = require('apollo-datasource-rest');

class LaunchAPI extends RESTDataSource {
  constructor() {
    super();
    this.baseURL = 'https://api.spacexdata.com/v3/';
  }

  async getLaunchById({ launchId }) {
    const res = await this.get('launches', {
      flight_number: launchId,
    });
    return this.launchReducer(res[0]);
  }

launchReducer(launch) {
    return {
      flightNumber: launch.flight_number || 0,
      rocket: {
        firstStage: {
          cores: [
            {
              flight: launch.rocket.first_stage.cores.flight,
              gridfins: launch.rocket.first_stage.cores.gridfins,
              legs: launch.rocket.first_stage.cores.legs,
              landingType: launch.rocket.first_stage.cores.landing_type,
              landingVehicle: launch.rocket.first_stage.cores.landing_vehicle,
              landingSuccess: launch.rocket.first_stage.cores.landing_success,
            },
          ],
        },
    };
  }
}

module.exports = LaunchAPI;

resolvers.js

module.exports = {
  Query: {
    singleLaunch: (_, { flightNumber }, { dataSources }) =>
      dataSources.launchAPI.getLaunchById({ launchId: flightNumber }),
  },
};

Query

query GetLaunchById($flightNumber: Int!) {
  singleLaunch(flightNumber: $flightNumber) {
    flightNumber
    rocket {
      firstStage {
        cores {
          flight
          gridfins
          legs
          reused
          landingType
          landingVehicle
          landingSuccess
        }
      }
    }
  }
}

Expected Result

{
  "data": {
    "singleLaunch": {
      "flightNumber": 77,
      "rocket": {
        "firstStage": {
          "cores": [
            {
              "flight": 1,
              "gridfins": true,
              "legs": true,
              "reused": true,
              "landingType": "ASDS",
              "landingVehicle": "OCISLY",
              "landSuccess": true,
            },
            {
              "flight": 1,
              "gridfins": true,
              "legs": true,
              "reused": false,
              "landingType": "RTLS",
              "landingVehicle": "LZ-1",
              "landSuccess": true
            },
            {
              "flight": 1,
              "gridfins": true,
              "legs": true,
              "reused": false,
              "landingType": "RTLS",
              "landingVehicle": "LZ-2",
              "landSuccess": true
            },
          ]
        }
      },
    }
  }
}

Actual Result (Through GraphQL Playground)

{
  "data": {
    "singleLaunch": {
      "flightNumber": 77,
      "rocket": {
        "firstStage": {
          "cores": [
            {
              "flight": null,
              "gridfins": null,
              "legs": null,
              "reused": null,
              "landingType": null,
              "landingVehicle": null,
              "landingSuccess": null
            }
          ]
        }
      },
    }
  }
}

Any suggestions as to what I am doing wrong here would be greatly appreciated. Again, let me know if more information is needed.

Thank you!

Upvotes: 1

Views: 1199

Answers (1)

xadm
xadm

Reputation: 8418

Missing base url

There should be

await this.get( this.baseURL + 'launches'


IMHO there should be a map used within launchReducer to return an array, sth like:

launchReducer(launch) {
    return {
      flightNumber: launch.flight_number || 0,
      rocket: {
        firstStage: {
          cores: launch.rocket.first_stage.cores.map(core => ({
            flight: core.flight,
            gridfins: core.gridfins,
            legs: core.legs,
            landingType: core.landing_type,
            landingVehicle: core.landing_vehicle,
            landSuccess: core.land_success,
          })),
        },
      },
    };
}  

.map(core => ({ is for returning object [literal], the same as/shorter version of .map(core => { return {

Upvotes: 1

Related Questions