{# -*- coding: utf-8 -*-

  This file is part of Invenio.
  Copyright (C) 2016-2024 CERN.
  Copyright (C) 2024 Northwestern University.
  Copyright (C) 2025 Graz University of Technology.

  Invenio is free software; you can redistribute it and/or modify it
  under the terms of the MIT License; see LICENSE file for more details.
#}

{%- from "invenio_theme/macros/truncate.html" import truncate_text %}
{%- from "invenio_communities/details/macros/access-status-label.html" import access_status_label -%}

{% macro button_to_request_membership(community_ui) %}
  {% if permissions.can_request_membership %}
  {# TODO: Add relation_to_community for other flows #}
  <div
    id="request-membership-app"
    data-community='{{ community_ui | tojson }}'
    class="display-inline-block"
    >
  </div>
  {% endif %}
{% endmacro %}

{% macro community_title(community_ui) %}
  <div class="ui small header">
    <a href="{{ url_for('invenio_app_rdm_communities.communities_detail', pid_value=community_ui['slug']) }}" class="ui small header">
      {{ community_ui["metadata"]["title"] }}
    </a>
    <!-- Show the icon for subcommunities -->
    {% if community_ui['parent'] %}
      <p class="ml-2 mb-0 display-inline-block">
        <i class="green check circle outline icon"></i>
      </p>
    {% endif %}
  </div>
{% endmacro %}

<div
  class="ui container fluid page-subheader-outer with-submenu rel-pt-2 ml-0-mobile mr-0-mobile">
  <div class="ui container relaxed grid page-subheader mr-0-mobile ml-0-mobile">
    <div class="row pb-0">
      <div
        class="sixteen wide mobile sixteen wide tablet eleven wide computer column">
        <div
          class="community-header flex align-items-center column-mobile align-items-start-mobile">
          <div class="flex align-items-center">
            <div class="ui rounded image community-image mt-5 rel-mr-2">
              <img
                src="{{ community_ui['links']['logo'] | resolve_community_logo(community_ui['id']) }}"
                alt=""
                class="rel-mb-1"
              />
            </div>

            <div class="mobile only">
              {{community_title(community_ui)}}
            </div>
          </div>

          <div>
            <div class="flex align-items-center mb-5 tablet computer only">
              {{community_title(community_ui)}}
              {% if community_ui["access"]["visibility"] == 'restricted' %}
                <div class="rel-ml-1">
                  {{ access_status_label() }}
                </div>
              {% endif %}
            </div>

            <div>
              {% if community_ui["access"]["visibility"] == 'restricted' %}
                <div class="mobile only rel-mb-1">
                  {{ access_status_label() }}
                </div>
              {% endif %}
              {% if community_ui['parent'] %}
                <div class="inline-computer mt-5 rel-mr-1">
                  <span class="ui tiny header">Part of </span>
                  <a
                  href="{{ url_for('invenio_app_rdm_communities.communities_home', pid_value=community.parent.slug) }}">
                  {{community_ui["parent"]["metadata"]["title"]}}
                  </a>
                </div>
              {% endif %}

              {% if community_ui["metadata"]["website"] %}
                <div class="inline-computer mt-5 rel-mr-1">
                  <i class="linkify icon" aria-hidden="true"></i>
                  <a href="{{ community_ui["metadata"]["website"] }}">
                    {{ community_ui["metadata"]["website"] }}
                  </a>
                </div>
              {% endif %}

              {% if community_ui["metadata"]["type"] is defined %}
                <div class="inline-computer mt-5 rel-mr-1">
                  <i class="tag icon" aria-hidden="true"></i>
                  <span class="label label-keyword">
                    {{ community_ui["ui"]["type"]["title_l10n"] }}
                  </span>
                </div>
              {% endif %}

              {% if community_ui["metadata"]["organizations"] %}
                <div class="inline-computer" id="organizations-list" data-organizations='{{ community_ui["metadata"]["organizations"] | tojson }}'></div>
              {% endif %}
            </div>
          </div>
        </div>
      </div>
      <div
        class="sixteen wide mobile sixteen wide tablet five wide computer right aligned middle aligned column">
        {# Button to request membership is fully disabled until feature completely merged in v14. #}
        {# {{ button_to_request_membership(community) }} #}
        {%- if not community_use_jinja_header %}
          {%- if not permissions.can_submit_record %}
            <div class="ui icon inline-block" data-tooltip="{{_('Submission to this community is only allowed to community members.')}}">
              <i class="grey question circle outline icon mb-5"></i>
            </div>
          {% endif %}
          <a href="/uploads/new?community={{ community_ui['slug'] }}"
             class="ui positive button labeled icon rel-mt-1 theme-secondary {{ 'disabled' if not permissions.can_submit_record }}">
            <i class="upload icon" aria-hidden="true"></i>
            {{ _("New upload") }}
          </a>
        {% endif %}
        {% if permissions.can_moderate %}
          <a
            href="{{ url_for('administration.communities', q='slug:'+community_ui['slug']) }}"
            class="ui button labeled icon rel-mt-1">
            <i class="cog icon" aria-hidden="true"></i>
            {{ _("Manage community") }}
          </a>
        {% endif %}

      </div>

    </div>
    <div class="ui divider mobile only"></div>
    <div
      class="ui container secondary pointing stackable menu page-subheader pl-0 pr-0 theme-primary">
      {% if community_menu_active %}
        {% for item in current_menu.submenu('communities').children if (item.permissions == True or permissions[item.permissions]) and item.visible %}
          <a
            class="item {{ 'active' if active_community_header_menu_item == item.name }} {{ 'disabled' if not item.url }}"
            href="{{ item.url }}"
          >
            <i aria-hidden="true" class="{{ item.icon }} icon"></i>
            {{ item.text }}
          </a>
        {% endfor %}
      {% endif %}
    </div>
  </div>
</div>
