What is the best way to transform/adapt the data that I received from a query?

Feedback
,
1 
import {gql} from '@apollo/client';

export const PULL_REQUESTS_QUERY = gql`
    query PullRequestsQuery($query: String!, $after: String) {
        search(query: $query, type: REPOSITORY, first: 100, after: $after) {
            repositoryCount
            nodes {
                ... on Repository {
                    nameWithOwner
                }
            }
            pageInfo {
                hasNextPage
                endCursor
            }
        }
    }
`;

So here’s a pull request query for GitHub’s API.

This will return a response like…

{
  "search": {
    "nodes": [
      {
        "nameWithOwner": ''NAME_WITH_OWNER"
      }
    ]
    // ...
  }
}

For my React components, I’d like to transform the structure to something like…

{
  "repositories": [
    {
      "nameWithOwner": ''NAME_WITH_OWNER"
    }
  ]
}

All I do is read the data and I don’t mutate or anything. That’s the best way to way with Apollo client?

2

apollo redux selector alternative

Perhaps like they do here? readSomething
Or useMemo() hook?

3

Hmm, lots to read up on this so I’ll get back and reply to this thread to see if this is actually what I’m looking for. For now what I’m doing is…

const adaptedData = transformToSomething(data.search.edges/nodes/etc);

// ...

return <div>{adaptedData}</div>
4

Welcome to the community, @rodoabad!!

You might be looking for Aliases.

You can add an alias to the nodes field in your query like this:

repositories: nodes {
    nameWithOwner
}

and the response would look like this:

"repositories": [
    {
      "nameWithOwner": ''NAME_WITH_OWNER"
    }
  ]