{% import "macros/status.html" as status_macros  %}

{% if search_results %}
  <div class="search-results">
    <h4 class="search-header">Search Results</h4>
    <table class="ui table">
      <thead class="head">
        <tr>
          <th class="four wide column">Name</th>
          <th class="six wide column">Email</th>
          <th class="two wide column">Account Status</th>
        </tr>
      </thead>
      <tbody>
        {% for account in search_results %}
          <tr class="row body">
            <td class="four wide column account-name"><a href="{{ url_for('.show', account_id=account.id) }}">{{ account.name }}</a></td>
            <td class="six wide column account-email"><a href="{{ url_for('.show', account_id=account.id) }}">{{ account.email }}</a></td>
            <td class="two wide column account-status"><a href="{{ url_for('.show', account_id=account.id) }}">{{ status_macros.text(account.status) }}</a></td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
{% elif search_results != None %}
  <div class="search-message">
    <img src="{{ static_url_for("static", filename="img/no-results.svg") }}">
    <p>No results to show. Try another search.</p>
  </div>
{% elif recent_searches %}
  <div class="recent-searches">
    <h4 class="search-header">Recent Searches</h4>
    <div class="items-container">
      {% for account in recent_searches[:10] %}
        <div class="item"><a href="{{ url_for('.show', account_id=account.id) }}">{{ account.name }}</a></div>
        <div class="ui divider"></div>
      {% endfor %}
    </div>
  </div>
{% else %}
  <div class="search-message">
    <img src="{{ static_url_for("static", filename="img/start-search.png") }}">
    <p>Start typing to se search results</p>
  </div>
{% endif %}