vulnerability.html

{% extends 'base.html' -%}
{% set active_section = 'vulnerabilities' -%}

{% block extra_head %}
<link rel="preload" fetchpriority="high" as="image" href="/static/img/external-link.svg" type="image/webp">
{% endblock %}

{% block content -%}
<div class="vulnerability-page">
  <div class="mdc-layout-grid">
    <div class="mdc-layout-grid__inner">
      <div class="mdc-layout-grid__cell--span-12 vulnerability-title">
        <h1 class="title">
          {{ vulnerability.id }}
        </h1>
        {% if vulnerability.human_source_link and vulnerability.human_source_link.startswith("https://github.com/advisories/") -%}
          <a class="vulnerability-improvement-link" href="{{ vulnerability.human_source_link }}/improve" rel="nofollow">
            Suggest an improvement
          </a>
        {% elif vulnerability.human_source_link and not vulnerability.id.startswith("openSUSE-") -%}
          <div class="vulnerability-improvement-link">
          <a href="https://google.github.io/osv.dev/faq/#ive-found-something-wrong-with-the-data" target="_blank" rel="noopener noreferrer" title="Follow the Source link below and use its record feedback reporting mechanism">
            See a problem?
          </a>
          <br/>
          Please try reporting it <a href="{{ vulnerability.human_source_link}}" target="_blank" rel="nofollow noopener noreferrer">to the source</a> first.
        </div>
        {% else -%}
          <a class="vulnerability-improvement-link" href="https://google.github.io/osv.dev/faq/#ive-found-something-wrong-with-the-data" target="_blank" rel="noopener noreferrer">
            See a problem?
          </a>
        {% endif -%}
      </div>
      <div class="mdc-layout-grid__cell--span-12">
        <dl class="vulnerability-details">
          {%- if vulnerability.human_source_link and not vulnerability.id.startswith("openSUSE-") -%}
          <dt>Source</dt>
          <dd><a href="{{ vulnerability.human_source_link }}" target="_blank" rel="nofollow noopener noreferrer">{{
              vulnerability.human_source_link }}</a>
          </dd>
          {%- endif -%}
          <dt>Import Source</dt>
          <dd><a href="{{ vulnerability.source_link }}" target="_blank" rel="nofollow noopener noreferrer">{{
              vulnerability.source }}</a></dd>

          <dt>JSON Data</dt>
          <dd><a href="https://{{ api_url }}/v1/vulns/{{ vulnerability.id }}" target="_blank" rel="noopener noreferrer">
            https://{{ api_url }}/v1/vulns/{{ vulnerability.id }}</a>
          </dd>
          {% if vulnerability.aliases -%}
          <dt>Aliases</dt>
          <dd>
            <ul class="aliases">
              {% for alias in vulnerability.aliases -%}
              <li>
                {% if alias in vulnerability.known_ids -%}
                <a href="/vulnerability/{{ alias }}">{{ alias }}</a>
                {% else -%}
                {{ alias }}
                {% endif -%}
              </li>
              {% endfor -%}
            </ul>
          </dd>
          {% endif -%}
           {%- if vulnerability.upstream_hierarchy -%}
          <dt>Upstream</dt>
          <dd class="upstream expandible-hierarchy-list">{{ vulnerability.upstream_hierarchy | safe }}</dd>
          {%- endif -%}
          {%- if vulnerability.downstream_hierarchy -%}
          <dt>Downstream</dt>
          <dd class="downstream expandible-hierarchy-list">{{ vulnerability.downstream_hierarchy | safe }}</dd>
          {%- endif -%}
          {% if vulnerability.related -%}
          <dt>Related</dt>
          <dd>
            <ul class="aliases expandible-list">
              {% for related in vulnerability.related -%}
              <li>
                {% if related in vulnerability.known_ids -%}
                <a href="/vulnerability/{{ related }}">{{ related }}</a>
                {% else -%}
                {{ related }}
                {% endif -%}
              </li>
              {% endfor -%}
            </ul>
          </dd>
          {% endif -%}
          {%- if vulnerability.withdrawn -%}
          <dt class="withdrawn">
            Withdrawn
            <a href="https://ossf.github.io/osv-schema/#withdrawn-field" target="_blank" rel="noopener noreferrer"></a>
          </dt>
          <dd class="withdrawn">{{ vulnerability.withdrawn }}</dd>
          {% endif -%}
          <dt>Published</dt>
          <dd>{{ vulnerability.published }}</dd>
          <dt>Modified</dt>
          <dd>{{ vulnerability.modified }}</dd>
          {%- if vulnerability.severity -%}
          <dt>Severity</dt>
          <dd>
            <ul class="severity">
              {% for item in vulnerability.severity -%}
              <li>
                {% if item | is_cvss %}
                  <span class="severity-level severity-{{ item | severity_level }}">{{ item | display_severity_rating }}</span>
                  {{ item.type }} - {{ item.score }}
                  <a href="{{ item | cvss_calculator_url }}" target="_blank" rel="nofollow noopener noreferrer">
                    CVSS Calculator</a>
                {% else %}
                  <span class="severity-level severity-invalid">{{ item.type }} - {{ item.score }}</span>
                {% endif %}
              </li>
              {% endfor -%}
            </ul>
          </dd>
          {%- endif -%}
          <dt class="summary">Summary</dt>
          <dd class="summary {% if not vulnerability.summary %}muted{% endif %}">
            {% if vulnerability.summary %}
            {{ vulnerability.summary | literal_backticks }}
            {% else %}
            [none]
            {% endif %}
          </dd>
          <dt>Details</dt>
          <dd class="details">
            {{ vulnerability.details | markdown | safe -}}
          </dd>
          {% if vulnerability.database_specific -%}
          <dt>
            Database specific
            <a href="https://ossf.github.io/osv-schema/#database_specific-field" target="_blank"
              rel="noopener noreferrer"></a>
          </dt>
          <dd><pre class="specific">{{ vulnerability.database_specific | display_json }}</pre></dd>
          {% endif %}
          <dt>References</dt>
          <dd>
            <ul class="links">
              {% for reference in vulnerability.references -%}
              <li><a href="{{ reference.url }}" target="_blank" rel="nofollow noopener noreferrer">{{ reference.url }}</a></li>
              {% endfor -%}
            </ul>
          </dd>
          {% if vulnerability.credits -%}
          <dt class="credits">Credits</dt>
          <dd class="credits">
            <ul>
              {% for credit in vulnerability.credits -%}
              <li class="credit">
                <ul>
                  <li>{{ credit.name }}{% if 'type' in credit %} - {{ credit.type }}{% endif %}</li>
                  {%- if 'contact' in credit -%}
                  <li>
                    <ul class="contact">
                      {%- for item in credit.contact -%}
                      <li><a href="{{ item }}" target="_blank" rel="nofollow noopener noreferrer">{{ item }}</a></li>
                      {%- endfor -%}
                    </ul>
                  </li>
                  {%- endif -%}
                </ul>
              </li>
              {% endfor -%}
            </ul>
          </dd>
          {% endif %}
        </dl>
      </div>
    </div>
  </div>
  <div class="vulnerability-packages-container">
  <h2 class="title">Affected packages</h2>

  {% if vulnerability.affected|should_collapse %}
    {% set ecosystems = vulnerability.affected | group_by_ecosystem %}
  <div class="vulnerability-packages force-collapse">
    {% for ecosystem_name, packages in ecosystems.items() -%}
      {% set is_last_ecosystem = loop.last %}
      <details class="ecosystem-accordion">
        <summary class="package-header">
          <span class="vuln-ecosystem">{{ ecosystem_name }}</span>
        </summary>
        <div class="ecosystem-content-panel{% if is_last_ecosystem %} ecosystem-content-panel--last{% endif %}">
          {% for affected in packages -%}
            <details class="package-accordion{% if is_last_ecosystem and loop.last %} package-accordion--last{% endif %}">
              <summary class="package-name-title">
              {% if 'package' in affected %}
                {{ affected.package.name }}
              {% else %}
                {% set affected_repo = affected.ranges | default([], true) | selectattr('repo') | map(attribute='repo') | first %}
                {% if affected_repo %}
                  {{ affected_repo | strip_scheme }}
                {% endif %}
              {% endif %}
              </summary>
            <div class="package-details-card">
              <div class="mdc-layout-grid">
                {%- if 'package' in affected -%}
                <div class="vulnerability-package-subsection mdc-layout-grid__inner">
                  <h3 class="mdc-layout-grid__cell--span-3">Package</h3>
                  <div class="mdc-layout-grid__cell--span-9">
                    <dl>
                      <dt>Name</dt>
                      <dd>{{ affected.package.name }}</dd>
                      {%- if ecosystem_name | has_link_to_deps_dev -%}
                      <dd><a href="{{ affected.package.name | link_to_deps_dev(ecosystem_name) }}" target="_blank" rel="noopener noreferrer">View open source insights on deps.dev</a></dd>
                      {%- endif -%}
                      {%- if 'purl' in affected.package -%}
                      <dt>Purl</dt>
                      <dd class="purl">{{ affected.package.purl }}</dd>
                      {%- endif -%}
                    </dl>
                  </div>
                </div>
                {%- endif -%}
                {%- if 'severity' in affected -%}
                <div class="vulnerability-package-subsection mdc-layout-grid__inner">
                  <h3 class="mdc-layout-grid__cell--span-3">Severity</h3>
                  <div class="mdc-layout-grid__cell--span-9">
                    <ul class="severity">
                      {% for item in affected.severity -%}
                      <li>
                        {% if item | is_cvss %}
                          <span class="severity-level severity-{{ item | severity_level }}">{{ item | display_severity_rating }}</span>
                          {{ item.type }} - {{ item.score }}
                          <a href="{{ item | cvss_calculator_url }}" target="_blank" rel="nofollow noopener noreferrer">
                            CVSS Calculator</a>
                        {% else %}
                          <span class="severity-level severity-invalid">{{ item.type }} - {{ item.score }}</span>
                        {% endif %}
                      </li>
                      {% endfor -%}
                    </ul>
                  </div>
                </div>
                {%- endif -%}
                <div class="vulnerability-package-subsection affected-ranges-subsection mdc-layout-grid__inner">
                  <h3 class="mdc-layout-grid__cell--span-3">Affected ranges <a href="https://ossf.github.io/osv-schema/#examples" target="_blank" rel="noopener noreferrer"></a></h3>
                  <div class="mdc-layout-grid__cell--span-9">
                  {% for range in affected.ranges -%}
                    <dl>
                      <dt>Type</dt>
                      <dd>{{ range.type -}}</dd>
                      {%- if range.repo -%}
                      <dt>Repo</dt>
                      <dd>{{ range.repo }}</dd>
                      {%- endif -%}
                      <dt>Events</dt>
                      <dd>
                        <div class="mdc-layout-grid__inner events">
                          {% for event in range.events -%}
                            <div class="mdc-layout-grid__cell--span-3">{{ event | event_type -}}</div>
                            <div class="mdc-layout-grid__cell--span-9 version-value">
                              {% set link = event | event_link -%}
                              {% if link -%}
                                <a href="{{ link }}" rel="nofollow">{{ event | event_value -}}</a>
                              {% elif event | event_type == 'Introduced' and event | event_value == '0' -%}
                                <div class="tooltip">{{ event | event_value -}}
                                  {% if range.type == 'GIT' %}
                                    <span class="tooltiptext">Unknown introduced commit / All previous commits are affected</span>
                                  {% else -%}
                                    <span class="tooltiptext">Unknown introduced version / All previous versions are affected</span>
                                  {% endif -%}
                                </div>
                              {% else -%}
                                {{ event | event_value -}}
                              {% endif -%}
                            </div>
                          {% endfor -%}
                        </div>
                      </dd>
                      {%- if range.database_specific -%}
                      <dt>Database specific <a href="https://ossf.github.io/osv-schema/#affectedrangesdatabase_specific-field" target="_blank" rel="noopener noreferrer"></a></dt>
                      <dd><pre class="specific">{{ range.database_specific | display_json }}</pre></dd>
                      {%- endif -%}
                    </dl>
                  {% endfor -%}
                  </div>
                </div>
                {% if affected.versions -%}
                <div class="vulnerability-package-subsection mdc-layout-grid__inner">
                    <h3 class="mdc-layout-grid__cell--span-3">Affected versions <a href="https://ossf.github.io/osv-schema/#affectedversions-field" target="_blank" rel="noopener noreferrer"></a></h3>
                    <div class="mdc-layout-grid__cell--span-9 version-value">
                      {% for group, versions in (affected.versions|group_versions(ecosystem_name)).items() -%}
                      <details class="versions-section">
                        <summary class="version-header">{{ group }}</summary>
                        <div class="versions {% if not loop.last %}versions-separator{% endif %}">
                          {% for version in versions -%}
                          <div class="version">{{ version }}</div>
                          {% endfor -%}
                        </div>
                      </details>
                      {% endfor -%}
                    </div>
                </div>
                {% endif -%}
                {% if affected.ecosystem_specific -%}
                <div class="vulnerability-package-subsection mdc-layout-grid__inner">
                    <h3 class="mdc-layout-grid__cell--span-3">Ecosystem specific <a href="https://ossf.github.io/osv-schema/#affectedecosystem_specific-field" target="_blank" rel="noopener noreferrer"></a></h3>
                    <div class="mdc-layout-grid__cell--span-9"><pre class="specific">{{ affected.ecosystem_specific | display_json }}</pre></div>
                </div>
                {% endif -%}
                {% if affected.database_specific -%}
                <div class="vulnerability-package-subsection mdc-layout-grid__inner">
                    <h3 class="mdc-layout-grid__cell--span-3">Database specific <a href="https://ossf.github.io/osv-schema/#affecteddatabase_specific-field" target="_blank" rel="noopener noreferrer"></a></h3>
                    <div class="mdc-layout-grid__cell--span-9">
                      {% set db_specific = affected.database_specific %}
                      {% if db_specific is mapping %}
                      <div class="database-specific-list">
                        {% for key, value in db_specific.items() %}
                        <details class="database-specific-section">
                          <summary class="database-specific-header">{{ key }}</summary>
                          <div class="database-specific-content">
                            <pre class="specific">{{ value | display_json }}</pre>
                          </div>
                        </details>
                        {% endfor %}
                      </div>
                      {% else %}
                      <pre class="specific">{{ db_specific | display_json }}</pre>
                      {% endif %}
                    </div>
                </div>
                {% endif -%}
              </div>
            </div>
          </details>
        {% endfor -%}
        </div>
      </details>
    {% endfor -%}
  </div>

  {% else %}
    <osv-tabs
      class="vulnerability-packages">
      {% for affected in vulnerability.affected -%}
      {% if 'package' in affected %}
      {% set ecosystem = affected.package.ecosystem %}
      {% set package = affected.package.name %}
      {% else %}
      {% set ecosystem = 'Git' %}
      {% set affected_repo = affected.ranges | default([], true) | selectattr('repo') | map(attribute='repo') | first %}
      {% if affected_repo %}
      {% set package = affected_repo | strip_scheme %}
      {% endif %}
      {% endif %}
      <h2 class="package-header">
        <span class="vuln-ecosystem">{{ ecosystem }}</span>
        <span class="vuln-title-divider">/</span>
        <span class="vuln-name">{{ package }}</span>
      </h2>
      <div class="mdc-layout-grid">
        {%- if 'package' in affected -%}
        <div class="vulnerability-package-subsection mdc-layout-grid__inner">
          <h3 class="mdc-layout-grid__cell--span-3">
            Package
          </h3>
          <div class="mdc-layout-grid__cell--span-9">
            <dl>
              <dt>Name</dt>
              {%- if affected.package | package_in_ecosystem -%}
              <dd><a href="{{ affected.package | package_in_ecosystem }}" target="_blank" rel="nofollow noopener noreferrer">{{
                  affected.package.name }}</a></dd>
              {%- else -%}
              <dd>{{ affected.package.name }}</dd>
              {%- endif -%}
              {%- if ecosystem | has_link_to_deps_dev -%}
              <dd><a href="{{ package | link_to_deps_dev(ecosystem) }}" target="_blank" rel="noopener noreferrer">
                View open source insights on deps.dev</a></dd>
              {%- endif -%}
              {%- if 'purl' in affected.package -%}
              <dt>Purl</dt>
              <dd class="purl">{{ affected.package.purl }}</dd>
              {%- endif -%}
            </dl>
          </div>
        </div>
        {%- endif -%}
        {%- if 'severity' in affected -%}
        <div class="vulnerability-package-subsection mdc-layout-grid__inner">
          <h3 class="mdc-layout-grid__cell--span-3">
            Severity
          </h3>
          <div class="mdc-layout-grid__cell--span-9">
            <ul class="severity">
              {% for item in affected.severity -%}
              <li>
                {% if item | is_cvss %}
                  <span class="severity-level severity-{{ item | severity_level }}">{{ item | display_severity_rating }}</span>
                  {{ item.type }} - {{ item.score }}
                  <a href="{{ item | cvss_calculator_url }}" target="_blank" rel="nofollow noopener noreferrer">
                    CVSS Calculator</a>
                {% else %}
                  <span class="severity-level severity-invalid">{{ item.type }} - {{ item.score }}</span>
                {% endif %}
              </li>
              {% endfor -%}
            </ul>
          </div>
        </div>
        {%- endif -%}
        <div class="vulnerability-package-subsection mdc-layout-grid__inner">
          <h3 class="mdc-layout-grid__cell--span-3">
            Affected ranges
            <a href="https://ossf.github.io/osv-schema/#examples" target="_blank" rel="noopener noreferrer"></a>
          </h3>
          <div class="mdc-layout-grid__cell--span-9">
          {% for range in affected.ranges -%}
            <dl>
              <dt>Type</dt>
              <dd>{{ range.type -}}</dd>

              {%- if range.repo -%}
              <dt>Repo</dt>
              <dd>{{ range.repo }}</dd>
              {%- endif -%}

              <dt>Events</dt>
              <dd>
                <div class="mdc-layout-grid__inner events">
                  {% for event in range.events -%}
                    <div class="mdc-layout-grid__cell--span-3">
                      {{ event | event_type -}}
                    </div>
                    <div class="mdc-layout-grid__cell--span-9 version-value">
                      {% set link = event | event_link -%}
                      {% if link -%}
                        <a href="{{ link }}" rel="nofollow">
                          {{ event | event_value -}}
                        </a>
                      {% elif event | event_type == 'Introduced' and event | event_value == '0' -%}
                        <div class="tooltip">
                          {{ event | event_value -}}
                          {% if range.type == 'GIT' %}
                            <span class="tooltiptext">Unknown introduced commit / All previous commits are affected</span>
                          {% else -%}
                            <span class="tooltiptext">Unknown introduced version / All previous versions are affected</span>
                          {% endif -%}
                        </div>
                      {% else -%}
                        {{ event | event_value -}}
                      {% endif -%}
                    </div>
                  {% endfor -%}
                </div>
              </dd>

              {%- if range.database_specific -%}
              <dt>
                Database specific
                <a href="https://ossf.github.io/osv-schema/#affectedrangesdatabase_specific-field" target="_blank"
                  rel="noopener noreferrer"></a>
              </dt>
              <dd><pre class="specific">{{ range.database_specific | display_json }}</pre></dd>
              {%- endif -%}
            </dl>
          {% endfor -%}
          </div>
        </div>
        {% if affected.versions -%}
        <div class="vulnerability-package-subsection mdc-layout-grid__inner">
          <h3 class="mdc-layout-grid__cell--span-3">
            Affected versions
            <a href="https://ossf.github.io/osv-schema/#affectedversions-field" target="_blank"
              rel="noopener noreferrer"></a>
          </h3>
          <div class="mdc-layout-grid__cell--span-9 version-value">
            {% for group, versions in (affected.versions|group_versions(ecosystem)).items() -%}
            <details class="versions-section">
              <summary class="version-header">{{ group }}</summary>
              <div class="versions {% if not loop.last %}versions-separator{% endif %}">
                {% for version in versions -%}
                <div class="version">{{ version }}</div>
                {% endfor -%}
              </div>
            </details>
            {% endfor -%}
          </div>
        </div>
        {% endif -%}
        {% if affected.ecosystem_specific -%}
        <div class="vulnerability-package-subsection mdc-layout-grid__inner">
          <h3 class="mdc-layout-grid__cell--span-3">
            Ecosystem specific
            <a href="https://ossf.github.io/osv-schema/#affectedecosystem_specific-field" target="_blank"
              rel="noopener noreferrer"></a>
          </h3>
          <div class="mdc-layout-grid__cell--span-9">
            <pre class="specific">{{ affected.ecosystem_specific | display_json }}</pre>
          </div>
        </div>
        {% endif -%}
        {% if affected.database_specific -%}
        <div class="vulnerability-package-subsection mdc-layout-grid__inner">
          <h3 class="mdc-layout-grid__cell--span-3">
            Database specific
            <a href="https://ossf.github.io/osv-schema/#affecteddatabase_specific-field" target="_blank"
              rel="noopener noreferrer"></a>
          </h3>
          <div class="mdc-layout-grid__cell--span-9">
            {% set db_specific = affected.database_specific %}
            {% if db_specific is mapping %}
            <div class="database-specific-list">
              {% for key, value in db_specific.items() %}
              <details class="database-specific-section">
                <summary class="database-specific-header">{{ key }}</summary>
                <div class="database-specific-content">
                  <pre class="specific">{{ value | display_json }}</pre>
                </div>
              </details>
              {% endfor %}
            </div>
            {% else %}
            <pre class="specific">{{ db_specific | display_json }}</pre>
            {% endif %}
          </div>
        </div>
        {% endif -%}
      </div>
      {% endfor -%}
    </osv-tabs>
  {% endif %}
