{% extends "layout.html" %}

{% comment %}
Copyright (C) 2020  The Software Heritage developers
See the AUTHORS file at the top-level directory of this distribution
License: GNU Affero General Public License version 3, or any later version
See top-level LICENSE file for more information
{% endcomment %}

{% load render_bundle from webpack_loader %}
{% load swh_templatetags %}

{% block title %} User profile – Software Heritage {% endblock %}

{% block header %}
{% render_bundle 'auth' %}
{% endblock %}

{% block navbar-content %}
<h4>User profile</h4>
{% endblock %}

{% block content %}

<ul class="nav nav-tabs" style="padding-left: 5px;">
  <li class="nav-item">
    <a class="nav-link active" data-toggle="tab" id="swh-oidc-profile-account-tab" href="#swh-oidc-profile-account">Account</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" data-toggle="tab" id="swh-oidc-profile-tokens-tab" href="#swh-oidc-profile-tokens">API tokens</a>
  </li>
</ul>

<div class="tab-content">
  <div id="swh-oidc-profile-account" class="tab-pane active">
    <p class="mt-3">
      Below are the details of your user account.
      You can edit your personal information in the
      <a href="{{ keycloak.server_url }}realms/{{ keycloak.realm_name }}/account/">
        Software Heritage Account Management
      </a> interface.
    </p>
    <table class="table swh-table w-100 mt-3 border-top border-bottom">
    <tr>
      <th>Username</th>
      <td class="border-bottom">{{ user.username }}</td>
    </tr>
    <tr>
      <th>First name</th>
      <td class="border-bottom">{{ user.first_name }}</td>
    </tr>
    <tr>
      <th>Last name</th>
      <td class="border-bottom">{{ user.last_name }}</td>
    </tr>
    <tr>
      <th>Email</th>
      <td class="border-bottom">{{ user.email }}</td>
    </tr>
    <tr>
      <th>Permissions:</th>
      <td>
        {% for perm in user.get_all_permissions %}
          {{ perm }}<br/>
        {% endfor %}
      </td>
    </tr>
  </table>
  </div>

  <div id="swh-oidc-profile-tokens" class="tab-pane">
    <p class="mt-3">
      That interface enables to manage bearer tokens for Web API authentication.
      A token has to be sent in HTTP authorization headers to make authenticated API requests.
    </p>
    <p>
      For instance when using <code>curl</code> proceed as follows:
      <pre>curl -H "Authorization: Bearer ${TOKEN}" {{ site_base_url }}api/...</pre>
    </p>
    <p>
      Please not that a bearer token will automatically expire after 30 days of inactivity.
    </p>
    <div class="mt-3">
      <div class="float-right">
        <button class="btn btn-default" onclick="swh.auth.applyTokenAction('generate')">
          Generate new token
        </button>
        <button class="btn btn-default float-right" onclick="swh.auth.applyTokenAction('revokeAll')">
          Revoke all tokens
        </button>
      </div>
      <table id="swh-bearer-tokens-table" class="table swh-table swh-table-striped" width="100%">
        <thead>
          <tr>
            <th>Creation date</th>
            <th>Actions</th>
          </tr>
        </thead>
      </table>
    </div>
  </div>
</div>

<script>
  swh.auth.initProfilePage();
</script>

{% endblock content %}