notifications-admin/app/templates/views/templates/_template_list.html

{% from "components/checkboxes.html" import checkboxes %}

{% macro format_item_name(name, separators=True) -%}
  {%- if name is string -%}
    {{- name -}}
  {%- else -%}
    {%- for part in name -%}
      {{- format_item_name(part, separators) -}}
      {%- if not loop.last -%}
        {%- if separators %}
        <span class="message-name-separator"></span>{%- else %} {% endif -%}
      {% endif -%}
    {%- endfor -%}
  {% endif %}
{%- endmacro %}

{% if template_list.template_folder_id and not template_list.templates_to_show %}
<p class="template-list-empty">
  {% if template_list.folder_is_empty %}
  This folder is empty
  {% else %}
  There are no {{ 1|message_count_label(template_type, suffix='') }} templates in this folder
  {% endif %}
</p>
{% else %}
<nav id="template-list" aria-label="Template list">
  {% set checkboxes_data = [] %}

  {% if not current_user.has_permissions(ServicePermission.MANAGE_TEMPLATES) %}
  <ul>
    {% endif %}

    {% set label_content %}
    <span class="usa-sr-only">
      {%- for ancestor in item.ancestors %}{{ format_item_name(ancestor.name, separators=False) }} {% endfor -%}
      {{ format_item_name(item.name, separators=False) -}}
    </span>
    {% endset %}

    {% for item in template_list %}

    {% set item_link_content %}
      {% if item.is_folder %}
      <a href="{{ url_for('.choose_template', service_id=current_service.id, template_type=template_type, template_folder_id=item.id) }}"
        class="usa-link template-list-folder"
        tabindex="0"
        role="link"
        aria-label="{{ item.name }}">
        <span class="live-search-relevant">{{- format_item_name(item.name) -}}</span>
      </a>
      {% elif not item.ancestors %}
      <a href="{{ url_for('.view_template', service_id=current_service.id, template_id=item.id) }}"
        class="usa-link template-list-template"
        tabindex="0"
        role="link"
        aria-label="{{ item.name }}">
        <span class="live-search-relevant">
          {%- if current_service.api_keys -%}
          <span class="display-none">{{ item.id }} </span>
          {%- endif -%}
          {{- format_item_name(item.name) -}}
        </span>
      </a>
      {% endif %}
    {% endset %}

    {% set label_content %}
    <span class="usa-sr-only">
      {%- for ancestor in item.ancestors %}{{ format_item_name(ancestor.name, separators=False) }} {% endfor -%}
      {{ format_item_name(item.name, separators=False) -}}
    </span>
    {% endset %}

    {% set item_meta %}
    {% if not item.ancestors %}
    <span id="{{ item.id }}-item-hint" class="usa-hint usa-checkbox__label-description template-list-item-hint">
      {{ item.hint }}
    </span>
    {% endif %}
    {% endset %}

    {# create the item config now to include the label content -#}
    {# TODO: "attributes": { "aria-describedby": item.id ~ "-hint" } needs to be added but USWDS framework doesn't
    currently support this -#}
    {% set checkbox_config = {
    "html": label_content,
    "label": {
    "classes": "template-list-item-label margin-top-05",
    },
    "id": "templates-or-folder-" ~ item.id,
    "classes": "template-list-item template-list-item-with-checkbox {}".format(
    "template-list-item-hidden-by-default" if item.ancestors else "template-list-item-without-ancestors"),
    "attributes": { "role": "checkbox", "aria-describedby": item.id ~ "-item-hint" },

    "after": item_link_content ~ item_meta
    } %}
    {% set _ = checkboxes_data.append(checkbox_config) %}

    {% if not current_user.has_permissions(ServicePermission.MANAGE_TEMPLATES) %}
    <li
      class="template-list-item {%- if item.ancestors %} template-list-item-hidden-by-default {%- else %} template-list-item-without-ancestors{%- endif %}">
      {{ item_link_content }}
      <p class="template-list-item-hint">
        {{ item.hint }}
      </p>
    </li>
    {% endif %}
    {% endfor %}

    {% if not current_user.has_permissions(ServicePermission.MANAGE_TEMPLATES) %}
  </ul>
  {% endif %}

  {% if current_user.has_permissions(ServicePermission.MANAGE_TEMPLATES) %}
  {{ templates_and_folders_form.templates_and_folders(param_extensions={
  "items": checkboxes_data,
  "formGroup": False
  }) }}
  {% endif %}
</nav>
{% endif %}