<?php
$provider_label = 'OpenAI';
if (isset($ai_provider)) {
    if ($ai_provider === 'gemini') {
        $provider_label = 'Google Gemini';
    } elseif ($ai_provider === 'easytokens') {
        $provider_label = 'EasyTokens - НашаНейросеть';
    }
}
$items          = $items      ?? [];
$total          = $total      ?? 0;
$filters_html   = $filters_html ?? '';
$list_html      = $list_html ?? '';
$editor_html    = $editor_html ?? '';
?>

<div class="knowledge-storage-page card border-0 shadow-sm rounded-4 p-4" style="background: #ffffff;">

<!-- Page Header -->
<div class="d-flex flex-column flex-sm-row justify-content-between align-items-start align-items-sm-center mb-4 gap-3">
    <div>
        <h4 class="fw-bold text-dark mb-1" style="font-family:'Outfit',sans-serif;">
            <i class="fa fa-database me-2" style="color:#6366f1;"></i> База знаний ИИ
        </h4>
        <p class="text-muted small mb-0">
            Управление векторной базой знаний &mdash; провайдер: <strong><?php echo htmlspecialchars($provider_label); ?></strong>
            <?php if ($total > 0): ?>
                &nbsp;&middot;&nbsp; <span class="text-muted"><?php echo $total; ?> записей</span>
            <?php endif; ?>
        </p>
    </div>
    <button class="btn btn-primary easychat-admin-primary-action px-4 py-2 d-flex align-items-center btn-open-document-editor"
            hx-post="index.php?route=knowledge_storage/editor"
            hx-target="#knowledge-document-editor-shell"
            hx-swap="outerHTML"
            hx-sync="#knowledge-document-editor-shell:replace"
            data-csrf-field="csrf_token"
            style="font-family:'Outfit',sans-serif;">
        <i class="fa fa-plus me-2"></i> Добавить статью
    </button>
</div>

<?php echo $filters_html; ?>

<!-- Info Block -->
<div class="p-3 mb-4 rounded-3 d-flex align-items-start" style="background:#f8fafc; border:1px solid #f1f5f9;">
    <div class="d-flex align-items-center justify-content-center rounded-3 me-3 flex-shrink-0"
         style="width:44px; height:44px; background:linear-gradient(135deg,#6366f1,#a855f7);">
        <i class="fa fa-info text-white"></i>
    </div>
    <div>
        <h6 class="fw-semibold mb-1" style="font-family:'Outfit',sans-serif; color:#0f172a;">Что такое база знаний ИИ?</h6>
        <p class="text-muted small mb-0">
            База знаний хранит векторные представления (эмбеддинги) текстов, по которым ИИ-консультант
            выполняет семантический поиск перед ответом пользователю. Чем больше актуальных материалов
            добавлено в базу, тем точнее и полезнее ответы ИИ.
            Записи со статусом <strong>«Ожидает»</strong> или <strong>«Индексируется»</strong> обрабатываются
            фоновым процессом CRON и станут активными автоматически.
        </p>
    </div>
</div>

<!-- Knowledge List -->
<?php echo $list_html; ?>
</div> <!-- .knowledge-storage-page -->

<!-- ===================== Article Editor Modal ===================== -->
<div class="modal fade" id="addDocumentModal" tabindex="-1" aria-labelledby="addDocumentModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-centered">
        <div class="modal-content knowledge-editor-modal-content">
            <?php echo $editor_html; ?>
        </div>
    </div>
</div>

<!-- ===================== Error Detail Modal ===================== -->
<div class="modal fade" id="errorDetailModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" style="max-width:560px;">
        <div class="modal-content" style="border-radius:16px; border:none;">
            <div class="modal-header border-0 pb-0 px-4 pt-4">
                <h6 class="modal-title fw-bold text-danger mb-0">
                    <i class="fa fa-exclamation-circle me-2"></i>Детали ошибки
                </h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body px-4 py-3">
                <pre id="errorDetailText"
                     style="background:#fef2f2; border:1px solid #fecaca; border-radius:10px;
                            padding:14px; font-size:12px; color:#dc2626; font-family:monospace;
                            white-space:pre-wrap; word-break:break-all; max-height:320px;
                            overflow-y:auto; margin:0;"></pre>
            </div>
            <div class="modal-footer border-0 px-4 pb-4 pt-0">
                <button type="button" class="btn btn-light px-4"
                        data-bs-dismiss="modal" style="border-radius:10px;">Закрыть</button>
            </div>
        </div>
    </div>
</div>

<!-- ===================== JS ===================== -->
<?php echo easychat_script_tag('js/views/knowledge.js'); ?>
