{% extends base_template %}
{% load debusine %}
{% load static %}
{% load users %}
{% block tail_js %}
    {{ block.super }}
    {% include "web/_tab_selector.html" %}
{% endblock %}
{% block content %}
    <nav>
        <div class="nav nav-tabs mb-3" id="nav-tab" role="tablist">
            {% if specialized_tab %}
                <button class="nav-link active"
                        id="nav-{{ specialized_tab.slug }}-tab"
                        data-bs-toggle="tab"
                        data-bs-target="#nav-{{ specialized_tab.slug }}"
                        type="button"
                        role="tab"
                        aria-controls="nav-{{ specialized_tab.slug }}"
                        aria-selected="false">{{ specialized_tab.label }}</button>
            {% endif %}
            <button class="nav-link {% if not specialized_tab %}active{% endif %} {% if file_count == 0 %}disabled{% endif %}"
                    id="nav-files-tab"
                    data-bs-toggle="tab"
                    data-bs-target="#nav-files"
                    type="button"
                    role="tab"
                    aria-controls="nav-files"
                    aria-selected="false">
                {% if file_count == 1 %}
                    File (1)
                {% else %}
                    Files ({{ file_count }})
                {% endif %}
            </button>
            <button class="nav-link"
                    id="nav-metadata-tab"
                    data-bs-toggle="tab"
                    data-bs-target="#nav-metadata"
                    type="button"
                    role="tab"
                    aria-controls="nav-metadata"
                    aria-selected="false">Metadata</button>
            <button class="nav-link {% if relation_count == 0 %}disabled{% endif %} "
                    id="nav-relations-tab"
                    data-bs-toggle="tab"
                    data-bs-target="#nav-relations"
                    type="button"
                    role="tab"
                    aria-controls="nav-relations"
                    aria-selected="false">
                {% if relation_count == 1 %}
                    Relation (1)
                {% else %}
                    Relations ({{ relation_count }})
                {% endif %}
            </button>
            <button class="nav-link"
                    id="nav-origin-tab"
                    data-bs-toggle="tab"
                    data-bs-target="#nav-origin"
                    type="button"
                    role="tab"
                    aria-controls="nav-origin"
                    aria-selected="false">Origin</button>
        </div>
    </nav>
    <div class="tab-content" id="nav-content">
        {% if specialized_tab %}
            <div class="tab-pane show active"
                 id="nav-{{ specialized_tab.slug }}"
                 role="tabpanel"
                 aria-labelledby="nav-{{ specialized_tab.slug }}-tab"
                 tabindex="0">{% include specialized_tab.template %}</div>
        {% endif %}
        <div class="tab-pane{% if not specialized_tab %} show active{% endif %}"
             id="nav-files"
             role="tabpanel"
             aria-labelledby="nav-files-tab"
             tabindex="0">
            {% if file_count == 1 %}
                {% widget file %}
            {% elif file_count > 1 %}
                <table id="file-list" class="table table-sm table-hover table-striped">
                    <thead>
                        <tr>
                            <th>Name</th>
                            <th>Size (bytes)</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for fileinartifact in file_list %}
                            <tr>
                                <td>
                                    {% if fileinartifact.complete %}
                                        <a href="{{ fileinartifact.get_absolute_url }}">{{ fileinartifact.basename }}</a>
                                    {% else %}
                                        {{ fileinartifact.basename }} (incomplete)
                                    {% endif %}
                                </td>
                                <td title="{{ fileinartifact.file.size }}">{{ fileinartifact.file.size|filesizeformat }}</td>
                                <td>
                                    <div class="btn-group btn-group-sm" role="toolbar" aria-label="Shortcuts">
                                        {% ui fileinartifact as fileinartifact_ui %}
                                        {% for shortcut in fileinartifact_ui.ui_shortcuts %}
                                            {% widget shortcut %}
                                        {% endfor %}
                                    </div>
                                </td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            {% else %}
                No files.
            {% endif %}
        </div>
        <div class="tab-pane"
             id="nav-metadata"
             role="tabpanel"
             aria-labelledby="nav-metadata-tab"
             tabindex="0">
            <div class="col-9">
                <table class="table table-hover table-striped" id="metadata-table">
                    <colgroup>
                        <col style="width: 1%">
                        <col>
                    </colgroup>
                    <tr>
                        <th class="text-nowrap">
                            <span class="bi bi-postcard"></span> Category
                        </th>
                        <td>{{ artifact.category }}</td>
                    </tr>
                    <tr>
                        <th class="text-nowrap">
                            <span class="bi bi-person-workspace"></span> Workspace
                        </th>
                        <td>
                            <a href="{{ artifact.workspace.get_absolute_url }}">{{ artifact.workspace }}</a>
                        </td>
                    </tr>
                    <tr>
                        <th class="text-nowrap">
                            <span class="bi bi-clock"></span> Created
                        </th>
                        <td title="{{ artifact.created_at }}">{{ artifact.created_at|timesince }} ago</td>
                    </tr>
                    {% if not artifact.created_by_work_request %}
                        <tr>
                            <th class="text-nowrap">
                                <span class="bi bi-person-circle"></span> User
                            </th>
                            <td title="{{ artifact.created_by }}">{{ artifact.created_by }}</td>
                        </tr>
                    {% endif %}
                    <tr>
                        <th class="text-nowrap">
                            <span class="bi bi-hourglass-split"></span> Expiration date
                        </th>
                        <td>{{ artifact.expire_at|default:"Never" }}</td>
                    </tr>
                    <tr>
                        <th colspan="2" class="text-nowrap" style="border-bottom: none;">
                            <span class="bi bi-braces"></span> Data
                        </th>
                    </tr>
                    <tr>
                        <td colspan="2">
                            <div id="metadata" class="card">{% include "web/_card-body.html" with data=artifact_data only %}</div>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div class="tab-pane"
             id="nav-relations"
             role="tabpanel"
             aria-labelledby="nav-relations-tab"
             tabindex="0">
            {% if relation_count > 0 %}
                <table id="relation-list" class="table table-sm table-hover table-striped">
                    <thead>
                        <tr>
                            <th>Relation</th>
                            <th>Direction</th>
                            <th>Type</th>
                            <th>Name</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for related in forward.all %}
                            <tr>
                                <td>{{ related.relation_type }}</td>
                                <td>
                                    <i class="bi {% icon "artifact_relation_target" %}"></i>
                                </td>
                                {% include "web/_artifact-list-row.html" with artifact=related %}
                            </tr>
                        {% endfor %}
                        {% for related in reverse_extends %}
                            <tr>
                                <td>{{ related.relation_type }}</td>
                                <td>
                                    <i class="bi {% icon "artifact_relation_source" %}"></i>
                                </td>
                                {% include "web/_artifact-list-row.html" with artifact=related %}
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            {% else %}
                <p>No relations.</p>
            {% endif %}
        </div>
        <div class="tab-pane"
             id="nav-origin"
             role="tabpanel"
             aria-labelledby="nav-origin-tab"
             tabindex="0">
            {% if not artifact.created_by_work_request and artifact.created_by %}
                <p id="artifact-created-by-user">Artifact created by {{ artifact.created_by|user_link }}.</p>
            {% else %}
                {% with work_request=artifact.created_by_work_request %}
                    <h2>Work request</h2>
                    <div class="col-9">
                        <table class="table table-hover table-striped" id="work_request-table">
                            <colgroup>
                                <col style="width: 1%">
                                <col>
                            </colgroup>
                            <tr>
                                <th class="text-nowrap">
                                    <span class="bi bi-hammer"></span> Work request
                                </th>
                                <td>
                                    <a href="{{ work_request.get_absolute_url }}">{{ work_request.id }} ({{ work_request.task_name }})</a>
                                </td>
                            </tr>
                            <tr>
                                <th class="text-nowrap">
                                    <span class="bi bi-heart-pulse"></span> Status and result
                                </th>
                                <td>
                                    {% include "web/_work_request-status.html" with status=work_request.status aborted_by=work_request.aborted_by only %}
                                    {% include "web/_work_request-result.html" with result=work_request.result only %}
                                </td>
                            </tr>
                            <tr>
                                <th class="text-nowrap">
                                    <span class="bi bi-person-workspace"></span> Workspace
                                </th>
                                <td>
                                    <a href="{{ work_request.workspace.get_absolute_url }}">{{ work_request.workspace }}</a>
                                </td>
                            </tr>
                            <tr>
                                <th class="text-nowrap">
                                    <span class="bi bi-person-circle"></span> User
                                </th>
                                <td>{{ work_request.created_by|default:"-" }}</td>
                            </tr>
                            <tr>
                                <th class="text-nowrap">
                                    <span class="bi bi-clock"></span> Created
                                </th>
                                <td title="{{ work_request.created_at }}">{{ work_request.created_at|timesince }} ago</td>
                            </tr>
                            <tr>
                                <th class="text-nowrap">
                                    <span class="bi bi-pc-horizontal"></span> Worker
                                </th>
                                <td>{{ work_request.worker.name }}</td>
                            </tr>
                        </table>
                    </div>
                {% endwith %}
                <p>&nbsp;</p>
            {% endif %}
            {% with workflow=artifact.created_by_work_request.workflow_root %}
                {% if workflow %}
                    <h2>Root workflow</h2>
                    <div class="col-9">
                        <table class="table table-hover table-striped" id="workflow-table">
                            <tr>
                                <th class="text-nowrap">
                                    <span class="bi bi-hammer"></span> Workflow
                                </th>
                                <td>
                                    <a href="{{ workflow.get_absolute_url }}">{{ workflow.id }} ({{ workflow.task_name }})</a>
                                </td>
                            </tr>
                            <tr>
                                <th class="text-nowrap">
                                    <span class="bi bi-heart-pulse"></span> Status and result
                                </th>
                                <td>
                                    {% include "web/_work_request-status.html" with status=workflow.status only %}
                                    {% include "web/_work_request-result.html" with result=workflow.result only %}
                                </td>
                            </tr>
                            <tr>
                                <th class="text-nowrap">
                                    <span class="bi bi-person-workspace"></span> Workspace
                                </th>
                                <td>
                                    <a href="{{ workflow.workspace.get_absolute_url }}">{{ workflow.workspace }}</a>
                                </td>
                            </tr>
                            <tr>
                                <th class="text-nowrap">
                                    <span class="bi bi-person-circle"></span> User
                                </th>
                                <td>{{ workflow.created_by|default:"-" }}</td>
                            </tr>
                            <tr>
                                <th class="text-nowrap">
                                    <span class="bi bi-clock"></span> Created
                                </th>
                                <td title="{{ workflow.created_at }}">{{ workflow.created_at|timesince }} ago</td>
                            </tr>
                        </table>
                    </div>
                {% endif %}
            {% endwith %}
        </div>
    </div>
{% endblock %}
