{% extends "tracker-fluid.html" %}
{% set view="tickets" %}

{% block content %}
<div class="container-fluid">
  <div class="row">
    <div class="col-lg-4 col-md-12">
      {% if tracker.description %}
      {{ tracker.description | md }}
      {% endif %}
      {% if TicketAccess.SUBMIT in access %}
      {% if current_user %}
      <h3 style="margin-top: 1rem">Submit ticket</h3>
      <form method="POST" action="{{
          url_for(".tracker_submit_POST",
            owner="~" + tracker.owner.username,
            name=tracker.name
          )
        }}">
        {{csrf_token()}}
        <div class="form-group">
          <label for="title">Title</label>
          <input
             type="text"
             dir="auto"
             class="form-control {{ valid.cls("title") }}"
             maxlength="2048"
             id="title"
             name="title"
             value="{{ title or "" }}"
             {% if another %}
             autofocus
             {% endif %}
             required />
          {{valid.summary("title")}}
        </div>
        <div class="form-group">
          <label for="description">Description</label>
          <textarea
            dir="auto"
            class="form-control {{ valid.cls("description") }}"
            id="description"
            name="description"
            placeholder="Markdown supported"
            maxlength="16384"
            rows="5">{{ description or "" }}</textarea>
          {{valid.summary("description")}}
        </div>
        <button
          type="submit"
          class="btn btn-primary"
        >
          Submit {{icon("caret-right")}}
        </button>
        <button type="submit" name="preview" class="btn btn-default">
          Preview {{icon("caret-right")}}
        </button>
        <label class="form-check-label" style="margin-left: 2rem">
          <input
            class="form-check-input"
            type="checkbox"
            name="another"
            style="position: relative; top: 2px;"
            {% if another %}
            checked
            {% endif %}> Submit another?
        </label>
      </form>

      {% if rendered_preview %}
      <div class="ticket-preview">
        <span class="preview-tag">Ticket preview</span>
        <h2>{{ title }}</h2>
        {{ rendered_preview }}
      </div>
      {% endif %}

      {% elif cfg("todo.sr.ht::mail", "posting-domain") %}
      <a
        class="btn btn-primary"
        href="{{get_origin("meta.sr.ht", external=True)}}/register"
      >Register here {{icon('caret-right')}}</a>
      or
      <a href="{{login_url}}">
        Log in {{icon('caret-right')}}
      </a>
      to submit tickets, or
      <a
        href="mailto:{{tracker.ref()}}@{{cfg("todo.sr.ht::mail", "posting-domain")}}"
      >submit via email</a>.
      {% endif %}
      {% else %}
      <hr />
      {% if current_user %}
      <p>You are not permitted to submit tickets for this tracker.</p>
      {% else %}
      <p>You need to <a href="{{ login_url }}">log in</a> to submit tickets.</p>
      {% endif %}
      {% endif %}

      <footer class="container text-center">
        <small class="text-muted" title="The resource ID for this bug tracker, used to identify it in the GraphQL API.">
          Tracker RID: {{to_rid(tracker.rid)}}
        </small>
      </footer>
    </div>
    <div class="col-md-12 col-lg-8">
      {% if tracker.import_in_progress %}
      <div class="alert alert-primary">
        An import operation is currently in progress.
      </div>
      {% endif %}
      {% if notice %}
      <div class="alert alert-success">
        {{ notice }}
      </div>
      {% endif %}
      {% if TicketAccess.BROWSE not in access and TicketAccess.SUBMIT in access %}
      <div class="alert alert-warning">
        You do not have permission to view tickets on this tracker unless you
        submitted them.
      </div>
      {% elif TicketAccess.BROWSE not in access and TicketAccess.SUBMIT not in access %}
      <div class="alert alert-warning">
        You do not have permission to view tickets on this tracker.
      </div>
      {% endif %}
      <form style="margin-bottom: 0.5rem">
        <label for="search" class="sr-only">Search tickets</label>
        <input
          name="search"
          type="text"
          dir="auto"
          placeholder="Search tickets...     status:closed     sort:created     label:label{{"     submitter:me" if current_user else ""}}"
          class="form-control{% if search_error %} is-invalid{% endif %}"
          {% if not another %}
          autofocus
          {% endif %}
          value="{{ search if search else "" }}" />
        {% if search_error %}
          <div class="invalid-feedback">{{ search_error }}</div>
        {% endif %}
      </form>
      {% if len(tickets) %}
      <div class="ticket-list">
        {% for ticket in tickets %}
        <div class="id">
          <a href="{{ ticket|ticket_url }}">#{{ticket.scoped_id}}</a>
        </div>
        <div class="title">
          <a href="{{ ticket|ticket_url }}">
            {{ ticket.title }}
          </a>
          <span class="pull-right">
            {% for label in ticket.labels %}
              {% if not search %}
                {{ label|label_badge(cls="small", terms="status:open") }}
              {% else %}
                {{ label|label_badge(cls="small", terms=search) }}
              {% endif %}
            {% endfor %}
          </span>
        </div>
        <div class="updated">{{ ticket.updated | date }}</div>
        <div class="submitter">
          <a href="{{ ticket.submitter|participant_url }}">
            {{ ticket.submitter.name }}
          </a>
        </div>
        <div class="comments" aria-label="Comments">
          <span class="icon_count">
            {{icon("comments-o")}}
            {{ ticket.comment_count }}
          </span>
          <span class="commentlabel">
            {{ "comment" if ticket.comment_count == 1 else "comments" }}
          </span>
        </div>
        {% endfor %}
      </div>
      {% else %}
      <div class="alert alert-info">No tickets found for this search criteria.</div>
      {% endif %}
      {{pagination()}}
    </div>
  </div>
</div>
{% endblock %}