API response to array

I am very new to retool and coding. I have built an API call which returns a list of template information. I would like to use this response to create an array for a "select" component. My goal is to call the API to get a list of template names and the corresponding ID, feed that to a "select" component and then use the selected ID to update a variable.

My API response is:
[
{
"id": "525",
"name": "1.5"x.5" Shelf Tag w/Price",
"description": "",
"createDateTime": "2024-04-24T15:37:16",
"changeDateTime": "2024-04-24T15:45:28",
"favorite": true
},
{
"id": "523",
"name": "1"x1" Barcode w/Price",
"description": "",
"createDateTime": "2024-04-23T16:31:32",
"changeDateTime": "2024-04-24T15:11:56",
"favorite": true
},
{
"id": "524",
"name": "2"x1" Shelf Tag w/Price",
"description": "",
"createDateTime": "2024-04-24T14:52:33",
"changeDateTime": "2024-04-24T15:59:00",
"favorite": true
}
]

Currently, I have the value of the select component set to:
['{{azureTempListGet.data['0'].id}}',
'{{azureTempListGet.data['1'].id}}',
'{{azureTempListGet.data['2'].id}}']

and the label set to:
['{{azureTempListGet.data['0'].name}}',
'{{azureTempListGet.data['1'].name}}',
'{{azureTempListGet.data['2'].name}}']

I am sure there is code I can use to turn the API result into an array that can automatically create a new line for each ID and name based on how many results there are instead of having to manually type the same {{azureTempListGet.data['0'].name}} over and over and change the ['x'} each time.

Thank you for your time!

Welcome @Big_Blue_Hospitality! You are looking for a straightforward JavaScript loop, as far as I can tell.

For the select component:

{{
for (let i = 0; i < azureTempListGet.data.length; i++) {
  resultArray.push(`{{azureTempListGet.data[${i}].id}}`);
}
}}

and for the labels:

{{
for (let i = 0; i < azureTempListGet.data.length; i++) {
  resultArray.push(`{{azureTempListGet.data[${i}].name}}`);
}
}}

Good luck!

Thank you for this, @jg80! Would I put this in a new Run JS Code Resource, or a transformer?

You can put it directly into the select component’s data source, assuming azureTempListGet is a resource in the app.

Wherever you have this,

replace it with:

{{
for (let i = 0; i < azureTempListGet.data.length; i++) {
  resultArray.push(`{{azureTempListGet.data[${i}].id}}`);
}
}}

And wherever you have this:

replace it with:

{{
for (let i = 0; i < azureTempListGet.data.length; i++) {
  resultArray.push(`{{azureTempListGet.data[${i}].name}}`);
}
}}

@jg80, I get an “unclosed template literal” error.

OK - I think I see now what you are trying to do. You just want to have a select with the values being the "id" in each object in the array, labeled with the "name". That's way simpler.

I copy/pasted your sample API response in a query block and returned it to mimic the API. Then I set that as the data source for the select component in "mapped" mode. I used item to set the value (item.id) and label (item.name). The drop down looks right:

Then when you select one, the value of the select is whatever the corresponding ID is:

Is that what you are looking for? Using item will allow you to grow the list automatically no matter how many objects come back from your API, which is what I think the original point was.

This is what I am looking for. However, I do not see the ability to switch to "mapped" mode in the mobile app "select" component.

didn't realize it was mobile...let .map() do the work...

Values:
{{azureTempListGet.data.map(obj => obj.id)}}
Labels:
{{azureTempListGet.data.map(obj => obj.name)}}

1 Like

This is EXACTLY what I needed!! Thank you so much!

1 Like

@jg80, I have come up with another quandary... I am now trying to do something similar to build an array of items: item_data: variations: item_variation_data: name and item_variation_id for a select component. I tried modifying the code you provided for the previous answer, but it seems like this data is nested differently. Any help you may be able to provide would be fantastic! The API response data is below.

