{% extends "base.html" %}

{% block title %}Catalog - Iceberg Explorer{% endblock %}

{% block nav_home %}bg-iceberg-800 text-white{% endblock %}

{% block sidebar %}
<div
    hx-get="/ui/partials/namespace-tree"
    hx-trigger="load"
    hx-swap="innerHTML"
>
    <div class="flex items-center justify-center py-8">
        <svg class="animate-spin h-6 w-6 text-iceberg-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
            <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
            <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
        </svg>
    </div>
</div>
{% endblock %}

{% block content %}
<div id="main-content">
    <div class="rounded-lg border border-dashed border-gray-300 bg-white p-12 text-center">
        <svg class="mx-auto h-12 w-12 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4" />
        </svg>
        <h3 class="mt-2 text-sm font-semibold text-gray-900">Select a table</h3>
        <p class="mt-1 text-sm text-gray-500">Browse namespaces in the sidebar and click on a table to view its details.</p>
    </div>
</div>
{% endblock %}