{#
  SPDX-FileCopyrightText: 2016-2020 CERN.
  SPDX-FileCopyrightText: 2023 Northwestern University.
  SPDX-FileCopyrightText: 2026-2026 TU Wien.
  SPDX-License-Identifier: MIT
#}

{#- base: invenio-communities v22.0.0 #}
{#- changes: relax condition for rendering "new community" button, move explainer, hide search bar stuff #}
{% extends "invenio_communities/base.html" %}
{% from "invenio_communities/macros/communities_carousel.html" import communities_carousel %}

{%- set title = _("Communities") -%}

{%- block javascript %}
  {{ super() }}
  {{ webpack['invenio-communities-frontpage.js'] }}
  {{ webpack['invenio-communities-frontpage-tuw.js'] }}
{%- endblock %}

{%- block page_body %}
<div id="communities-header" class="ui container fluid page-subheader-outer ml-0-mobile mr-0-mobile">
  <div class="ui container centered grid page-subheader rel-pt-1">
    <div class="centered one column row">
      <h1 class="ui header">{{_('Communities')}}</h1>
      <div class="header-text">
        <span>Organise, curate, and collaborate on records for your institution, project, topic, or event.</span>
        {%- if current_user.is_authenticated %}
        <div>
          <a href="{{ config.COMMUNITIES_ROUTES['new'] }}" class="ui icon left labeled positive button" role="button">
            <i class="icon plus"></i>
            {{_('New community')}}
          </a>
        </div>
        {%- endif %}
        </div>
    </div>
    {#- change: remove explainer text and search bar stuff -#}
    <div class="ui divider hidden"></div>
  </div>
</div>
{%- block top_banner %}
  {{ communities_carousel(showUploadBtn=False) }}
{%- endblock top_banner %}
<div class="ui container communities-frontpage rel-mt-3 rel-mb-2">
  {% if current_user.is_authenticated %}
    <div class="flex">
      <h2 class="ui header mb-0 align-self-center">{{_('My communities')}}</h2>
      <a class="align-self-center rel-ml-1 " href="{{url_for('invenio_app_rdm_users.communities')}}">
        {{ _('See all')}}
      </a>
    </div>
    <div class="ui divider hidden"></div>
    <div id="user-communities" class="rel-mb-2"></div>
  {% endif %}

  <div class="ui divider"></div>
  <div class="flex">
    <h2 class="ui header mb-0 align-self-center">{{ _('New communities') }}</h2>
    <a class="align-self-center rel-ml-1" href="{{url_for('invenio_communities.communities_search')}}">
      {{ _('See all')}}
    </a>
  </div>
  <div class="ui divider hidden"></div>
  <div id="new-communities" class="rel-mb-2"></div>

  {#- change: add "themed communities" section #}
  <div class="ui divider"></div>
  <div class="flex">
    <h2 class="ui header mb-0 align-self-center">{{ _('Themed communities') }}</h2>
    <a class="align-self-center rel-ml-1" href="{{url_for('invenio_communities.communities_search', q='theme:*')}}">
      {{ _('See all')}}
    </a>
  </div>
  <div class="ui divider hidden"></div>
  {%- trans sitename=config.THEME_SITENAME -%}
  <p>
    Themed communities allow individual communities on {{ sitename }} to have custom visual identities while preserving the overall repository brand.
    This feature is particularly useful for communities who want their presence to reflect their brand identity.
    Each themed community can:
    <ul class="rel-mb-2">
      <li>Customize visual styles</li>
      <li>Override layouts</li>
      <li>Have custom assets and pages</li>
    </ul>
  </p>
  {%- endtrans -%}
  <div id="themed-communities"></div>
</div>
{%- endblock page_body %}