{#
  Copyright (C) 2020-2025 Graz University of Technology.

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

{%- extends config.INVENIO_THEME_TUGRAZ_BASE_TEMPLATE %}

{%- set active_dashboard_menu_item = "overview" %}
{%- set title = _("Overview") %}

{% block javascript %}
  {{ super() }}
  {{ webpack['invenio-theme-tugraz-unlock.js'] }}
{% endblock javascript %}

{%- block page_body %}
  {%- block user_dashboard_header %}
    {% include "invenio_app_rdm/users/header.html" %}
  {%- endblock user_dashboard_header %}

  <div class="ui container rel-mt-2">
    <div class="ui five column stackable grid overview">
      {% if is_tugraz_authenticated %}
      {# 3 columns: Research-Uploads, Communities, and Requests #}
      <div class="column">
        <div class="ui fluid card" style="height: 510px; max-width: 300px;">
          <div class="content">
            <h2 class="ui header">{{ _("Research Results") }}</h2>
            <a href="/me/uploads">
              <div class="ui centered grid" style="padding-top: 54px; padding-bottom: 54px;">
                <div class="ten wide column">
                  <div class="ui fluid image">
                    <img alt="{{ _('Research Results') }}" src="{{ url_for('static', filename='images/diamond.svg') }}">
                  </div>
                </div>
              </div>
            </a>
            <div class="description" style="margin-top: 14px">
              {{ _("Overview: Description for research results") }}
            </div>
          </div>
          <div class="extra content">
            <a class="ui fluid button" href="/me/uploads">
              {{ _("Go to Research Results") }}
            </a>
          </div>
        </div>
      </div>

      <div class="column">
        <div class="ui fluid card" style="height: 510px; max-width: 300px;">
          <div class="content">
            <h2 class="ui header">{{ _("Communities") }}</h2>
            <a href="/me/communities">
              <div class="ui centered grid" style="padding-top: 54px; padding-bottom: 54px;">
                <div class="ten wide column">
                  <div class="ui fluid image">
                    <img alt="{{ _('Communities') }}" src="{{ url_for('static', filename='images/group-discussion.svg') }}">
                  </div>
                </div>
              </div>
            </a>
            <div class="description" style="margin-top: 14px">
              {{ _("Overview: Description of Communities") }}
            </div>
          </div>
          <div class="extra content">
            <a class="ui fluid button" href="/me/communities">
              {{ _("Go to Communities") }}
            </a>
          </div>
        </div>
      </div>

      <div class="column">
        <div class="ui fluid card" style="height: 510px; max-width: 300px;">
          <div class="content">
            <h2 class="ui header">{{ _("Requests") }}</h2>
            <a href="/me/requests">
              <div class="ui centered grid" style="padding-top: 54px; padding-bottom: 54px;">
                <div class="ten wide column">
                  <div class="ui fluid image">
                    <img alt="{{ _('Requests') }}" src="{{ url_for('static', filename='images/umbrella.svg') }}">
                  </div>
                </div>
              </div>
            </a>
            <div class="description" style="margin-top: 14px">
              {{ _("Overview: Description of Requests") }}
            </div>
          </div>
          <div class="extra content">
            <a class="ui fluid button" href="/me/requests">
              {{ _("Go to Requests") }}
            </a>
          </div>
        </div>
      </div>

      {% else %}  {# not is_tugraz_authenticated #}
      {# 1 column: Research-Uploads, with info on how to get authenticated #}
      <div class="column">
        <div class="ui fluid card" style="height: 510px; max-width: 300px;">
          <div class="content">
            <h2 class="ui header">{{ _("Research Results") }}</h2>
            <a href="/me/uploads">
              <div class="ui centered grid" style="padding-top: 54px; padding-bottom: 54px;">
                <div class="ten wide column">
                  <div class="ui fluid image">
                    <img alt="{{ _('Research Results') }}" src="{{ url_for('static', filename='images/diamond.svg') }}">
                  </div>
                </div>
              </div>
            </a>
            <div class="description" style="margin-top: 14px">
              {{ _("Overview: Description for research results when not authenticated") }}
            </div>
          </div>
          <div class="extra content">
            <a class="ui fluid button" href="/me/uploads">
              {{ _("Go to Research Results") }}
            </a>
          </div>
        </div>
      </div>
      {% endif %}

      {% if can_view_marc21 %}
      <div class="column">
        <div class="ui fluid card" style="height: 510px; max-width: 300px;">
          <div class="content">
            <h2 class="ui header">{{ _("Publications") }}</h2>
            <a href="/publications/uploads">
              <div class="ui centered grid" style="padding-top: 54px; padding-bottom: 54px;">
                <div class="ten wide column">
                  <div class="ui fluid image">
                    <img alt="{{ _('Publications') }}" src="{{ url_for('static', filename='images/library-book-svgrepo-com.svg') }}">
                  </div>
                </div>
              </div>
            </a>
            <div class="description" style="margin-top: 14px">
              {{ _("Overview: Description for publications") }}
            </div>
          </div>
          <div class="extra content">
            <a class="ui fluid button" href="/publications/uploads">
              {{ _("Go to Publications") }}
            </a>
          </div>
        </div>
      </div>
      {% endif %}

      {# OER column - always shown #}
      <div class="column">
        <div class="ui fluid card" style="height: 510px; max-width: 300px;">
          <div class="content">
            <h2 class="ui header">{{ _("Educational Resources") }}</h2>
            <a href="/oer/uploads">
              <div class="ui centered grid" style="padding-top: 54px; padding-bottom: 54px;">
                <div class="ten wide column">
                  <div class="ui fluid image">
                    <img alt="{{ _('Educational Resources') }}" src="{{ url_for('static', filename='images/play.svg') }}">
                  </div>
                </div>
              </div>
            </a>
            <div class="description" style="margin-top: 14px">
              {{ _("Overview: Description for open educational resources") }}
            </div>
          </div>
          <div class="extra content">
            <a class="ui fluid button" href="/oer/uploads">
              {{ _("Go to Educational Resources") }}
            </a>
          </div>
        </div>
      </div>

    </div>
  </div>

  {# spacing to footer #}
  <div style="margin-top: 54px;"></div>

{%- endblock %}