package blog

import (
    "gobeyhan/views/admin"
)

templ Layout(title string) {
    @admin.Layout(title) {
        <div class="px-4 py-6 sm:px-0">
            <div class="mb-6 border-b border-gray-200">
                <nav class="-mb-px flex space-x-8" aria-label="Tabs">
                    <a href="/admin/blog" class="border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm">Posts</a>
                    <a href="/admin/blog/categories" class="border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm">Categories</a>
                    <a href="/admin/blog/tags" class="border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm">Tags</a>
                    <a href="/admin/blog/comments" class="border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm">Comments</a>
                </nav>
            </div>
            { children... }
        </div>
        <script>
            function confirmDelete(title, text, formId) {
                Swal.fire({
                    title: title || 'Are you sure?',
                    text: text || "You won't be able to revert this!",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Yes, delete it!'
                }).then((result) => {
                    if (result.isConfirmed) {
                        document.getElementById(formId).submit();
                    }
                })
            }

            function slugify(text) {
                const trMap = {
                    'çÇ': 'c',
                    'ğĞ': 'g',
                    'şŞ': 's',
                    'üÜ': 'u',
                    'ıİ': 'i',
                    'öÖ': 'o'
                };
                for (let key in trMap) {
                    text = text.replace(new RegExp('[' + key + ']', 'g'), trMap[key]);
                }
                return text.toString().toLowerCase()
                    .replace(/\s+/g, '-')
                    .replace(/[^\w\-]+/g, '')
                    .replace(/\-\-+/g, '-')
                    .replace(/^-+/, '')
                    .replace(/-+$/, '');
            }

            function autoSlug(sourceId, targetId) {
                const source = document.getElementById(sourceId);
                const target = document.getElementById(targetId);
                if (!source || !target) return;

                source.addEventListener('input', function() {
                    // Only auto-fill if the target is empty or was auto-filled (basic check)
                    // For now, let's just always suggest if it's a new entry (manual override still works)
                    target.value = slugify(source.value);
                });
            }
        </script>
    }
}