orderBy not working as expected

[tomsweeting]

First of all, thanks to @rwieruch for the course!

I'm trying out the exercises at the end of the Apollo Client with Pagination, Variables, Nested Objects and List Fields chapter, and have encountered a problem querying the GitHub API where the orderBy argument appears to be ignored.

Query:

query ($organization: String!) {
  organization(login: $organization) {
    name
    url
    repositories(first: 5, orderBy: {field: STARGAZERS, direction: DESC}) {
      edges {
        node {
          name
          url
          stargazers {
            totalCount
          }
        }
      }
    }
  }
}

Variables:

{
  "organization": "the-road-to-learn-react"
}

Response:

{
  "data": {
    "organization": {
      "name": "The Road to learn React",
      "url": "https://github.com/the-road-to-learn-react",
      "repositories": {
        "edges": [
          {
            "node": {
              "name": "react-lift-state",
              "url": "https://github.com/the-road-to-learn-react/react-lift-state",
              "stargazers": {
                "totalCount": 0
              }
            }
          },
          {
            "node": {
              "name": "use-with-viewbox",
              "url": "https://github.com/the-road-to-learn-react/use-with-viewbox",
              "stargazers": {
                "totalCount": 1
              }
            }
          },
          {
            "node": {
              "name": "the-road-to-learn-react-albanian",
              "url": "https://github.com/the-road-to-learn-react/the-road-to-learn-react-albanian",
              "stargazers": {
                "totalCount": 1
              }
            }
          },
          {
            "node": {
              "name": "react-router-nested-routes-example",
              "url": "https://github.com/the-road-to-learn-react/react-router-nested-routes-example",
              "stargazers": {
                "totalCount": 2
              }
            }
          },
          {
            "node": {
              "name": "react-usereducer-hook",
              "url": "https://github.com/the-road-to-learn-react/react-usereducer-hook",
              "stargazers": {
                "totalCount": 3
              }
            }
          }
        ]
      }
    }
  }
}

The results are always returned in ascending order no matter what direction is passed in. I have also tried cloning this repo, and adding in some additional console.log output I can see that the same thing happens.

I have tried checking the documentation in graphiql and the query appears to be correct so it may actually be an issue with the API itself, just thought I would point it out in case anyone else encounters this same issue and finds it confusing!

[rwieruch]

Hi @tomsweeting Thanks for creating the issue and making others aware of it! I cannot remember that I had the same issue back in the days, but maybe you are right and the API is just wrong at the moment. Let's see whether others run into this issue or whether it will get solved by GitHub 👍

[sauravhiremath]

I have the exact issue as mentioned by @tomsweeting

The orderBy argument sorts the returned list neither in ascending nor descending order

Query

{
  user(login: "sauravhiremath") {
    topRepositories(orderBy: {field: STARGAZERS, direction: DESC}, first: 5) {
      nodes {
        nameWithOwner
        stargazers {
          totalCount
        }
      }
    }
  }
}

Response

{
  "data": {
    "user": {
      "topRepositories": {
        "nodes": [
          {
            "nameWithOwner": "sauravhiremath/fifa",
            "stargazers": {
              "totalCount": 3
            }
          },
          {
            "nameWithOwner": "bundly/dash",
            "stargazers": {
              "totalCount": 5
            }
          },
          {
            "nameWithOwner": "sauravhiremath/fifa-api",
            "stargazers": {
              "totalCount": 17
            }
          },
          {
            "nameWithOwner": "sauravhiremath/skeduler",
            "stargazers": {
              "totalCount": 0
            }
          },
          {
            "nameWithOwner": "bundly/dash-beta",
            "stargazers": {
              "totalCount": 4
            }
          }
        ]
      }
    }
  }
}

[kod-man]

Hey @tomsweeting @rwieruch , I try to use the field section dynamically.

This is query section :

 query getUserRepos(
    $login: String!
    $after: String
    $field: FIELD
    $direction: DIRECTION
  )

And this is the useQuery section. We should not pass field parameters as a string. But I could not find a way so far

  const [field, SetField] = useState(FIELD.CREATED_AT);
  const [direction, SetDirection] = useState(DIRECTION.ASC);
  const history = useHistory();
  const { loading, error, data } = useQuery<
    getRepoDetails,
    getRepoDetailVariables
  >(GET_USER_REPOS, {
    variables: { login: username, after: null, field, direction },
  });

Payload section : direction: "ASC" field: "CREATED_AT"