List rendering in Horizon theme

Online Store and Theme Development
1

I think Horizon could be fantastic. I’d like to share some thoughts I realized while dealing with the Horizon not rendering articles/pages in the search results that could help it move the way you want it to:

  1. Although regular search is hardcoded to products only, predictive search does allow all types and uses the resource_card.liquid snippet. on initial glance, it would seem this would be a good choice to replace in search
  2. However predictive-search.liquid is javascript heavy and appears to use its own hardcoded display style (not easily customizable). This is a significant reason why we disabled Horizon predictive search for our sites. It also makes it less clear what grid can be used for the search results.
  3. Conversely, product-card.liquid block is much more flexible. IMO, it is best because it starts with a “group” that the administrator can easily customize. It would be even better if the image wasn’t hardcoded - that would make it easier to do other layout changes, such as text beside image instead of text below image. The main problem is that this block only accepts products.
  4. There are a number of situations where we want to simply take a list and render it: product list, image list, link list, tag list, blog list, page list, etc. Unfortunately, Horizon seems doesn’t have a consistent way to do this. This makes the codebase much more complex for us to digest and for Shopify to maintain. If Horizon did have a consistent way to do this, the HTML would be consistent regardless if we are showing the list as a slideshow, thumbnail gallery, search results, etc. Users could easily customize the display with CSS.
  5. IMO the deeper solution is to move towards that sort of unification. One approach described below:
    1. The “group” block is fairly close to an all-purpose grid/list. It could be modified to receive a list of varying item types.
    2. Within that could be a number of repeating block types that are conditionally rendered IFF the list item matches its type. The types might be: product, article, page, string, metaobject.
    3. For example, on a product collection, the user could just add the product block to render each of the products. Even if they were able to add a “page” block, it wouldn’t do anything because collection product arrays only contain products. But, on the search page, the user could add blocks for page, article, and product so that everything is rendered. Or, if they only wanted to show products in search results, they could simply not include those blocks and those items render nothing. Also, if a user wanted to render a list from a product metafield (such as product specifications), they could add the group block, feed it the metafield, then use the proposed recurring “string” block to spit out the data.
    4. Lastly, it would be especially nice if the group block had the ability to receive custom CSS. This would make it more intuitive vs stuffing all the CSS in the section.

Otherwise, I’m still excited about Horizon, but is this a pipe dream?