{% extends "library/_layout.html" %}
{% from "_macros.html" import icon %}
{% set section = "knowledge" %}

{% block title %}Knowledge - {{ brand.name }}{% endblock %}
{% block heading %}Knowledge{% endblock %}

{% block library_content %}
<p class="admin-lede">
  Knowledge bases are collections of documents, images and saved web pages. Keep
  them separate — one per subject, project or client — and a chat can be pointed
  at just the ones it should draw on. Sharing happens here too: share a base and
  everything in it comes with it.
</p>

{% if error %}
<div class="alert alert--error">{{ icon("warning", "alert__icon") }} <span>{{ error }}</span></div>
{% endif %}

{% if bases %}
<ul class="model-list">
  {% for base in bases %}
  <li class="model-list__item">
    <div style="min-width: 0">
      <a href="/library/knowledge/{{ base.id }}"><strong>{{ base.name }}</strong></a>
      <div class="text-xs faint">
        {{ counts.get(base.id, 0) }} document{{ '' if counts.get(base.id, 0) == 1 else 's' }}
        {%- if base.description %} · {{ base.description }}{% endif %}
      </div>
    </div>
    <div class="btn-row">
      {% if base.owner_id != user.id %}<span class="badge">shared with you</span>{% endif %}
    </div>
  </li>
  {% endfor %}
</ul>
{% else %}
<div class="empty">
  {{ icon("archive", "empty__mark") }}
  <h2 class="empty__title">No knowledge bases yet</h2>
  <p class="empty__text">
    Make one below, then put documents in it. A chat with no base attached
    searches everything you have; a chat pointed at one searches only that.
  </p>
</div>
{% endif %}

<section class="card" style="margin-top: var(--sp-6)">
  <h2 class="card__title">New knowledge base</h2>
  <form method="post" action="/api/library/bases">
    <div class="grid grid--2">
      <div class="field">
        <label class="field__label" for="base-name">Name</label>
        <input class="input" id="base-name" name="name" required maxlength="200"
               placeholder="Contracts">
      </div>
      <div class="field">
        <label class="field__label" for="base-description">Description</label>
        <input class="input" id="base-description" name="description" maxlength="2000"
               placeholder="What belongs in here.">
      </div>
    </div>
    <button class="btn btn--primary" type="submit">{{ icon("plus", "icon--sm") }} Create</button>
  </form>
</section>
{% endblock %}