{% extends "base.html" %}

{% block title %}Delete Catalog - Kirin{% endblock %}

{% block breadcrumb %}
<span class="breadcrumb-separator">></span>
<a href="/">Catalogs</a>
<span class="breadcrumb-separator">></span>
<span>Delete {{ catalog.name }}</span>
{% endblock %}

{% block header_title %}Delete Catalog{% endblock %}
{% block header_description %}Remove this data catalog and all its datasets{% endblock %}

{% block content %}
<div class="max-w-2xl mx-auto">
    <div class="alert alert-warning mb-6">
        <strong>⚠️ Warning</strong><br>
        This action cannot be undone. All datasets in this catalog will be permanently deleted.<br>
        <strong>Alternative:</strong> You can hide this catalog instead to remove it from the main view without deleting it.
    </div>

    <div class="panel">
        <div class="panel-header">
            <h2 class="panel-title">Catalog Information</h2>
        </div>
        <div class="panel-content">
            <div class="space-y-4">
                <div>
                    <label class="text-sm font-medium text-muted-foreground">Catalog Name</label>
                    <p class="text-lg">{{ catalog.name }}</p>
                </div>

                <div>
                    <label class="text-sm font-medium text-muted-foreground">Root Directory</label>
                    <p class="text-lg font-mono">{{ catalog.root_dir }}</p>
                </div>

                <div>
                    <label class="text-sm font-medium text-muted-foreground">Datasets</label>
                    <p class="text-lg">
                        {% if dataset_count > 0 %}
                        {{ dataset_count }} dataset{{ 's' if dataset_count != 1 else '' }} will be deleted
                        {% else %}
                        No datasets found
                        {% endif %}
                    </p>
                </div>
            </div>
        </div>
    </div>

    {% if dataset_count > 0 %}
    <div class="alert alert-error mb-6">
        <strong>Cannot Delete</strong><br>
        This catalog contains {{ dataset_count }} dataset{{ 's' if dataset_count != 1 else '' }}.
        Please delete all datasets first before removing the catalog.
    </div>
    {% endif %}

    <div class="flex gap-3">
        <a href="/" class="btn btn-secondary">
            Cancel
        </a>

        <form method="POST" action="/catalog/{{ catalog.id }}/hide" class="inline">
            <button type="submit" class="btn btn-secondary">
                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"></path>
                    <line x1="1" y1="1" x2="23" y2="23"></line>
                </svg>
                Hide Catalog
            </button>
        </form>

        {% if dataset_count == 0 %}
        <form method="POST" action="/catalog/{{ catalog.id }}/delete" class="inline">
            <button type="submit" class="btn btn-destructive">
                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <polyline points="3,6 5,6 21,6"></polyline>
                    <path d="M19,6v14a2,2,0,0,1-2,2H7a2,2,0,0,1-2-2V6m3,0V4a2,2,0,0,1,2-2h4a2,2,0,0,1,2,2V6"></path>
                    <line x1="10" y1="11" x2="10" y2="17"></line>
                    <line x1="14" y1="11" x2="14" y2="17"></line>
                </svg>
                Delete Catalog
            </button>
        </form>
        {% endif %}
    </div>
</div>
{% endblock %}