Working with external API response data

Hi,

I wonder if there are any docs/videos on Themeco resources which describe possible manipulations with the data received from an external API. Are there any basics, like swapping the data received from ascending to descending order, etc.? Should that be executed by using TWIG?

Hi John,

Thanks for reaching out.
A few guidelines are already available in our online documentation. Please find them below:

  1. https://theme.co/docs/external-api-developers
  2. https://theme.co/docs/external-api-integration
  3. https://theme.co/docs/twig
  4. https://theme.co/docs/twig-api

Hope it helps.
Thanks

Thanks @tristup,

I have checked the references but still have a challenge with basic sorting of the data.

Here is an example:

{% for i in [ looper.item.Dates ] | reverse %}
	{{ i }}
{% endfor %}

Or this:

{% set data = [ looper.field({"key":"Dates"}) ] %}
{% for dates in data|reverse %}
	{{ dates }}
{% endfor %}

The array still displays dates in chronological order, from earliest to most recent, as received from the API response.

Since you are wrapping your data in an array via [ looper.field({"key":"Dates"}) ] you will only ever reverse a one element array.

To me it sounds like you want to do looper.field({"key":"Dates"}) | reverse instead. Although I’m not sure if Dates is an array.

If the above doesn’t help, when you do {{ looper.field({"key":"Dates"}) | json_encode }} what do you see?

Hi @charlie,

Yes, I want to revert all instances of the looped data inside the array into the opposite order. So instead of 0, 1, 2, 3, 4, 5 that would be 5, 4, 3, 2, 1, 0. But with different dates and date ranges (values) instead of the numbers.
I will also need to do the same with other arrays inside API response, which might have text or boolean values instead. In other words, if we were to work with an Excel table, we would need to revert the order of all rows from A…Z to Z…A in our output.

Current A…Z output for Dates array is the following:

Using looper.field({"key":"Dates"}) | reverse does not return anything.

The output of the {{ looper.field({"key":"Dates"}) | json_encode }} is the following:

Request to the API endpoint is in Raw format.

Hey John,

The looper.field({"key":"Dates"}) probably returns a single field value, not an array that can be reversed that is why looper.field({"key":"Dates"}) | reverse does not work.

You will need custom programming to process the output of {{ looper.field({"key":"Dates"}) | json_encode }}. Regretfully, custom programming is beyond the scope of our theme support.

You can sign up to our One service where we can provide customization suggestions.

Thank you for understanding.

Thanks @christian for the info.

With respect to the looper.field({"key":"Dates"}) did I understand you and @charlie right that I need to make a container which will be a looper consumer and looper provider at the same time so that I could receive an array and apply a reverse function? Then I need to create a nested container within that parent container which will be another looper consumer to receive the reversed data as single field values. I’m just a bit confused about how to pass those reversed single field values over to the nested element for a new loop. Is that possible without custom programming with a TWIG template maybe?

By the way, can One service be used for mentoring purposes? I understand that this question is probably more specific and not what support covers. I want to learn about External API and TWIG in detail, but it often becomes complex without coding experience. I hope that Theme.co Team will consider adding this topic to Max or creating a new subscription for online advanced tutorials with coding basics in the future. It is very much needed. Otherwise, these features stay versatile and powerful tools, but are only accessible to a small group with coding skills.

It’s sort of hard to tell on your second screenshot, but I think you might want to use the split filter for each new line (\n). Because the “Dates” is just a large list of text. If you are getting sent CSV data you can try using the CSV looper too. Although you might have to get creative with ordering in a reverse manner using flex box “reverse”.

We would be happy to to mentor you through One. If you sign up for One Total Care we can handle your custom coding and External API too.

We do slightly touch on the External API in super loopers if you haven’t already checked out the Notion videos. We’ll probably continue to put External API videos in that Max course. It is a bit hard working with APIs in general since they can all be different.

Have a great day.

1 Like