How can I effectively sort a custom collection?

Shopify Discussion
1

We have a component that lets you add additional collections on the collection page beside the main collection.

I’m using this snippet from Shopify to sort products, and it works perfectly with the main collection.

Here’s the relevant markup for the main collection that works:

{%- paginate collection.products by section.settings.products_per_page -%}
    
      

      {% for product in collection.products %}
        {% if product.available %}
          {% if product.featured_image %}
            {% render 'product-grid-item',
              product: product
            %}
          {% endif %}
        {% endif %}
      {% endfor %}
      

      {% if paginate.pages > 1 %}
        {% include 'pagination' %}
      {% endif %}
    

  {%- endpaginate -%}

But if I add a custom collection, the sort behavior doesn’t work:

{% assign collection = collections[section.settings.collection] %}

  {%- paginate collection.products by section.settings.products_per_page -%}
    
      

      {% for product in collection.products %}
        {% if product.available %}
          {% if product.featured_image %}
            {% render 'product-grid-item',
              product: product
            %}
          {% endif %}
        {% endif %}
      {% endfor %}
      

      {% if paginate.pages > 1 %}
        {% include 'pagination' %}
      {% endif %}
    

  {%- endpaginate -%}

The issue with sort seems to from this line:

{% assign collection = collections[section.settings.collection] %}

The sort_by URL parameter doesn’t seem to apply when the collection is fetched this way.

I’ve been scratching my head for hours. Does anyone have a solution for this?