{{define "title"}}{{end}}

{{define "body"}}
<div class="alert alert-info">
    Logged in as <strong>{{ .Login.MxId }}</strong>
</div>
<div class="d-flex">
  <a class="ml-auto btn btn-sm btn-dark" href="/logout">Log out</a>
</div>

{{ if .Accounts }}
  <table class="table mt-4">
    <thead>
      <tr>
        <th>Account name</th>
        <th>Protocol</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      {{range $i, $acc := .Accounts}}
        <tr>
          <td>{{ $acc.AccountName }}</td>
          <td>{{ $acc.Protocol }}</td>
          <td>
            <a class="btn btn-sm btn-primary" href="/edit/{{ $acc.AccountName }}">Modify</a>
            <a class="btn btn-sm btn-danger ml-4" href="/delete/{{ $acc.AccountName }}">Delete</a>
          </td>
        </tr>
      {{end}}
    </tbody>
  </table>
{{end}}

<h5 class="mt-4">Add account</h5>

<a class="btn btn-sm btn-dark mr-4" href="/add/IRC">IRC</a>
<a class="btn btn-sm btn-warning mr-4" href="/add/XMPP">XMPP</a>
<a class="btn btn-sm btn-info mr-4" href="/add/Mattermost">Mattermost</a>
<a class="btn btn-sm btn-primary mr-4" href="/add/Messenger">Facebook Messenger</a>

{{end}}