{% extends "base.html" %}
{% block title %}Memory Browser — ClawTex Dashboard{% endblock %}
{% block content %}
<h1>Memory Browser</h1>

{% if stats %}
<div class="stats-bar">
    <div class="stat">
        <span class="stat-value">{{ stats.total_memories or 0 }}</span>
        <span class="stat-label">Memories</span>
    </div>
    <div class="stat">
        <span class="stat-value">{{ stats.total_insights or 0 }}</span>
        <span class="stat-label">Insights</span>
    </div>
    <div class="stat">
        <span class="stat-value">{{ stats.total_edges or 0 }}</span>
        <span class="stat-label">Connections</span>
    </div>
    <div class="stat">
        <span class="stat-value">{{ "%.0f" | format((stats.graph_quality_index or 0) * 100) }}%</span>
        <span class="stat-label">GQI</span>
    </div>
    <div class="stat">
        <span class="stat-value {{ 'health-ok' if stats.health == 'ok' else 'health-warn' }}">{{ stats.health or '?' }}</span>
        <span class="stat-label">Health</span>
    </div>
</div>
{% endif %}

<form class="filter-bar" method="get" action="/memory">
    <input type="text" name="q" placeholder="Search memories semantically..." value="{{ query or '' }}" autofocus>
    <input type="text" name="namespace" placeholder="Namespace" value="{{ namespace or '' }}" style="min-width:180px;">
    <button type="submit">Search</button>
</form>

{% if error %}
<div class="card" style="border-color: var(--red);">
    <div class="label" style="color: var(--red);">Error</div>
    <p>{{ error }}</p>
</div>
{% elif memories %}
<p style="color: var(--text-muted); font-size: 0.85rem; margin-bottom: 1rem;">
    {{ memories | length }} result(s) for "{{ query }}" in namespace "{{ namespace }}"
</p>
{% for mem in memories %}
<div class="memory-item">
    <div class="memory-content">{{ mem.content or mem.get("text", "") or mem | tojson }}</div>
    <div class="meta">
        {% if mem.score is defined %}
        <span class="score" title="Similarity score">
            <span class="score-bar" style="width: {{ (mem.score * 100) | int }}%"></span>
            {{ "%.3f" | format(mem.score) }}
        </span>
        {% endif %}
        {% if mem.node_type is defined %}
        <span class="badge badge-{{ mem.node_type }}">{{ mem.node_type }}</span>
        {% endif %}
        {% if mem.memory_id is defined %}
        <span class="mem-id">{{ mem.memory_id }}</span>
        {% elif mem.id is defined %}
        <span class="mem-id">{{ mem.id }}</span>
        {% endif %}
        {% if mem.metadata is defined and mem.metadata %}
        {% for k, v in mem.metadata.items() %}
        <span class="meta-tag">{{ k }}: {{ v }}</span>
        {% endfor %}
        {% endif %}
    </div>
</div>
{% endfor %}
{% elif query %}
<div class="empty">No memories found for "{{ query }}".</div>
{% else %}
<div class="empty">Enter a search query to browse memories semantically.</div>
{% endif %}
{% endblock %}