<div>
  @if (account) {
    <h2 id="session-page-heading" jhiTranslate="sessions.title" [translateValues]="{ username: account.login }">
      Sessões ativas para [<strong>{{ account.login }}</strong
      >]
    </h2>
  }

  @if (success) {
    <div class="alert alert-success" jhiTranslate="sessions.messages.success"><strong>Sessão terminada com sucesso!</strong></div>
  }

  @if (error) {
    <div class="alert alert-danger" jhiTranslate="sessions.messages.error">
      <strong>Ocorreu um erro!</strong> A sessão não pode ser terminada.
    </div>
  }

  <div class="table-responsive">
    <table class="table table-striped" aria-describedby="session-page-heading">
      <thead>
        <tr>
          <th scope="col" jhiTranslate="sessions.table.ipaddress">IP</th>
          <th scope="col" jhiTranslate="sessions.table.useragent">Agente</th>
          <th scope="col" jhiTranslate="sessions.table.date">Data</th>
          <th scope="col"></th>
        </tr>
      </thead>
      <tbody>
        @for (session of sessions; track $index) {
          <tr>
            <td>{{ session.ipAddress }}</td>
            <td>{{ session.userAgent }}</td>
            <td>{{ session.tokenDate | date: 'longDate' }}</td>
            <td>
              <button type="submit" class="btn btn-primary" (click)="invalidate(session.series)" jhiTranslate="sessions.table.button">
                Terminar sessão
              </button>
            </td>
          </tr>
        }
      </tbody>
    </table>
  </div>
</div>
