Generates a list of site links with icon

_sites.twig

{# Generates a list of site links with icon

Basic Example:
{% embed 'partials/_sites.twig' %}{% endembed %}

Advanced Example:
{% embed 'partials/_sites.twig' %}
   {% block sites %}
      {% if languages is defined and languages is not empty %}
         <ul class="rounded-2xl border divide-y divide-gray-200 py-2">
            {% for lang in languages|filter(l => l.available) %}
               <li class="mx-6 py-0.5">
                  <a href="{{ lang.url }}" class="btn btn-link py-6 {{ lang.isCurrent ? 'font-medium' }}">
                     {{ svg('@webroot/assets/languages/' ~ lang.languageCode ~ '.svg')|attr({ class: 'h-6 w-6 rounded-full mr-2' }) }}
                     {{ lang.name }}
                  </a>
               </li>
            {% endfor %}
         </ul>
      {% endif %}
   {% endblock %}
{% endembed %}
#}

{% set currentLanguage = {} %}
{% set languages = [] %}
{% set sortedSites = craft.app.sites.getAllSites()|sort((a, b) => a.group <=> b.group) %}

{% for site in sortedSites %}
   {# Only use the first part of "en_US" #}
   {% set languageCode = site.language|split('-')|first %}
   
   {# Get the display names #}
   {% set locale = craft.app.i18n.getLocaleById(languageCode) %}

   {# Get other entry #}
   {% set siteEntry = null %}

   {% if entry is defined and entry %}
      {% set siteEntry = craft.entries.id(entry.id).site(site).one() %}
   {% endif %}
   
   {# Get the url #}
   {% set url = site.getBaseUrl() %}
   
   {# Get the url #}
   {% if siteEntry != null %}
      {% set url = siteEntry.getUrl() %}
   {% endif %}
   
   {# Store it in some data structure #}
   {% set language = {
      name : locale.displayName,
      url : url|default('/'),
      site : site,
      languageCode : languageCode,
      available : siteEntry != null,
      isCurrent : site.id == currentSite.id,
      group: site.group,
   } %}
   
   {# Set the current site #}
   {% if site.id == currentSite.id %}
      {% set currentLanguage = language %}
   {% endif %}

   {# Add it to the list #}
   {% set languages = languages|merge([language]) %}
{% endfor %}

{% block sites %}
   {# Basic implementation, override with your own #}
   {% if languages is defined and languages is not empty %}
      <ul>
         {% for lang in languages|filter(l => l.available) %}
            <li>
               <a href="{{ lang.url }}" class="{{ lang.isCurrent ? 'current' }}">
                  {{ svg('@webroot/assets/languages/' ~ lang.languageCode ~ '.svg') }}
                  {{ lang.name }}
               </a>
            </li>
         {% endfor %}
      </ul>
   {% endif %}
{% endblock %}