How to migrate from Squirrelly 7 to Squirrelly 8

TLDR;

We currently updated our Squirrely dependency from Version 7 to Version 8 and with this it's needed to update your blok preview templates as well as your advanced path configurations to keep them maintainable over time.

Object Reference:
- Old: Use options as the object reference.
- New: Use it as the object reference.
Loop Syntax:
- Old: Use {{each(array)}} and {{foreach(object)}}.
- New: Use {{@each(array) => val, index}} and {{@foreach(object) => key, val}}.
Conditional Statements:
- Old: Use {{if(condition)}} and {{#else}}.
- New: Use {{@if(condition)}} and {{#else}}.
Image Tag:
- Old: Use {{image(options.image.filename)/}}.
- New: Use {{@image(it.image.filename)/}}.
Comparison:
- Old: Use {{if(options.number >= "1")}}.
- New: Use {{@if(it.number >= "1")}}.
Accessing Properties:
- Old: Access properties directly, e.g., {{story.slug}}.
- New: Access properties using the object reference, e.g., {{it.story.slug}}.
Arrow Functions in Loops:
- New: Use arrow functions to destructure values and indices in loops like {{@each(array) => val, index}}

How to migrate the Blok Preview Template

Migrating block previews

        
      <!-- simple text -->
<!-- old-->
<div class="text-red">{{ title }}</div>
<!-- new-->
<div class="text-red">{{ it.title }}</div>

<!-- each multi options -->
<!-- old-->
{{each(options.stories)}} The current index is {{@index}} {{/each}}
<!-- new-->
{{@each(it.stories) => val, index}} The current index is {{index}} {{/each}}

<!-- foreach -->
<!-- old-->
{{foreach(options.stories)}} Value: {{@this}} Key: {{@key}} {{/foreach}}
<!-- new-->
{{@foreach(it.stories) => key, val}} Val: {{val}} Key: {{key}} {{/foreach}}

<!-- if else -->
<!-- old-->
{{if(options.number === "1")}} True {{#else}} False {{/if}}
<!-- new-->
{{@if(it.number === "1")}} True {{#else}} False {{/if}}

<!-- image -->
<!-- old-->
{{image(options.image.filename)/}}
<!-- new-->
{{@image(it.image.filename)/}}

<!-- comparison -->
<!-- old-->
{{if(options.number >= "1")}} True {{#else}} False {{/if}}
<!-- new-->
{{@if(it.number >= "1")}} True {{#else}} False {{/if}}

How to migrate Advanced Path Configurations

Migrating block previews

        
      <!-- simple text -->
<!-- old-->
custom-{{ story.slug }}
<!-- new-->
custom-{{ it.story.slug }}

<!-- story -->
<!-- old-->
{{story.slug}}{{if(options.lang != '')}}?lang={{lang}}{{/if}}
<!-- new-->
{{it.story.slug}}{{@if(it.lang != '')}}?lang={{it.lang}}{{/if}}

<!-- lang -->
<!-- old-->
{{if(options.lang=='')}}{{story.slug}}{{#else}}
{{each(options.story.translated_slugs)}}{{if(options.lang==@this.lang)}}{{@this.slug}}{{/if}}{{/each}}{{/if}}
<!-- new-->
{{@if(it.lang=='')}}{{it.story.slug}}{{#else}}{{@each(it.story.translated_slugs) => value}}{{@if(it.lang==value.lang)}}{{value.slug}}{{/if}}{{/each}}{{/if}}

<!-- folder -->
<!-- old-->
{{folder.slug}}/{{if(options.lang != 'de-at' && options.lang != '')}}{{lang}}/{{/if}}{{if(options.lang == '')}}en/{{/if}}
<!-- new-->
{{it.folder.slug}}/{{@if(it.lang != 'de-at' && it.lang != '')}}{{it.lang}}/{{/if}}{{@if(it.lang == '')}}en/{{/if}}

How to migrate configurations with "translatable slugs"

With the update to Squirrelly 8 we provide a helper called @activeTranslatedSlug , you can find out more here.