Handlebars String Helper

Feature Request
1

Hi,

I’d like to see some common string template helpers such as “substring”, “index of” or “replace”. That could make life a little easier when rendering string data in experience views. I would have registered custom handlebar helpers for these tasks, but I couldn’t find out how this could be achieved in Losant.

Regards,
Marco

2

Hey @Marco_Bernutz,

These are good suggestions! You are correct that it is not possible to register custom helpers. Rendering occurs within Losant’s infrastructure and custom helpers contain arbitrary code, which makes things difficult from a security perspective.

I’ll submit these as feature requests.

3

Can you please describe your specific use case for indexOf? If it’s to render something if a string or array includes a value, we do have the #includes helper:

{{#includes sourceString valueToCheck}}
String includes value
{{else}}
String does not include value
{{/includes}}
4

Hi Brandon,

Thank you for reminding me on the “includes” conditional.

I am searching for solutions to cope with export-import naming issues.

In this case, I would like to append an environment postfix to experience group names and drop that postfix in the UI - unfortunately the default context of experiences only offers limited experience group properties (id, name and parent id) and no tags (which I could use to store a UI name instead of manipulating the name for display).

eg. some_name–DEV shall be some_name

{{#each experience.user.experienceGroups}}
  {{#includes (concat "--" globals.ENV) this.name}}  // could also be: {{#includes "--DEV" this.name}}
    {{this.name}}
  {{else}}
    // How to manipulate "this.name" in place?
  {{/includes}}
{{/each}}

could be:

{{#each experience.user.experienceGroups}}
  {{substring this.name (indexof "--" this.name)}}
  // or: {{replace (concat "--" globals.ENV) this.name}}
{{/each}}

or - if there would be a custom group tag eg. “uiName”:

{{#each experience.user.experienceGroups}}
  {{this.tags.uiName}} 
{{/each}}
5

For this specific use case, I would recommend looping over each of the user’s groups in a workflow and using the Group: Get Node to obtain the full group object. For example, if you place the results in a separate array at pageData.groupsFull, you could use your last example:

{{#each pageData.groupsFull}}
  {{this.groupTags.uiName}} 
{{/each}}
6

Unfortunately your proposed solution requires manually changing 80+ workflows in our app because the code above is part of an exp layout which is used on a lot of pages. I hoped to get around this effort by just modifying the text in the layout - but that seems not working using existing context, handlebars and SSR. I may implement the rendering on the client-side in Javascript but that has its own drawbacks…

Anyway, I really appreciate your support and look forward to any new features that come up on Losant.

7

JavaScript rendering would work well. You could register a simple web component that takes the group name through a data attribute and modifies it for display. The template would then look something like:

{{#each experience.user.experienceGroups}}
  <ExpGroup data-name="{{this.name}}" />
{{/each}}