CmdForge/src/cmdforge/web/templates/admin/publishers.html

{% extends "dashboard/base.html" %}

{% block dashboard_header %}
<div class="flex items-center justify-between">
    <div>
        <h1 class="text-2xl font-bold text-gray-900">Publishers</h1>
        <p class="mt-1 text-gray-600">Manage registry publishers</p>
    </div>
    <a href="{{ url_for('web.admin_dashboard') }}" class="text-sm text-indigo-600 hover:text-indigo-700">&larr; Back to Admin</a>
</div>
{% endblock %}

{% block dashboard_content %}
<div class="bg-white rounded-lg border border-gray-200">
    {% if publishers %}
    <div class="overflow-x-auto">
        <table class="min-w-full divide-y divide-gray-200">
            <thead class="bg-gray-50">
                <tr>
                    <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Publisher</th>
                    <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Role</th>
                    <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Tools</th>
                    <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Downloads</th>
                    <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Status</th>
                    <th scope="col" class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">Actions</th>
                </tr>
            </thead>
            <tbody class="bg-white divide-y divide-gray-200">
                {% for pub in publishers %}
                <tr id="pub-row-{{ pub.id }}" class="hover:bg-gray-50">
                    <td class="px-6 py-4 whitespace-nowrap">
                        <div class="flex items-center">
                            <div>
                                <div class="text-sm font-medium text-gray-900">{{ pub.display_name }}</div>
                                <div class="text-sm text-gray-500">@{{ pub.slug }}</div>
                            </div>
                        </div>
                    </td>
                    <td class="px-6 py-4 whitespace-nowrap">
                        <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full
                            {% if pub.role == 'admin' %}bg-red-100 text-red-800
                            {% elif pub.role == 'moderator' %}bg-purple-100 text-purple-800
                            {% else %}bg-gray-100 text-gray-800{% endif %}">
                            {{ pub.role }}
                        </span>
                    </td>
                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
                        {{ pub.tool_count }}
                    </td>
                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
                        {{ pub.total_downloads|default(0)|int }}
                    </td>
                    <td class="px-6 py-4 whitespace-nowrap">
                        {% if pub.banned %}
                        <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-red-100 text-red-800">
                            Banned
                        </span>
                        {% elif pub.verified %}
                        <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">
                            Verified
                        </span>
                        {% else %}
                        <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">
                            Active
                        </span>
                        {% endif %}
                    </td>
                    <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
                        {% if user.role == 'admin' and pub.role != 'admin' %}
                            {% if pub.banned %}
                            <button onclick="unbanPublisher({{ pub.id }})" class="text-green-600 hover:text-green-900 mr-2">Unban</button>
                            {% else %}
                            <button onclick="banPublisher({{ pub.id }}, '{{ pub.slug }}')" class="text-red-600 hover:text-red-900 mr-2">Ban</button>
                            {% endif %}
                            <button onclick="changeRole({{ pub.id }}, '{{ pub.slug }}', '{{ pub.role }}')" class="text-indigo-600 hover:text-indigo-900 mr-2">Role</button>
                            <button onclick="resetPassword({{ pub.id }}, '{{ pub.slug }}')" class="text-yellow-600 hover:text-yellow-900 mr-2">Reset PW</button>
                            <button onclick="deletePublisher({{ pub.id }}, '{{ pub.slug }}', {{ pub.tool_count }})" class="text-gray-600 hover:text-gray-900">Delete</button>
                        {% endif %}
                    </td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>

    <!-- Pagination -->
    {% if meta.total_pages > 1 %}
    <div class="bg-gray-50 px-6 py-3 flex items-center justify-between border-t border-gray-200">
        <div class="text-sm text-gray-700">
            Page {{ meta.page }} of {{ meta.total_pages }} ({{ meta.total }} total)
        </div>
        <div class="flex space-x-2">
            {% if meta.page > 1 %}
            <a href="?page={{ meta.page - 1 }}" class="px-3 py-1 border rounded text-sm hover:bg-gray-100">Previous</a>
            {% endif %}
            {% if meta.page < meta.total_pages %}
            <a href="?page={{ meta.page + 1 }}" class="px-3 py-1 border rounded text-sm hover:bg-gray-100">Next</a>
            {% endif %}
        </div>
    </div>
    {% endif %}
    {% else %}
    <div class="text-center py-12">
        <h3 class="text-sm font-medium text-gray-900">No publishers found</h3>
    </div>
    {% endif %}
</div>