{
"items": [
{
"type": "ITEM",
"id": "IRSRFEQTNAECT7D4TROZ6AX6",
"updated_at": "2024-04-13T22:36:10.05Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047770050,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_data": {
"name": "Fire Support Shirt",
"is_taxable": true,
"visibility": "PRIVATE",
"tax_ids": [
"SMGUDIJMUIGXCFLINNSCPZX5",
"WP5QHMAJRFOXTMOEFBPPLDMP",
"OME3VRAJ5L2QTNWUM7RFT2UE"
],
"variations": [
{
"type": "ITEM_VARIATION",
"id": "M3HKLHNYXC4A2JBVVMSOI7HU",
"updated_at": "2024-04-13T22:35:44.662Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047744662,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_data": {
"item_id": "IRSRFEQTNAECT7D4TROZ6AX6",
"name": "X Large, T-Shirt, Green",
"ordinal": 0,
"pricing_type": "FIXED_PRICING",
"price_money": {
"amount": 2499,
"currency": "USD"
},
"location_overrides": [
{
"location_id": "LC9EEMNN4Z5B3",
"track_inventory": true
},
{
"location_id": "LERQKV9QX0F95",
"track_inventory": true
},
{
"location_id": "LJWSV2ESJ4W4A",
"track_inventory": true
},
{
"location_id": "LKWYXK0QTGA2C",
"track_inventory": true,
"sold_out": true
},
{
"location_id": "LMYMGH7AGBHHY",
"track_inventory": true
}
],
"track_inventory": true,
"item_option_values": [
{
"item_option_id": "WXSOOUOZ6E3SI5IZ3EGRJ4CE",
"item_option_value_id": "7WG55PGEK3H3P6X4GAYY42JJ"
},
{
"item_option_id": "7QJ2PAECN6IIA6G52BZCCMST",
"item_option_value_id": "U373OWZS4WP7PWDLHVAQSNWQ"
},
{
"item_option_id": "4TWZIYAD7P6QBWED4C5EJEFX",
"item_option_value_id": "ES7JI6WYSV7UZ33D7F76K2DR"
}
],
"sellable": true,
"stockable": true,
"default_unit_cost": {
"amount": 2000,
"currency": "USD"
},
"item_variation_vendor_info_ids": [
"3XIIOHSU23EWKKVO3JUQTRII"
],
"item_variation_vendor_infos": [
{
"type": "ITEM_VARIATION_VENDOR_INFO",
"id": "3XIIOHSU23EWKKVO3JUQTRII",
"updated_at": "2024-04-13T22:35:43.142Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047743142,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_vendor_info_data": {
"ordinal": 1,
"price_money": {
"amount": 2000,
"currency": "USD"
},
"item_variation_id": "M3HKLHNYXC4A2JBVVMSOI7HU",
"vendor_id": "4QLS7VA52MFJWFCQ"
}
}
]
}
},
{
"type": "ITEM_VARIATION",
"id": "FPZQJ4SIPLSAQVSUXSWXZSQ7",
"updated_at": "2024-04-13T22:35:44.662Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047744662,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_data": {
"item_id": "IRSRFEQTNAECT7D4TROZ6AX6",
"name": "X Large, T-Shirt, Blue",
"ordinal": 1,
"pricing_type": "FIXED_PRICING",
"price_money": {
"amount": 2499,
"currency": "USD"
},
"location_overrides": [
{
"location_id": "LC9EEMNN4Z5B3",
"track_inventory": true
},
{
"location_id": "LERQKV9QX0F95",
"track_inventory": true
},
{
"location_id": "LJWSV2ESJ4W4A",
"track_inventory": true
},
{
"location_id": "LKWYXK0QTGA2C",
"track_inventory": true,
"sold_out": true
},
{
"location_id": "LMYMGH7AGBHHY",
"track_inventory": true
}
],
"track_inventory": true,
"item_option_values": [
{
"item_option_id": "WXSOOUOZ6E3SI5IZ3EGRJ4CE",
"item_option_value_id": "7WG55PGEK3H3P6X4GAYY42JJ"
},
{
"item_option_id": "7QJ2PAECN6IIA6G52BZCCMST",
"item_option_value_id": "U373OWZS4WP7PWDLHVAQSNWQ"
},
{
"item_option_id": "4TWZIYAD7P6QBWED4C5EJEFX",
"item_option_value_id": "R22TMQLNHXAOIU4APGUQXDMQ"
}
],
"sellable": true,
"stockable": true,
"default_unit_cost": {
"amount": 2000,
"currency": "USD"
},
"item_variation_vendor_info_ids": [
"ZR2GS3EA6MKYW2UNOOMDAGQR"
],
"item_variation_vendor_infos": [
{
"type": "ITEM_VARIATION_VENDOR_INFO",
"id": "ZR2GS3EA6MKYW2UNOOMDAGQR",
"updated_at": "2024-04-13T22:35:43.142Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047743142,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_vendor_info_data": {
"ordinal": 1,
"price_money": {
"amount": 2000,
"currency": "USD"
},
"item_variation_id": "FPZQJ4SIPLSAQVSUXSWXZSQ7"
}
}
]
}
},
{
"type": "ITEM_VARIATION",
"id": "5UDQYOFJPKG3JLPMCVY6Z4H7",
"updated_at": "2024-04-13T22:35:44.662Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047744662,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_data": {
"item_id": "IRSRFEQTNAECT7D4TROZ6AX6",
"name": "X Large, Long Sleeve, Green",
"ordinal": 2,
"pricing_type": "FIXED_PRICING",
"price_money": {
"amount": 2499,
"currency": "USD"
},
"location_overrides": [
{
"location_id": "LC9EEMNN4Z5B3",
"track_inventory": true
},
{
"location_id": "LERQKV9QX0F95",
"track_inventory": true
},
{
"location_id": "LJWSV2ESJ4W4A",
"track_inventory": true
},
{
"location_id": "LKWYXK0QTGA2C",
"track_inventory": true,
"sold_out": true
},
{
"location_id": "LMYMGH7AGBHHY",
"track_inventory": true
}
],
"track_inventory": true,
"item_option_values": [
{
"item_option_id": "WXSOOUOZ6E3SI5IZ3EGRJ4CE",
"item_option_value_id": "7WG55PGEK3H3P6X4GAYY42JJ"
},
{
"item_option_id": "7QJ2PAECN6IIA6G52BZCCMST",
"item_option_value_id": "TJGLP3AM7634ZNFGXY5AUS2P"
},
{
"item_option_id": "4TWZIYAD7P6QBWED4C5EJEFX",
"item_option_value_id": "ES7JI6WYSV7UZ33D7F76K2DR"
}
],
"sellable": true,
"stockable": true,
"default_unit_cost": {
"amount": 2000,
"currency": "USD"
},
"item_variation_vendor_info_ids": [
"YPV546IUPBTK4PXQLH5XQZ2A"
],
"item_variation_vendor_infos": [
{
"type": "ITEM_VARIATION_VENDOR_INFO",
"id": "YPV546IUPBTK4PXQLH5XQZ2A",
"updated_at": "2024-04-13T22:35:43.142Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047743142,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_vendor_info_data": {
"ordinal": 1,
"price_money": {
"amount": 2000,
"currency": "USD"
},
"item_variation_id": "5UDQYOFJPKG3JLPMCVY6Z4H7"
}
}
]
}
},
{
"type": "ITEM_VARIATION",
"id": "K7JMLQ4Z5JA6UKEML4QUVEZ4",
"updated_at": "2024-04-13T22:35:44.662Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047744662,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_data": {
"item_id": "IRSRFEQTNAECT7D4TROZ6AX6",
"name": "X Large, Long Sleeve, Blue",
"ordinal": 3,
"pricing_type": "FIXED_PRICING",
"price_money": {
"amount": 2499,
"currency": "USD"
},
"location_overrides": [
{
"location_id": "LC9EEMNN4Z5B3",
"track_inventory": true
},
{
"location_id": "LERQKV9QX0F95",
"track_inventory": true
},
{
"location_id": "LJWSV2ESJ4W4A",
"track_inventory": true
},
{
"location_id": "LKWYXK0QTGA2C",
"track_inventory": true,
"sold_out": true
},
{
"location_id": "LMYMGH7AGBHHY",
"track_inventory": true
}
],
"track_inventory": true,
"item_option_values": [
{
"item_option_id": "WXSOOUOZ6E3SI5IZ3EGRJ4CE",
"item_option_value_id": "7WG55PGEK3H3P6X4GAYY42JJ"
},
{
"item_option_id": "7QJ2PAECN6IIA6G52BZCCMST",
"item_option_value_id": "TJGLP3AM7634ZNFGXY5AUS2P"
},
{
"item_option_id": "4TWZIYAD7P6QBWED4C5EJEFX",
"item_option_value_id": "R22TMQLNHXAOIU4APGUQXDMQ"
}
],
"sellable": true,
"stockable": true,
"default_unit_cost": {
"amount": 2000,
"currency": "USD"
},
"item_variation_vendor_info_ids": [
"4LVH4HMCDGPUCKWFXJIPXEA2"
],
"item_variation_vendor_infos": [
{
"type": "ITEM_VARIATION_VENDOR_INFO",
"id": "4LVH4HMCDGPUCKWFXJIPXEA2",
"updated_at": "2024-04-13T22:35:43.142Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047743142,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_vendor_info_data": {
"ordinal": 1,
"price_money": {
"amount": 2000,
"currency": "USD"
},
"item_variation_id": "K7JMLQ4Z5JA6UKEML4QUVEZ4",
"vendor_id": "4QLS7VA52MFJWFCQ"
}
}
]
}
},
{
"type": "ITEM_VARIATION",
"id": "EOUJISLUMR23Z73NWQPXK3TB",
"updated_at": "2024-04-13T22:35:44.662Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047744662,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_data": {
"item_id": "IRSRFEQTNAECT7D4TROZ6AX6",
"name": "Large, T-Shirt, Green",
"ordinal": 4,
"pricing_type": "FIXED_PRICING",
"price_money": {
"amount": 2499,
"currency": "USD"
},
"location_overrides": [
{
"location_id": "LC9EEMNN4Z5B3",
"track_inventory": true
},
{
"location_id": "LERQKV9QX0F95",
"track_inventory": true
},
{
"location_id": "LJWSV2ESJ4W4A",
"track_inventory": true
},
{
"location_id": "LKWYXK0QTGA2C",
"track_inventory": true,
"sold_out": true
},
{
"location_id": "LMYMGH7AGBHHY",
"track_inventory": true
}
],
"track_inventory": true,
"item_option_values": [
{
"item_option_id": "WXSOOUOZ6E3SI5IZ3EGRJ4CE",
"item_option_value_id": "MDBVS3UP2O2YOIG4SB3ZPZRW"
},
{
"item_option_id": "7QJ2PAECN6IIA6G52BZCCMST",
"item_option_value_id": "U373OWZS4WP7PWDLHVAQSNWQ"
},
{
"item_option_id": "4TWZIYAD7P6QBWED4C5EJEFX",
"item_option_value_id": "ES7JI6WYSV7UZ33D7F76K2DR"
}
],
"sellable": true,
"stockable": true,
"default_unit_cost": {
"amount": 2000,
"currency": "USD"
},
"item_variation_vendor_info_ids": [
"KYLOLB3GMGA3BVMSZRAD5E6V"
],
"item_variation_vendor_infos": [
{
"type": "ITEM_VARIATION_VENDOR_INFO",
"id": "KYLOLB3GMGA3BVMSZRAD5E6V",
"updated_at": "2024-04-13T22:35:43.142Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047743142,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_vendor_info_data": {
"ordinal": 1,
"price_money": {
"amount": 2000,
"currency": "USD"
},
"item_variation_id": "EOUJISLUMR23Z73NWQPXK3TB"
}
}
]
}
},
{
"type": "ITEM_VARIATION",
"id": "CWZLMQJPANN7QUFBXA5HN3JL",
"updated_at": "2024-04-13T22:35:44.662Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047744662,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_data": {
"item_id": "IRSRFEQTNAECT7D4TROZ6AX6",
"name": "Large, T-Shirt, Blue",
"ordinal": 5,
"pricing_type": "FIXED_PRICING",
"price_money": {
"amount": 2499,
"currency": "USD"
},
"location_overrides": [
{
"location_id": "LC9EEMNN4Z5B3",
"track_inventory": true
},
{
"location_id": "LERQKV9QX0F95",
"track_inventory": true
},
{
"location_id": "LJWSV2ESJ4W4A",
"track_inventory": true
},
{
"location_id": "LKWYXK0QTGA2C",
"track_inventory": true,
"sold_out": true
},
{
"location_id": "LMYMGH7AGBHHY",
"track_inventory": true
}
],
"track_inventory": true,
"item_option_values": [
{
"item_option_id": "WXSOOUOZ6E3SI5IZ3EGRJ4CE",
"item_option_value_id": "MDBVS3UP2O2YOIG4SB3ZPZRW"
},
{
"item_option_id": "7QJ2PAECN6IIA6G52BZCCMST",
"item_option_value_id": "U373OWZS4WP7PWDLHVAQSNWQ"
},
{
"item_option_id": "4TWZIYAD7P6QBWED4C5EJEFX",
"item_option_value_id": "R22TMQLNHXAOIU4APGUQXDMQ"
}
],
"sellable": true,
"stockable": true,
"default_unit_cost": {
"amount": 2000,
"currency": "USD"
},
"item_variation_vendor_info_ids": [
"4SJT6MMGA4M22HAEC5TMD23I"
],
"item_variation_vendor_infos": [
{
"type": "ITEM_VARIATION_VENDOR_INFO",
"id": "4SJT6MMGA4M22HAEC5TMD23I",
"updated_at": "2024-04-13T22:35:43.142Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047743142,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_vendor_info_data": {
"ordinal": 1,
"price_money": {
"amount": 2000,
"currency": "USD"
},
"item_variation_id": "CWZLMQJPANN7QUFBXA5HN3JL"
}
}
]
}
},
{
"type": "ITEM_VARIATION",
"id": "UZ4K3SEVRGJ4XRMOAZJXHAVT",
"updated_at": "2024-04-13T22:35:44.662Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047744662,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_data": {
"item_id": "IRSRFEQTNAECT7D4TROZ6AX6",
"name": "Large, Long Sleeve, Green",
"ordinal": 6,
"pricing_type": "FIXED_PRICING",
"price_money": {
"amount": 2499,
"currency": "USD"
},
"location_overrides": [
{
"location_id": "LC9EEMNN4Z5B3",
"track_inventory": true
},
{
"location_id": "LERQKV9QX0F95",
"track_inventory": true
},
{
"location_id": "LJWSV2ESJ4W4A",
"track_inventory": true
},
{
"location_id": "LKWYXK0QTGA2C",
"track_inventory": true,
"sold_out": true
},
{
"location_id": "LMYMGH7AGBHHY",
"track_inventory": true
}
],
"track_inventory": true,
"item_option_values": [
{
"item_option_id": "WXSOOUOZ6E3SI5IZ3EGRJ4CE",
"item_option_value_id": "MDBVS3UP2O2YOIG4SB3ZPZRW"
},
{
"item_option_id": "7QJ2PAECN6IIA6G52BZCCMST",
"item_option_value_id": "TJGLP3AM7634ZNFGXY5AUS2P"
},
{
"item_option_id": "4TWZIYAD7P6QBWED4C5EJEFX",
"item_option_value_id": "ES7JI6WYSV7UZ33D7F76K2DR"
}
],
"sellable": true,
"stockable": true,
"default_unit_cost": {
"amount": 2000,
"currency": "USD"
},
"item_variation_vendor_info_ids": [
"MDRFYJGAVAINPILMB2MTOVJV"
],
"item_variation_vendor_infos": [
{
"type": "ITEM_VARIATION_VENDOR_INFO",
"id": "MDRFYJGAVAINPILMB2MTOVJV",
"updated_at": "2024-04-13T22:35:43.142Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047743142,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_vendor_info_data": {
"ordinal": 1,
"price_money": {
"amount": 2000,
"currency": "USD"
},
"item_variation_id": "UZ4K3SEVRGJ4XRMOAZJXHAVT"
}
}
]
}
},
{
"type": "ITEM_VARIATION",
"id": "VLP3V6235DFJ3HUKCR3UOAWC",
"updated_at": "2024-04-13T22:35:44.662Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047744662,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_data": {
"item_id": "IRSRFEQTNAECT7D4TROZ6AX6",
"name": "Large, Long Sleeve, Blue",
"ordinal": 7,
"pricing_type": "FIXED_PRICING",
"price_money": {
"amount": 2499,
"currency": "USD"
},
"location_overrides": [
{
"location_id": "LC9EEMNN4Z5B3",
"track_inventory": true
},
{
"location_id": "LERQKV9QX0F95",
"track_inventory": true
},
{
"location_id": "LJWSV2ESJ4W4A",
"track_inventory": true
},
{
"location_id": "LKWYXK0QTGA2C",
"track_inventory": true,
"sold_out": true
},
{
"location_id": "LMYMGH7AGBHHY",
"track_inventory": true
}
],
"track_inventory": true,
"item_option_values": [
{
"item_option_id": "WXSOOUOZ6E3SI5IZ3EGRJ4CE",
"item_option_value_id": "MDBVS3UP2O2YOIG4SB3ZPZRW"
},
{
"item_option_id": "7QJ2PAECN6IIA6G52BZCCMST",
"item_option_value_id": "TJGLP3AM7634ZNFGXY5AUS2P"
},
{
"item_option_id": "4TWZIYAD7P6QBWED4C5EJEFX",
"item_option_value_id": "R22TMQLNHXAOIU4APGUQXDMQ"
}
],
"sellable": true,
"stockable": true,
"default_unit_cost": {
"amount": 2000,
"currency": "USD"
},
"item_variation_vendor_info_ids": [
"C3NNAY5FD7XP2YFYLX2WI5AN"
],
"item_variation_vendor_infos": [
{
"type": "ITEM_VARIATION_VENDOR_INFO",
"id": "C3NNAY5FD7XP2YFYLX2WI5AN",
"updated_at": "2024-04-13T22:35:43.142Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047743142,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_vendor_info_data": {
"ordinal": 1,
"price_money": {
"amount": 2000,
"currency": "USD"
},
"item_variation_id": "VLP3V6235DFJ3HUKCR3UOAWC",
"vendor_id": "4QLS7VA52MFJWFCQ"
}
}
]
}
},
{
"type": "ITEM_VARIATION",
"id": "5ORXCKJLJBTOKJK7SQCYUJCZ",
"updated_at": "2024-04-13T22:35:44.662Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047744662,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_data": {
"item_id": "IRSRFEQTNAECT7D4TROZ6AX6",
"name": "Medium, T-Shirt, Green",
"ordinal": 8,
"pricing_type": "FIXED_PRICING",
"price_money": {
"amount": 2499,
"currency": "USD"
},
"location_overrides": [
{
"location_id": "LC9EEMNN4Z5B3",
"track_inventory": true
},
{
"location_id": "LERQKV9QX0F95",
"track_inventory": true
},
{
"location_id": "LJWSV2ESJ4W4A",
"track_inventory": true
},
{
"location_id": "LKWYXK0QTGA2C",
"track_inventory": true,
"sold_out": true
},
{
"location_id": "LMYMGH7AGBHHY",
"track_inventory": true
}
],
"track_inventory": true,
"item_option_values": [
{
"item_option_id": "WXSOOUOZ6E3SI5IZ3EGRJ4CE",
"item_option_value_id": "4YBSV5A63XSSHLTLY66ZBAH5"
},
{
"item_option_id": "7QJ2PAECN6IIA6G52BZCCMST",
"item_option_value_id": "U373OWZS4WP7PWDLHVAQSNWQ"
},
{
"item_option_id": "4TWZIYAD7P6QBWED4C5EJEFX",
"item_option_value_id": "ES7JI6WYSV7UZ33D7F76K2DR"
}
],
"sellable": true,
"stockable": true,
"default_unit_cost": {
"amount": 2000,
"currency": "USD"
},
"item_variation_vendor_info_ids": [
"CUEBUYBPGY344DJXNZTFYXB3"
],
"item_variation_vendor_infos": [
{
"type": "ITEM_VARIATION_VENDOR_INFO",
"id": "CUEBUYBPGY344DJXNZTFYXB3",
"updated_at": "2024-04-13T22:35:43.142Z",
"created_at": "2024-04-13T22:35:43.142Z",
"version": 1713047743142,
"is_deleted": false,
"present_at_all_locations": false,
"present_at_location_ids": [
"LKWYXK0QTGA2C"
],
"item_variation_vendor_info_data": {
"ordinal": 1,
"price_money": {
"amount": 2000,
"currency": "USD"
},
"item_variation_id": "5ORXCKJLJBTOKJK7SQCYUJCZ"
}
}
]
}
}

I'll give you one more...you should read up a bit on how .map() works (like here for example), and you will also need to look into .flatMap() (here).
Also: cheatcode LLMs are pretty good at helping you reason through what you need to do to get a particular result from a sample JSON object...

Back to your question: you now have another layer in your data, so you need to add an additional level (items) to the start to get to the array you want to apply .map() to. This gives you differentData.data.items.map(...).

Then you need to iterate through another level. For each item in items, go to the array you want to loop through differentData.data.items.map(item => item.item_data.variations... and add another .map(...). Then loop through each vrtn in variations to get your values:

{{
differentData.data.items
  .map(item => item.item_data.variations
    .map(vrtn => vrtn.id))
}}

Note: I got the id instead of the item_id, assuming you wanted those since all of item_id values are the same

HOWEVER this will give you an array in an array. So you need to flatten the array, which you can do by replacing the first .map() with .flatMap():

{{
differentData.data.items
  .flatMap(item => item.item_data.variations
    .map(vrtn => vrtn.id))
}}

And similarly for the labels:

{{ 
// Note: go down another level in variations to get the name
differentData.data.items
  .flatMap(item => item.item_data.variations
    .map(vrtn => vrtn.item_variation_data.name))
}}

Hope this helps, and good luck with whatever you are building!

4 Likes

@jg80 Thank you so much for not only helping me get to where I need, but explaining and providing resources so I may learn more.

5 Likes