<ul class="sidebar-widget" id="category-module">
  <div class="title">{{ heading_title }}</div>
  {% for key, category in categories %}
  <li class="panel {{ category.category_id == category_id ? 'active' : '' }}">
    <a href="{{ category.href }}" class="category-href">{{ category.name }}</a>
    {% if category.children %}
      <a class="toggle-icon" data-toggle="collapse" data-parent="#category-module" href="#category-module-{{ key }}"><i class="fa fa-angle-down" aria-hidden="true"></i></a>
      <ul id="category-module-{{ key }}" class="panel-collapse collapse {{ category.category_id == category_id ? 'in' : '' }}  ">
        {% for child in category.children %}
        <li class="{{ child.category_id == child_id ? 'active' : '' }}"><a href="{{ child.href }}">{{ child.name }}</a></li>
        {% endfor %}
      </ul>
    {% endif %}
  </li>
  {% endfor %}
</ul>
