{% load static %}

{% if data.error %}
<div class='card'>
    <div class='card-body text-danger'>
        {{ data.error }}
    </div>
</div>
{% else %}
<div>
    <form id="semantic_search_form">
        <div class="container-fluid">
            <div class="w-100 d-flex">
                <input id="sem_search_input"
                       class="form-control ui-widget ui-widget-content ui-corner-all"
                       type="text"
                placeholder="Find documents..." aria-label="Search">

                <div class="ms-2">
                    <button type="submit" value="Search" class="button primary search_button" id="search_btn">
                        Search
                    </button>
                </div>
                <div class="ms-1">
                    <span class="semantic_search_settings settings_button"><i class="fas fa-gear"></i></span>
                </div>
            </div>
        </div>
    </form>
    <div class="nav nav-tabs" id="semantic_search_tab">
        <a class="nav-link active">
            Relevant Snippets
            <span class="badge {% if BOOTSTRAP_VERSION|first == "4" %}badge-secondary{% elif BOOTSTRAP_VERSION|first == "5" %}bg-secondary{% endif %}" id="results_infos">-</span>
        </a>
    </div>
    <div id="semantic_search_docs_col">
        <div id="semantic_search_docs">
            <div id="semantic_search_docs_results">
            </div>
        </div>
    </div>
    <div hidden id="semantic_search_vector_function" data-vector-func="{{data.vector_function}}"></div>
    <div hidden id="semantic_search_vector_function_display" data-vector-func-disp="{{data.vector_function_display}}"></div>
</div>
{% endif %}