{# @description A person's card for the people listing: photo, name with ORCID iD, affiliation and place, the roles on a credit when given one, and the portal roles they hold. #}
{# @prop contributor:text | description:"A Person, or a Contribution crediting one." #}
{# @prop class:text | description:"Extra CSS classes on the card." #}
{% load contributor_tags %}
<c-vars contributor class />
{% with c=contributor|as_contributor fallback=contributor.get_real_instance.primary_organization %}
  {% if c %}
    {% with roles=contributor.roles.all affiliation=contributor.affiliation|default:fallback portal_roles=c.portal_roles location=c.get_location_display %}
      <c-mvp.card.wrapper class="h-full py-5 {{ class }}">
        <figure class="px-6 pt-6">
          <c-contributor.avatar :contributor="c" size="xl" class="" />
        </figure>
        <div class="card-body items-center text-center">
          <h2 class="card-title"><c-contributor.name :contributor="c" class="" /></h2>
          {% if affiliation %}<p class="grow-0 flex justify-center max-w-full"><c-contributor.affiliation :organization="affiliation" class="" /></p>{% endif %}
          {% if location %}
            <p class="grow-0 text-sm text-base-content/70 flex items-center gap-1"><c-icon name="location" />{{ location }}</p>
          {% endif %}
          {% if roles %}
            <div class="flex flex-wrap justify-center gap-1">
              {% for role in roles %}<c-badge text="{{ role.display_label }}" size="sm" class="badge-soft" />{% endfor %}
            </div>
          {% endif %}
          {% if portal_roles %}
            <div class="card-actions justify-center mt-2">
              {% for role in portal_roles %}<c-badge text="{{ role }}" size="sm" variant="primary" />{% endfor %}
            </div>
          {% endif %}
        </div>
      </c-mvp.card.wrapper>
    {% endwith %}
  {% endif %}
{% endwith %}