/**
 * Collection Create Page JavaScript
 * Handles creation of new collections
 */

// escapeHtmlFallback is provided globally by services/ui.js (loaded via base.html)

// Use existing URLS configuration from config/urls.js
// Collection create endpoint is now available as URLS.LIBRARY_API.COLLECTION_CREATE
// safeFetch is now provided by utils/safe-fetch.js loaded in base.html

/**
 * Initialize the create page
 */
document.addEventListener('DOMContentLoaded', function() {
    SafeLogger.log('Collection create page loaded');
    SafeLogger.log('URLS available:', typeof URLS !== 'undefined', URLS);
    SafeLogger.log('URLValidator available:', typeof URLValidator !== 'undefined', URLValidator);
    SafeLogger.log('COLLECTION_CREATE URL:', URLS?.LIBRARY_API?.COLLECTION_CREATE);

    // Setup form submission
    const form = document.getElementById('create-collection-form');
    if (form) {
        SafeLogger.log('Form found, attaching submit handler');
        form.addEventListener('submit', handleCreateCollection);
    } else {
        SafeLogger.error('Form not found!');
    }

    // Setup name input character counter
    const nameInput = document.getElementById('collection-name');
    if (nameInput) {
        nameInput.addEventListener('input', function(e) {
            const maxLength = 100;
            const currentLength = e.target.value.length;
            const remaining = maxLength - currentLength;
            const counter = document.getElementById('name-counter');
            if (counter) {
                counter.textContent = `${remaining} characters remaining`;
            }
        });
    }
});

/**
 * Handle collection creation
 */
async function handleCreateCollection(e) {
    SafeLogger.log('Create collection submit handler called');
    e.preventDefault();

    // Get form data
    const formData = new FormData(e.target);

    // Validate required fields
    const name = formData.get('name');
    const description = formData.get('description');

    if (!name || name.trim().length === 0) {
        showError('Collection name is required');
        return;
    }

    const submitBtn = e.target.querySelector('button[type="submit"]');
    const createBtn = document.getElementById('create-collection-btn');

    try {
        submitBtn.disabled = true;
        submitBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Creating Collection...';
        createBtn.disabled = true;
        createBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Creating Collection...';

        const csrfToken = window.api ? window.api.getCsrfToken() : '';

        // Prepare JSON data
        const isPublicEl = document.getElementById('collection-is-public');
        const agentEnabledEl = document.getElementById('collection-agent-enabled');
        const jsonData = {
            name: name.trim(),
            description: description ? description.trim() : '',
            type: 'user_uploads',
            is_public: isPublicEl ? isPublicEl.checked : false,
            // Default available to the agent when the control is absent.
            agent_enabled: agentEnabledEl ? agentEnabledEl.checked : true
        };

        const response = await safeFetch(URLS.LIBRARY_API.COLLECTION_CREATE, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'X-CSRFToken': csrfToken
            },
            body: JSON.stringify(jsonData)
        });

        const data = await response.json();

        if (data.success) {
            showCreateResults(data);
            // Reset form
            document.getElementById('create-collection-form').reset();

            // Redirect to the new collection after a short delay
            setTimeout(() => {
                if (data.collection && data.collection.id) {
                    // server-generated ID in hardcoded /library/collections/ path
                    // bearer:disable javascript_lang_open_redirect
                    window.location.href = `/library/collections/${data.collection.id}`;
                } else {
                    window.location.href = '/library/collections';
                }
            }, 1500);
        } else {
            showError(data.error || 'Failed to create collection');
        }
    } catch (error) {
        SafeLogger.error('Error creating collection:', error);
        showError('Failed to create collection: ' + error.message);
    } finally {
        submitBtn.disabled = false;
        submitBtn.innerHTML = '<i class="fas fa-folder-plus"></i> Create Collection';
        createBtn.disabled = false;
        createBtn.innerHTML = '<i class="fas fa-folder-plus"></i> Create Collection';
    }
}

/**
 * Show creation results
 */
function showCreateResults(data) {
    const resultsDiv = document.getElementById('create-results');

    let html = '<div class="ldr-alert ldr-alert-success" style="padding: 1rem; border-radius: 8px; margin-bottom: 1rem;">';
    html += '<h4 style="margin: 0 0 0.5rem 0;"><i class="fas fa-check-circle"></i> Collection Created!</h4>';

    if (data.collection && data.collection.id) {
        const escapeHtml = window.escapeHtml || escapeHtmlFallback;
        html += `<p><strong>Collection created successfully!</strong></p>`;
        html += '<p>Your collection ID is: <strong>' + escapeHtml(data.collection.id) + '</strong></p>';
        html += '<div style="margin-top: 1rem;">';
        html += `<a href="/library/collections/${encodeURIComponent(data.collection.id)}" class="ldr-btn-collections ldr-btn-collections-primary">`;
        html += '<i class="fas fa-folder-open"></i> View Collection';
        html += '</a>';
        html += `<a href="/library/collections/${encodeURIComponent(data.collection.id)}/upload" class="ldr-btn-collections ldr-btn-collections-secondary" style="margin-left: 1rem;">`;
        html += '<i class="fas fa-plus"></i> Upload Files';
        html += '</a>';
        html += '</div>';
        html += '</div>';
    } else {
        html += '<p><strong>Collection created!</strong></p>';
        html += '<p>You can now start uploading files to organize your documents.</p>';
        html += '<div style="margin-top: 1rem;">';
        html += '<a href="/library/collections" class="ldr-btn-collections ldr-btn-collections-primary">';
        html += '<i class="fas fa-folder-open"></i> View All Collections';
        html += '</a>';
        html += '<button onclick="window.location.href=\'/library/collections/create\'" class="ldr-btn-collections ldr-btn-collections-secondary" style="margin-left: 1rem;">';
        html += '<i class="fas fa-plus"></i> Create Another Collection';
        html += '</button>';
        html += '</div>';
    }

    html += '</div>';

    // bearer:disable javascript_lang_dangerous_insert_html
    // eslint-disable-next-line no-unsanitized/property -- audited 2026-03-28: variable built from escaped/numeric values above
    resultsDiv.innerHTML = html;
    resultsDiv.style.display = 'block';
}

/**
 * Show error message
 */
function showError(message) {
    const resultsDiv = document.getElementById('create-results');
    const escapeHtml = window.escapeHtml || escapeHtmlFallback;
    const html = `
        <div class="ldr-alert ldr-alert-danger" style="padding: 1rem; border-radius: 8px; margin-bottom: 1rem;">
            <h4 style="margin: 0 0 0.5rem 0;"><i class="fas fa-exclamation-triangle"></i> Creation Error</h4>
            <p>${escapeHtml(message)}</p>
            <div style="margin-top: 1rem;">
                <a href="/library/collections" class="ldr-btn-collections ldr-btn-collections-primary">Back to Collections</a>
            </div>
        </div>
    `;

    // bearer:disable javascript_lang_dangerous_insert_html
    resultsDiv.innerHTML = html;
    resultsDiv.style.display = 'block';
}