<!-- Ban Modal -->
<div id="ban-modal" class="fixed inset-0 bg-gray-600 bg-opacity-50 hidden overflow-y-auto h-full w-full z-50">
    <div class="relative top-20 mx-auto p-5 border w-96 shadow-lg rounded-md bg-white">
        <div class="mt-3">
            <h3 class="text-lg font-medium text-gray-900 mb-2">Ban Publisher</h3>
            <p class="text-sm text-gray-500 mb-4" id="ban-publisher-name"></p>
            <textarea id="ban-reason" rows="3" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-indigo-500" placeholder="Reason for ban (required)"></textarea>
            <div class="mt-4 flex justify-end space-x-3">
                <button onclick="closeBanModal()" class="px-4 py-2 text-sm font-medium text-gray-700 hover:text-gray-500">Cancel</button>
                <button onclick="confirmBan()" class="px-4 py-2 bg-red-600 text-white text-sm font-medium rounded-md hover:bg-red-700">Ban</button>
            </div>
        </div>
    </div>
</div>

<!-- Role Modal -->
<div id="role-modal" class="fixed inset-0 bg-gray-600 bg-opacity-50 hidden overflow-y-auto h-full w-full z-50">
    <div class="relative top-20 mx-auto p-5 border w-96 shadow-lg rounded-md bg-white">
        <div class="mt-3">
            <h3 class="text-lg font-medium text-gray-900 mb-2">Change Role</h3>
            <p class="text-sm text-gray-500 mb-4" id="role-publisher-name"></p>
            <select id="new-role" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-indigo-500">
                <option value="user">User</option>
                <option value="moderator">Moderator</option>
                <option value="admin">Admin</option>
            </select>
            <div class="mt-4 flex justify-end space-x-3">
                <button onclick="closeRoleModal()" class="px-4 py-2 text-sm font-medium text-gray-700 hover:text-gray-500">Cancel</button>
                <button onclick="confirmRole()" class="px-4 py-2 bg-indigo-600 text-white text-sm font-medium rounded-md hover:bg-indigo-700">Update</button>
            </div>
        </div>
    </div>
</div>

<!-- Temp Password Modal -->
<div id="temp-password-modal" class="fixed inset-0 bg-gray-600 bg-opacity-50 hidden overflow-y-auto h-full w-full z-50">
    <div class="relative top-20 mx-auto p-5 border w-96 shadow-lg rounded-md bg-white">
        <div class="mt-3">
            <h3 class="text-lg font-medium text-gray-900 mb-2">Password Reset</h3>
            <p class="text-sm text-gray-500 mb-4">Temporary password for <strong id="temp-password-slug"></strong>:</p>
            <div class="bg-gray-100 p-3 rounded-md font-mono text-center text-lg select-all" id="temp-password-value"></div>
            <p class="text-xs text-gray-500 mt-2">Share this password securely with the user. They should change it after logging in.</p>
            <div class="mt-4 flex justify-end space-x-3">
                <button onclick="copyTempPassword()" class="px-4 py-2 text-sm font-medium text-indigo-600 hover:text-indigo-800">Copy</button>
                <button onclick="closeTempPasswordModal()" class="px-4 py-2 bg-indigo-600 text-white text-sm font-medium rounded-md hover:bg-indigo-700">Done</button>
            </div>
        </div>
    </div>
</div>

<!-- Delete Modal -->
<div id="delete-modal" class="fixed inset-0 bg-gray-600 bg-opacity-50 hidden overflow-y-auto h-full w-full z-50">
    <div class="relative top-20 mx-auto p-5 border w-96 shadow-lg rounded-md bg-white">
        <div class="mt-3">
            <h3 class="text-lg font-medium text-red-600 mb-2">Delete Publisher</h3>
            <p class="text-sm text-gray-600 mb-4">
                You are about to permanently delete <strong id="delete-publisher-name"></strong>.
                This action cannot be undone.
            </p>
            <div id="delete-tools-option" class="mb-4">
                <label class="flex items-center text-sm">
                    <input type="checkbox" id="delete-tools-checkbox" class="mr-2 h-4 w-4 text-red-600 border-gray-300 rounded">
                    Also delete their <span id="delete-tool-count" class="font-medium mx-1"></span> tools
                </label>
            </div>
            <div class="mb-4">
                <label class="block text-sm font-medium text-gray-700 mb-1">Type the username to confirm:</label>
                <input type="text" id="delete-confirm-input" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-red-500" placeholder="username">
            </div>
            <div class="mt-4 flex justify-end space-x-3">
                <button onclick="closeDeleteModal()" class="px-4 py-2 text-sm font-medium text-gray-700 hover:text-gray-500">Cancel</button>
                <button onclick="confirmDelete()" class="px-4 py-2 bg-red-600 text-white text-sm font-medium rounded-md hover:bg-red-700">Delete</button>
            </div>
        </div>
    </div>
</div>

<script>
let currentPublisherId = null;

function banPublisher(pubId, slug) {
    currentPublisherId = pubId;
    document.getElementById('ban-publisher-name').textContent = `Banning @${slug}`;
    document.getElementById('ban-modal').classList.remove('hidden');
    document.getElementById('ban-reason').value = '';
}

