{% extends "admin/base.html" %}

{% block title %}Chatbot Knowledge | Admin{% endblock %}

{% block content %}
<div class="admin-page-head">
  <div>
    <p class="eyebrow-dark">Chatbot</p>
    <h1>Knowledge Base</h1>
    <p class="mt-2 text-sm font-bold text-zinc-500">Small FAQ-style snippets used by the chatbot. No vector database required.</p>
  </div>
  <a class="btn-outline" href="{{ url_for('admin_chatbot') }}">Back to Chatbot</a>
</div>

<section class="admin-panel mt-8">
  <h2>Add Knowledge Entry</h2>
  <form class="mt-5 grid gap-4" method="post">
    <input type="hidden" name="knowledge_action" value="save">
    <div class="grid gap-4 md:grid-cols-4">
      <label class="md:col-span-2"><span class="form-label">Title / question</span><input class="form-input" name="title"></label>
      <label><span class="form-label">Category</span><input class="form-input" name="category" placeholder="Delivery, HST, Financing"></label>
      <label><span class="form-label">Language</span><select class="form-input" name="language_code">{% for language in languages %}<option value="{{ language.code }}">{{ language.name }}</option>{% endfor %}</select></label>
    </div>
    <textarea class="form-input min-h-28" name="content" placeholder="Answer or guidance. Keep it factual and safe."></textarea>
    <div class="flex flex-wrap items-center gap-4">
      <label><span class="form-label">Sort order</span><input class="form-input max-w-32" name="sort_order" value="100"></label>
      <label class="mt-6 text-sm font-bold"><input type="checkbox" name="is_active" checked> Active</label>
      <button class="btn-primary mt-6" type="submit">Add Entry</button>
    </div>
  </form>
</section>

<section class="mt-6 grid gap-6 xl:grid-cols-2">
  <form class="admin-panel" method="post">
    <input type="hidden" name="knowledge_action" value="import_faqs">
    <h2>Import Existing FAQs</h2>
    <p class="mt-2 text-sm text-zinc-600">Copies active admin FAQ entries into chatbot knowledge if they are not already present.</p>
    <button class="btn-outline mt-5" type="submit">Import Active FAQs</button>
  </form>
  <form class="admin-panel" method="post">
    <input type="hidden" name="knowledge_action" value="paste_faq">
    <h2>Paste FAQ Text</h2>
    <label class="mt-4 block"><span class="form-label">Language</span><select class="form-input max-w-xs" name="paste_language">{% for language in languages %}<option value="{{ language.code }}">{{ language.name }}</option>{% endfor %}</select></label>
    <textarea class="form-input mt-4 min-h-40" name="faq_paste" placeholder="Q: Can you arrange delivery?&#10;A: Delivery depends on vehicle size, location, and destination."></textarea>
    <button class="btn-outline mt-5" type="submit">Parse and Add</button>
  </form>
</section>

<section class="admin-panel mt-6">
  <h2>Entries</h2>
  <div class="mt-5 grid gap-4">
    {% for entry in entries %}
      <form class="rounded-lg border border-zinc-200 p-4" method="post">
        <input type="hidden" name="knowledge_id" value="{{ entry.id }}">
        <input type="hidden" name="knowledge_action" value="save">
        <div class="grid gap-4 md:grid-cols-5">
          <label class="md:col-span-2"><span class="form-label">Title</span><input class="form-input" name="title" value="{{ entry.title or '' }}"></label>
          <label><span class="form-label">Category</span><input class="form-input" name="category" value="{{ entry.category or '' }}"></label>
          <label><span class="form-label">Language</span><select class="form-input" name="language_code">{% for language in languages %}<option value="{{ language.code }}" {% if entry.language_code == language.code %}selected{% endif %}>{{ language.name }}</option>{% endfor %}</select></label>
          <label><span class="form-label">Sort</span><input class="form-input" name="sort_order" value="{{ entry.sort_order }}"></label>
        </div>
        <textarea class="form-input mt-4 min-h-24" name="content">{{ entry.content or '' }}</textarea>
        <div class="mt-4 flex flex-wrap items-center gap-3">
          <label class="text-sm font-bold"><input type="checkbox" name="is_active" {% if entry.is_active %}checked{% endif %}> Active</label>
          <button class="btn-primary py-2" type="submit">Save</button>
          <button class="btn-outline py-2" type="submit" name="knowledge_action" value="delete" onclick="return confirm('Delete this knowledge entry?');">Delete</button>
        </div>
      </form>
    {% else %}
      <p class="text-sm text-zinc-600">No chatbot knowledge entries yet.</p>
    {% endfor %}
  </div>
</section>
{% endblock %}