Variant metafield type List of files return string

[ramvyr]

If I used
{{ current_variant.metafields.custom.hero_images | json }}
result
{"error":"json not allowed for this object"}
If I used
{{ current_variant.metafields.custom.hero_images }}
result
["gid://shopify/MediaImage/31079273267451","gid://shopify/MediaImage/31079273300219"]

If I used

{%- assign hero_list = current_variant.metafields.custom.hero_images | split: ',' -%}
{{ hero_list[0] | json }}

result
"[\"gid:\/\/shopify\/MediaImage\/31079273267451\""

If I used
{{ current_variant.metafields.custom.hero_images.value | json }}
result
["\/\/cdn.shopify.com\/s\/files\/1\/0200\/6358\/4356\/files\/Black_-_Desktop.jpg?v=1666336384","\/\/cdn.shopify.com\/s\/files\/1\/0200\/6358\/4356\/files\/Black_-_Mobile.jpg?v=1666336384"]

But if I use

{{current_variant.metafields.custom.hero_images.value[0]}}
or
{% for value in current_variant.metafields.custom.hero_images.value }}
{{value}}
{%endfor%}

result -
null

How to transform this list that looks like an array to an object?
Or how I can get access for index in list files?

[MaxDesignFR]

I also noticed a similar bug to access metafields list by index:

For instance, this works as expected for single_line_text_field in list:

{{ product.metafields.namespace.key.value[0] }} => my first value
{{ product.metafields.namespace.key.value[1] }} => my second value

But it doesn't work for product_reference in list, unless for the first and last filters:

{{ product.metafields.namespace.key.value[0] }} => 
{{ product.metafields.namespace.key.value[1] }} => 
{{ product.metafields.namespace.key.value | first }} => ProductDrop (working)

I tried multiple array filters such as map and such, but it seems only a standard for loop allows to access product_reference in list, which can be annoying. This has been an issue since they release the list type feature.

[ramvyr]

@MaxDesignFR
I decided this only through JavaScript

{% if current_variant.metafields.custom.hero_images != blank %}
    <script>
        const HERO_IMAGES = []
        {% for variant in product.variants %}
          {% if variant.metafields.custom.hero_images != blank %}
          HERO_IMAGES[{{ variant.id }}] = JSON.parse('{{ variant.metafields.custom.hero_images.value | json }}')
          {% endif %}
        {% endfor %}
    </script>
{% endif %}

[akairo0902]

          {% assign data = product.metafields.namespace.key.value | json_string %}
  
          <img src="{{ data | img_url:'master' }}" />

[MaxDesignFR]

@akairo0902 Interesting filter, I wonder why it's undocumented. I do Shopify everyday so it's a shame I find out like that. It also does not solve the problem I highlighted. It seems metafields Objects (products, collections, ...) in a list are not accessible by index, still probably a bug:

Say a product metafield, with product type (list of values) :
{{ product.metafields.namespace.key.value[0].title }} => nothing

I did some testing and the filter json_string does not solve this problem.

[akairo0902]

oh really?
how about

{{ current_variant.metafields.custom.hero_images.value | json_string }}

[akairo0902]

I've also struggled the same problem. after I got
["\/\/cdn.shopify.com\/s\/files\/1\/0200\/6358\/4356\/files\/Black_-_Desktop.jpg?v=1666336384","\/\/cdn.shopify.com\/s\/files\/1\/0200\/6358\/4356\/files\/Black_-_Mobile.jpg?v=1666336384"]
by | json, I just changed it to json_string and I could get it as string data not as json one.

[MaxDesignFR]

The json_string filter works it's not the problem. The problem is just how I explained. If you tell me you found a way to access a metafield value by index (not with forloop, not with first and last filters, just regular [index]), with the condition that this value is a list of objects type (for instance, list of collections, list of products, list of pages probably too...) then you will make my day. I'm not gonna repeat myself since I think I explained in enough details in my first post. It's just an ongoing issue for now but we can still iterate with a loop even though it can be suboptimal sometimes.

[akairo0902]

ah I see. yeah I also tried to use "value[0]" but it didn't work. it won be the one you are looking for but I also could get what I want without json_string.

{%- for object in product.metafields.custom.sss.value -%}
    {%- for img in object.img.value -%}
        <img src="{{ img | img_url:'master' }}" />
    {%- endfor -%}
{%- endfor -%}