Make it easier to append and prepend items in arrays

[benjaminsehl]

Originally posted as issue #1851

Author: Shopify
Expected end date: December 5, 2024

Background

Handling arrays in Liquid is challenging.

Developers often need to convert arrays into strings, perform operations, and then split them back, relying heavily on the Liquid String API as it's more robust than the Array API.

{% assign titles = collections.last.products | map: "title" %}

{{
  titles
  | join: ","
  | append: ",default"
  | split: ","
}}
{{
  titles
  | join: ","
  | prepend: "All,"
  | split: ","
}}

Proposal

We should eliminate workarounds like string concatenation and splitting and make it easier to perform common tasks such as adding new items in an array. This will make Liquid templates simpler, less verbose, and more declarative.

To make that happen, we should support the append and prepend filters in arrays. They will return a new array with the specified element added to the end or beginning, respectively.

{% assign titles = collections.last.products | map: "title" %}

{{ titles | append: "default" }}
{{ titles | prepend: "All" }}

Limitations

This proposal is not backward compatible [1] [2].

{{ titles | append: "new" }}
{% # => "[\"Example T-Shirt\", \"Classic Varsity Top\", \"Classic Leather Jacket\", \"Dark Denim Top\"]new" %}

Therefore, the implementation is pending an impact assessment. If we identify it's impossible to handle backward compatibility, we aim to introduce only the append functionality instead, using an unused filter name (e.g. add).

We're proposing the append/prepend direction first because we consider this a more idiomatic and cohesive direction for the Liquid API.

Call for suggestions

We welcome any feedback or opinions on this proposal. Please share your thoughts by December 5, 2024. Your input is valuable as we prepare to begin active development on this initiative.

[bakura10]

yes, please make it easier to work with array. Also it would be nice to have unified arrays. For instance, product_list and collection_list setting in themes behave like array… but do not have any size attribute (for some reason it’s called count there, I mixed things all the time; having an alias would help a lot).

Ideally we should be able to append elements to those objects as well.

[Curzey]

Being able to manage arrays set by the liquid API, like product lists etc would be great.

Just be sure the pagination object also supports this.

Would open up for so much stuff!

[kevinruscoe]

Yeah, we need concat to accept an object, rather than just an array.

I've managed to get around this by using the where filter, which create an array with a single item, then concat'ing that.

  assign blank_items_array = '' | split: ''
  assign items = section.settings.products // this is a "product_list" type, which returns ProductList, where the limit filter doesn't work

  for item in items
    if forloop.index0 < 8 // 8 being the max size I want my new 'items' array to be
      assign single_item_as_array = items | where: 'id', item.id
      assign blank_items_array = blank_items_array | concat: single_item_as_array
    endif
  endfor

  assign items = blank_items_array