'Unnest' object within JSON


I've had a look around the forum but I'm struggling with this one.

I have a JSON table (excerpt in screenshot below):

I can't figure out how unnest data up.

I've read a considerable amount of the retool docs but cannot fathom how to do this.

The intended outcome is that the marketSizes.data array becomes new rows or columns, see below.

I would love any help that you can provide!

In table form, it looks like this


Hi @qlmoffat , are you intending to use two tables here?

If you have that table already on the commented screenshot, you can create another table and then put in the data input as:

{{ yourJSONTableNameHere.selectedRow.data.data }}

Note: the first data is the entire data of that selected row. the second data is the column name you have.

EDIT: added screenshot

Hey @jocen ,

Hoping to have just the one table if possible? Any ideas?

Hi @qlmoffat, you can use a js query to unnest the sub-array. @ben has a good sample for flattening nested array.

Also, @ben if you are reading this, does retool have plans to add nested rows/arrays in the table component?

Have there been any developments in retool to unnest json files? I can't seem to get any of the examples in this forum to work.

When working with nested data, the structure each service returns will often be unique and difficult to universally apply code examples to. @Bill_Waring if you are able to provide some examples of what the data structure looks like (the left panel opened in the top middle of the editor, is really useful for visualizing the data inside components) and any errors you're getting in trying to apply the examples to we can help debug from there!

I'd like to know the same thing as I wish I knew of this limitation before signing up. No queries or transformers I have tried work. I use this same API in other systems and it doesn't have this issue only retool does.