{% extends "layout.html" %}
{% block headers %}
<script src="/static/js/jquery-3.6.0.min.js"></script>
<script src="/static/js/quill.min.js"></script>
<script src="/static/js/utils.js?cache=1744290797"></script>
<script src="/static/js/depositor-dashboard.js?cache=1739977731"></script>
<link href="/static/css/quill.4tu.css" rel="stylesheet">
<style nonce="{{nonce}}">
#session-table tbody tr td:nth-child(2) { white-space: nowrap; }
#create-new-dataset { margin: auto; }
#create-new-collection { margin: auto; }
#storage-request-wrapper { display: none; }
#content-wrapper input[type="text"],
#content-wrapper input[type="datetime-local"],
#content-wrapper input[type="date"],
#content-wrapper textarea,
.texteditor,
#content-wrapper .options-wrapper, #groups-wrapper, #access-wrapper, #geolocation-wrapper {
    display: block;
    padding: .7em;
    border: solid 1pt #aaa;
    border-radius: 0em .5em .5em .5em;
    width: 832pt;
    margin-top: 0em;
    margin-bottom: 1em;
    font-size: 13pt;
}
.texteditor {
    padding: 0em !important;
    border-radius: 0em 0em .5em .5em !important;
    resize: vertical;
    font-size: 1.0em;
    width: 852pt;
    background: #fff;
}
#content-wrapper label {
    display: inline-block;
    background: #ffeeaa;
    color: #000;
    padding: .5em .5em .25em .5em;
    border-radius: .5em .5em 0em 0em;
    border-top: solid 1pt #d4aa00;
    border-right: solid 1pt #d4aa00;
    border-left: solid 1pt #d4aa00;
    font-weight: bold;
}
.quota-requested {
    background: #ffeeaa;
    border: solid 1pt #d4aa00;
    padding: .25em;
    border-radius: .25em;
    user-select: none;
    margin-right: .25em;
}
.storage-usage { margin-right: .25em; }
</style>
<script nonce="{{nonce}}">
jQuery(document).ready(function (){
    install_touchable_help_icons();
});
</script>
{% endblock %}
{% block submenu %}
<ul>
  <li class="active corporate-identity-submenu-active">My Dashboard
  <li class="create-button"><a href="/my/sessions/new">Create API token</a>
  <li><a href="/my/datasets">My Datasets</a>
  <li><a href="/my/collections">My Collections</a>
  {%- if can_use_igsn %}
  <li><a href="/my/physical-samples">My physical samples</a>
  {%- endif %}
</ul>
{% endblock %}
{% block body %}
<h1>Dashboard</h1>
{%- if may_deposit %}
<h2>Quick actions</h2>
<div class="center">
  <a id="create-new-dataset" href="/my/datasets/new" class="button corporate-identity-standard-button">Add new dataset</a>
  <a id="create-new-collection" href="/my/collections/new" class="button corporate-identity-standard-button">Create new collection</a>
  {%- if can_use_igsn %}
  <a id="register-physical-sample" href="/my/physical-samples/new" class="button corporate-identity-standard-button">Register physical sample</a>
  {%- endif %}
</div>
{%- endif %}
<h2>Storage usage</h2>
<p><span class="storage-usage">Using {{storage_used}} of {{quota}} ({{percentage_used}}%).</span>{% if requested_quota %}<span class="quota-requested">Request pending for {{requested_quota}}</span>{% endif %}<a class="inline-button open" id="request-more-storage" href="#">Request more storage</a></p>
<div id="storage-request-wrapper">
  <label for="new-quota">New quota</label><div class="fas fa-question-circle help-icon"><span class="help-text">For example, if your current quota is 50GB and you'd like 20GB more, request 70GB.</span></div>
  <input type="text" id="new-quota" name="new-quota" placeholder="New quota in gigabytes (for example: 50)." />
  <label for="quota-reason">Reason</label>
  <div id="quota-reason" class="texteditor"></div>
  <p>Your request will be reviewed by our team (usually within one working day) and you will be contacted by e-mail about its status.</p>
  <div class="center">
    <div id="submit-storage-request" class="button corporate-identity-standard-button">Send request for more storage</div>
  </div>
</div>
<h2>Sessions and API tokens</h2>

<table id="session-table" class="corporate-identity-table">
  <thead><tr><th>Name</th><th>Created at</th><th>Actions</th></tr></thead>
  <tbody>
    {%- for session in sessions: %}
    <tr>
      <td>{% if session.editable %}
        <a href="/my/sessions/{{session.uuid}}/edit">{{session.name | default("Unnamed", False)}}</a>
        {% else %}
        {{session.name | default("Unnamed", False)}}{%- if session_token == session.token %} <span class="active-badge">Current session</span>{% endif %}
        {% endif %}
      </td>
      <td>{{session.created_date | default("Unknown", False)}}</td>
      <td>{%- if session_token != session.token %}<a href="/my/sessions/{{session.uuid}}/delete" class="fas fa-trash-can" title="Remove"></a>{% endif %}</td>
    </tr>
    {%- endfor %}
  </tbody>
</table>

<div class="notice-box">
<h3>API documentation</h3>
<p>Every endpoint of the <code>v2</code> and <code>v3</code> APIs is described in
  the <a href="{{base_url}}/api/docs" target="_blank" rel="noopener noreferrer"
  title="opens in new window">OpenAPI documentation</a>, where you can browse the
  requests, their parameters and their responses at <code>{{base_url}}/api/docs</code>.</p>
<ul>
  <li>The <strong>Base URL</strong> for this repository is <code>{{base_url}}</code>,
    so a <code>v2</code> request goes to <code>{{base_url}}/v2</code>.</li>
  <li>Requests are authenticated with an API token. Use the token created above,
    or <a href="/my/sessions/new">generate a new one</a>.</li>
  <li>Numerical identifiers (<code>id</code>) properties are deprecated for
    newly created datasets/collections and superseded by the <code>uuid</code> property.</li>
</ul>
</div>
{% endblock %}