{% extends "base.html" %}
{% block content %}
<section class="hero">
  <div class="kicker">Local test chat</div>
  <h2>Chat with 8mem memory, without Telegram.</h2>
  <p>
    Use this page when Telegram is skipped. It sends your question to the local Ollama model
    with 8mem memory context attached, so QA can verify prompting from the browser.
  </p>
  <div class="actions">
    <a class="btn" href="/mirror{{ active_scope.query_suffix }}">Check memory mirror</a>
    <a class="btn" href="/files{{ active_scope.query_suffix }}">Open memory files</a>
  </div>
</section>

<div class="grid cols-2">
  <section class="card">
    <div class="header">
      <div>
        <div class="kicker">Prompt</div>
        <h3>Ask a local model</h3>
      </div>
      <span class="badge blue">Ollama</span>
    </div>
    <form method="post" action="/chat{{ active_scope.query_suffix }}">
      <textarea class="chat-input" name="question" placeholder="Example: What do you know about how I like replies?">{{ question }}</textarea>
      <div class="actions">
        <button class="btn primary" type="submit">Ask with 8mem memory</button>
      </div>
    </form>
    <p class="small" style="margin-top:14px">
      Model: <strong>{{ model }}</strong><br />
      Ollama URL: <strong>{{ base_url }}</strong>
    </p>
  </section>

  <section class="card">
    <div class="header">
      <div>
        <div class="kicker">Answer</div>
        <h3>Memory-shaped response</h3>
      </div>
      <span class="badge green">Local</span>
    </div>
    {% if error %}
      <div class="footer">
        <strong>Chat is not ready yet.</strong><br />
        {{ error }}
      </div>
      <p class="small" style="margin-top:14px">
        If Ollama is not installed, install it later and rerun <strong>8mem setup</strong>.
        You can still use the dashboard, memory files, import, and export without chat.
      </p>
    {% elif answer %}
      <div class="preview">{{ answer }}</div>
    {% else %}
      <div class="preview">No answer yet. Ask a question to test local prompting.</div>
    {% endif %}
  </section>
</div>

<section class="card" style="margin-top:20px">
  <div class="kicker">What this proves</div>
  <h3>Telegram is optional for local QA</h3>
  <p>
    Telegram is one channel. This browser page is the local fallback channel. If Telegram setup is skipped,
    QA can still test whether 8mem memory changes the model response.
  </p>
</section>
{% endblock %}