How do I Create a simple table from a graphQL JSON response

Queries and Resources
1

Hi Guys

We are using graphQL as our key entry to our data, and as such, we are trying a very simple POC to see if we can build our whole admin system in Retool.

The thing is, I am stuck rendering a simple graphQL JSON response where it returns the data in the following format

QUERY

{{query1.data.hostgametimeserieshour.edges}}

RESPONSE

[
{
"node":{
"datetime":"2020-07-30T14:00:00+00:00",
"ccyCode":"USD",
"hostGame":{
"id":"2",
"displayName":"Royal Deuces GBET 1c"
},
"totalPlayers":1,
"totalGameplays":3,
"totalStakes":0.6,
"totalWinnings":0.4,
"financialGgr":0.2,
"financialRtp":66.66666666666667
}
},
{
"node":{
"datetime":"2020-07-30T13:00:00+00:00",
"ccyCode":"USD",
"hostGame":{
"id":"4",
"displayName":"Stallion Thunder Demo 1c"
},
"totalPlayers":1,
"totalGameplays":1,
"totalStakes":0.2,
"totalWinnings":0,
"financialGgr":0.2,
"financialRtp":0
}
}
]

It then creates just one column that I can then map using self, to extract one field, and when I use a calculated field, I then have to specify for each list item, which of course will not work.

I am sure this is really simple, and I am being a noob, but anyone have a quick answer to point me in the right direction?

image
image1177×622 62.4 KB

2

Hello @Flipperuk and welcome to the community! I think this should work:

{{ query1.data.hostgametimeserieshour.edges.map(node => Object.values(node)[0]) }}

LMK if this helps!

3

Justin,
You nailed it thankyou! If in the future, I want to pull out a single field out of the same query, how would that be mapped? so where we have node containing multiple fields, if I wanted to pull one, for example maybe in a drop down for the values and display, how would it work? For example if I want to pull id for Values, and displayName for the display…

Apologies, I am very much a Product Manger dude, who likes to get his hands dirty, but then really gets in too deep !

Have a great weekend

4

@Flipperuk I’d definitely recommend you take a look at a couple of basic Javascript data transformation tutorials (like here) - they’ll make your life a lot easier in Retool.

If you want to pull a single field out of that query, you’d add an additional .map() onto the above query. So if you wanted to get an array of all values for ccyCode, you’d use:

{{ query1.data.hostgametimeserieshour.edges.map(node => Object.values(node)[0]).map(item => item.ccyCode }}

Hope this helps!

1 Like
5

Justin, fantastic, and thanks for the pointer to the tutorial! Now it is starting to make sense…

Onwards and upwards.

1 Like