{% extends "layouts/default.html" %}
{% block head %}
{% with title = "Review" %}
    {% include "includes/head.html" %}
{% endwith %}
{% endblock %}
{% block content %}
{% include "includes/self-tabs.html" %}
<h1>Review</h1>
<h2>Datasets</h2>

<div id="dataset-review-container" class="review-container">
    <div
        hx-get="/self/review/datasets"
        hx-trigger="load"
        hx-swap="outerHTML"
        hx-indicator="#review-datasets-indicator"
    >
        <span class="htmx-indicator search-indicator" id="review-datasets-indicator">
            <span>Loading datasets...</span>
            <img src="/static/img/rings.svg" alt="Loading indicator, a spinning ring"/>
        </span>
    </div>
</div>

<h2>Dataset Parts</h2>

<div id="dataset-parts-review-container" class="review-container">
    <div
        hx-get="/self/review/dataset-parts"
        hx-trigger="load"
        hx-swap="outerHTML"
        hx-indicator="#review-dataset-parts-indicator"
    >
        <span class="htmx-indicator search-indicator" id="review-dataset-parts-indicator">
            <span>Loading dataset parts...</span>
            <img src="/static/img/rings.svg" alt="Loading indicator, a spinning ring"/>
        </span>
    </div>
</div>

<h2>Uploads</h2>

<div id="upload-review-container"  class="review-container">
    <div
        hx-get="/self/review/uploads"
        hx-trigger="load"
        hx-swap="outerHTML"
        hx-indicator="#review-uploads-indicator"
    >
        <span class="htmx-indicator search-indicator" id="review-uploads-indicator">
            <span>Loading uploads...</span>
            <img src="/static/img/rings.svg" alt="Loading indicator, a spinning ring"/>
        </span>
    </div>
</div>
{% endblock %}
