{% extends "base.html" %}

{% set active_tab = '' %}

{% block title %}{{ title }} - Second Brain{% endblock %}

{% block content_class %}reading{% endblock %}

{% block actions %}
<a href="/wiki/{{ slug }}/history" class="topbar-btn">
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
        <circle cx="12" cy="12" r="10"/>
        <polyline points="12 6 12 12 16 14"/>
    </svg>
</a>
<a href="/wiki/{{ slug }}/edit" class="topbar-btn">
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
        <path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/>
        <path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/>
    </svg>
</a>
{% endblock %}

{% block content %}
<article class="wiki-page" data-page-hash="{{ page_hash }}">
    <div class="wiki-meta">
        {% if metadata.get('tags') %}
        <div class="wiki-tags">
            {% for tag in metadata.tags.split(',') %}
            {% if tag.strip() %}
            <a href="/?tag={{ tag.strip() | urlencode }}" class="tag">{{ tag.strip() }}</a>
            {% endif %}
            {% endfor %}
        </div>
        {% endif %}

        <div class="wiki-dates">
            {% if metadata.get('created') %}
            <span>Created {{ metadata.created }}</span>
            {% endif %}
            {% if metadata.get('updated') %}
            <span>· Updated {{ metadata.updated }}</span>
            {% endif %}
        </div>
    </div>

    <h1 class="wiki-title">{{ title }}</h1>

    <div class="wiki-content">
        {{ html | safe }}
    </div>

    {% if metadata.get('source') %}
    <div class="wiki-source">
        <strong>Source:</strong> {{ metadata.source }}
    </div>
    {% endif %}
</article>

<!-- Outgoing Links -->
{% if outlinks %}
<aside class="wiki-links">
    <div class="wiki-links-section">
        <h3>Links from this page</h3>
        <ul class="wiki-links-list">
            {% for link in outlinks %}
            <li>
                <a href="/wiki/{{ link.slug }}">{{ link.title }}</a>
            </li>
            {% endfor %}
        </ul>
    </div>
</aside>
{% endif %}

<!-- Backlinks -->
{% if backlinks %}
<aside class="wiki-links">
    <div class="wiki-links-section">
        <h3>Pages linking here</h3>
        <ul class="wiki-links-list">
            {% for bl in backlinks %}
            <li>
                <a href="/wiki/{{ bl.slug }}">{{ bl.title }}</a>
                {% if bl.snippet %}
                <span class="backlink-snippet">— {{ bl.snippet }}</span>
                {% endif %}
            </li>
            {% endfor %}
        </ul>
    </div>
</aside>
{% endif %}
{% endblock %}