{*
SPDX-FileCopyrightText: © 2021 Olivier Meunier <olivier@neokraft.net>

SPDX-License-Identifier: AGPL-3.0-only
*}
{{ extends "./base" }}
{{ import "/_libs/forms" }}
{{ import "/_libs/list"}}

{{ block title() }}{{ gettext("My API Tokens") }}{{ end }}

{{ block mainContent() }}
<h1 class="title text-h2">{{ yield title() }}</h1>

<div class="prose mb-4">
<p>{{ gettext(`An API Token is a key that grants you access to the Readeck API.`) }}</p>
<p>{{ gettext(`Please read the <a href="%s">API Documentation</a> if you plan to use it.`, urlFor("/docs/api"))|raw }}</p>
</div>


<form class="mb-4" action="{{ urlFor() }}" method="post">
  <p><button class="btn btn-primary" type="submit">{{ gettext("Create a new API token") }}</button></p>
</form>

{{ if len(.Tokens) > 0 }}
{{ include "/_libs/pagination" .Pagination }}

<turbo-frame id="token-list"
 data-controller="turbo-refresh"
 data-turbo-refresh-interval-value="10"
 data-turbo-refresh-on-value="[data-token-deleted='true']">
  {{ yield list() content }}
  {{ range .Tokens }}
    {{ yield list_item(class="flex gap-2 items-center hfw:bg-gray-100 max-md:block") content }}
      <a class="block flex-grow p-4" href="{{ urlFor(`.`, .ID ) }}">
        {{- if .IsEnabled -}}
          {{ yield icon(name="o-check-on", class="svgicon text-green-700") }}
        {{- else -}}
          {{ yield icon(name="o-cross", class="svgicon text-red-700") }}
        {{- end }}
        <strong class="link font-semibold" >{{ .ID }}</strong>
        · {{ .Application }}
        <small class="block">
          {{ gettext("Created on: %s", date(.Created, pgettext("datetime", "%e %B %Y"))) }}
          {{- if .Expires -}}
            <br>{{ gettext("Expires on: %s", date(.Expires, pgettext("datetime", "%e %B %Y"))) }}
            {{- if .IsExpired() }} · <strong class="font-semibold text-red-700">expired</strong>{{- end -}}
          {{- end -}}
          {{- if .LastUsed -}}
            <br><strong class="font-semibold">{{ gettext("Last used on: %s", date(.LastUsed, "%c")) }}</strong>
          {{- end -}}
        </small>
      </a>
      {{- if .IsDeleted -}}
        <div class="flex items-center max-w-xs m-4 max-md:mt-0"
          data-token-deleted="true">
          <span class="text-red-700 text-xs font-semibold">
            {{ gettext("This token will be removed in a few seconds.") }}
          </span>
          <form action="{{ urlFor(`.`, .ID, `delete`) }}" method="post">
            <input type="hidden" name="cancel" value="1" />
            <button type="submit"
            class="btn btn-primary whitespace-nowrap text-sm py-1 ml-2">{{ yield icon(name="o-undo") }} {{ gettext("Cancel") }}</button>
          </form>
        </div>
      {{- end -}}
    {{ end }}
  {{ end }}
  {{ end }}
</turbo-frame>

{{ include "/_libs/pagination" .Pagination }}
{{ end }}

{{ end }}