function closeBanModal() {
    document.getElementById('ban-modal').classList.add('hidden');
    currentPublisherId = null;
}

async function confirmBan() {
    const reason = document.getElementById('ban-reason').value.trim();
    if (!reason) {
        alert('Ban reason is required');
        return;
    }
    try {
        const response = await fetch(`/api/v1/admin/publishers/${currentPublisherId}/ban`, {
            method: 'POST',
            headers: {
                'Authorization': 'Bearer {{ session.get("auth_token") }}',
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({ reason })
        });
        if (response.ok) {
            location.reload();
        } else {
            const data = await response.json();
            alert(data.error?.message || 'Failed to ban publisher');
        }
    } catch (error) {
        alert('Network error');
    }
}

async function unbanPublisher(pubId) {
    if (!confirm('Unban this publisher?')) return;
    try {
        const response = await fetch(`/api/v1/admin/publishers/${pubId}/unban`, {
            method: 'POST',
            headers: {
                'Authorization': 'Bearer {{ session.get("auth_token") }}',
                'Content-Type': 'application/json'
            }
        });
        if (response.ok) {
            location.reload();
        } else {
            const data = await response.json();
            alert(data.error?.message || 'Failed to unban publisher');
        }
    } catch (error) {
        alert('Network error');
    }
}

function changeRole(pubId, slug, currentRole) {
    currentPublisherId = pubId;
    document.getElementById('role-publisher-name').textContent = `Changing role for @${slug}`;
    document.getElementById('new-role').value = currentRole;
    document.getElementById('role-modal').classList.remove('hidden');
}

function closeRoleModal() {
    document.getElementById('role-modal').classList.add('hidden');
    currentPublisherId = null;
}

async function confirmRole() {
    const role = document.getElementById('new-role').value;
    try {
        const response = await fetch(`/api/v1/admin/publishers/${currentPublisherId}/role`, {
            method: 'POST',
            headers: {
                'Authorization': 'Bearer {{ session.get("auth_token") }}',
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({ role })
        });
        if (response.ok) {
            location.reload();
        } else {
            const data = await response.json();
            alert(data.error?.message || 'Failed to change role');
        }
    } catch (error) {
        alert('Network error');
    }
}

async function resetPassword(pubId, slug) {
    if (!confirm(`Reset password for @${slug}? A temporary password will be generated.`)) return;
    try {
        const response = await fetch(`/api/v1/admin/publishers/${pubId}/reset-password`, {
            method: 'POST',
            headers: {
                'Authorization': 'Bearer {{ session.get("auth_token") }}',
                'Content-Type': 'application/json'
            }
        });
        if (response.ok) {
            const data = await response.json();
            const tempPw = data.data.temporary_password;
            // Show modal with temporary password
            document.getElementById('temp-password-value').textContent = tempPw;
            document.getElementById('temp-password-slug').textContent = slug;
            document.getElementById('temp-password-modal').classList.remove('hidden');
        } else {
            const data = await response.json();
            alert(data.error?.message || 'Failed to reset password');
        }
    } catch (error) {
        alert('Network error');
    }
}

function closeTempPasswordModal() {
    document.getElementById('temp-password-modal').classList.add('hidden');
}

function copyTempPassword() {
    const pw = document.getElementById('temp-password-value').textContent;
    navigator.clipboard.writeText(pw).then(() => {
        alert('Password copied to clipboard');
    });
}

let deletePublisherData = null;

function deletePublisher(pubId, slug, toolCount) {
    deletePublisherData = { pubId, slug, toolCount };
    document.getElementById('delete-publisher-name').textContent = `@${slug}`;
    document.getElementById('delete-tool-count').textContent = toolCount;
    document.getElementById('delete-tools-option').style.display = toolCount > 0 ? 'block' : 'none';
    document.getElementById('delete-tools-checkbox').checked = false;
    document.getElementById('delete-modal').classList.remove('hidden');
}

function closeDeleteModal() {
    document.getElementById('delete-modal').classList.add('hidden');
    deletePublisherData = null;
}

async function confirmDelete() {
    if (!deletePublisherData) return;
    const deleteTools = document.getElementById('delete-tools-checkbox').checked;
    const confirmText = document.getElementById('delete-confirm-input').value;

    if (confirmText !== deletePublisherData.slug) {
        alert('Please type the username correctly to confirm');
        return;
    }

    try {
        const url = `/api/v1/admin/publishers/${deletePublisherData.pubId}?delete_tools=${deleteTools}`;
        const response = await fetch(url, {
            method: 'DELETE',
            headers: {
                'Authorization': 'Bearer {{ session.get("auth_token") }}'
            }
        });
        if (response.ok) {
            location.reload();
        } else {
            const data = await response.json();
            alert(data.error?.message || 'Failed to delete publisher');
        }
    } catch (error) {
        alert('Network error');
    }
}
</script>
{% endblock %}