</div>
</div>
<turbo-stream action="update" target="title">
  <template>
    {{ vulnerability.id }} - OSV
  </template>
</turbo-stream>

<script>
  document.addEventListener('turbo:load', function() {
    const ECOSYSTEM_EXPAND_THRESHOLD = 10;
    const PACKAGE_EXPAND_THRESHOLD = 7;
    const ECOSYSTEM_PACKAGE_COLLAPSE_THRESHOLD = 9;

  /**
   * Sets up the vertical, grouped layout for vulnerability packages.
   * - All ecosystem headers are expanded if their total count is below `ECOSYSTEM_EXPAND_THRESHOLD`,
   *   and if their total packages count is below `ECOSYSTEM_PACKAGE_COLLAPSE_THRESHOLD`.
   * - Within each ecosystem, all package headers are expanded if their count is below `PACKAGE_EXPAND_THRESHOLD`.
   */
    function setupVerticalLayout() {
      const ecosystemAccordions = document.querySelectorAll('.vulnerability-packages.force-collapse .ecosystem-accordion');
      if (!ecosystemAccordions.length) return;

      const shouldExpandEcosystems = ecosystemAccordions.length < ECOSYSTEM_EXPAND_THRESHOLD;

      ecosystemAccordions.forEach(accordion => {
        const panel = accordion.querySelector('.ecosystem-content-panel');
        const packageAccordions = panel ? panel.querySelectorAll('.package-accordion') : [];
        const hasManyPackages =
          ecosystemAccordions.length > 1 && packageAccordions.length > ECOSYSTEM_PACKAGE_COLLAPSE_THRESHOLD;

        const shouldExpandAccordion =
          shouldExpandEcosystems &&
          panel !== null &&
          !hasManyPackages;

        accordion.open = shouldExpandAccordion;

        const shouldExpandPackages = packageAccordions.length <= PACKAGE_EXPAND_THRESHOLD;
        packageAccordions.forEach(packageAccordion => {
          packageAccordion.open = shouldExpandPackages;
        });
      });
    }
    
    if (document.querySelector('.vulnerability-packages.force-collapse')) {
      setupVerticalLayout();
    }

    /**
     * Sets up "Show More" / "Show Less" functionality for lists that might have
     * many items. You can enable this feature by adding an 'expandible-list' or
     * 'expandible-hierarchy-list' class to lists with long value.
     * @param {string} listSelector The CSS selector for the list container.
     * @param {string} itemSelector The tag name of the items within the list.
     */
    function setupExpandibleList(listSelector, itemSelector) {
      const EXPANDIBLE_LIST_DEFAULT_LENGTH = 6;
      const lists = document.querySelectorAll(`${listSelector}:not(.expanded):not([data-has-toggle-btn])`);
      lists.forEach((list) => {
        const items = list.getElementsByTagName(itemSelector);
        if (items.length <= EXPANDIBLE_LIST_DEFAULT_LENGTH) return;

        const expandibleItems = [...items].slice(EXPANDIBLE_LIST_DEFAULT_LENGTH);
        expandibleItems.forEach((item) => {
          item.style.display = 'none';
        });

        const toggleButton = document.createElement('span');
        toggleButton.classList.add('showmore');
        toggleButton.textContent = 'Show More';
        list.append(toggleButton);
        list.setAttribute('data-has-toggle-btn', 'true');

        toggleButton.addEventListener('click', function() {
          const isExpanded = list.classList.contains('expanded');
          expandibleItems.forEach((item) => {
            item.style.display = isExpanded ? 'none' : 'block';
          });
          toggleButton.textContent = isExpanded ? 'Show More' : 'Show Less';
          list.classList.toggle('expanded');
        });
      });
    }

    setupExpandibleList('.expandible-hierarchy-list', 'ul');
    setupExpandibleList('.expandible-list', 'li');
  });
</script>
{% endblock -%}