document.addEventListener('DOMContentLoaded', () => {
    const textsList = document.getElementById('texts-list');
    const form = document.getElementById('texts-form');

    async function loadTexts() {
        const res = await fetch('/api/texts');
        const texts = await res.json();
        textsList.innerHTML = texts.map(text =>
            '<li><a href=/admin/texts/'
                + text.id
                + '>'
                + text.name
                + '</a></li>').join('');
    }

    form.addEventListener('submit', async (e) => {
        e.preventDefault();
        const formData = new FormData(form);
        const res = await fetch('/api/texts', {
            method: 'POST',
            body: formData,
        });
        if (res.ok) {
            const text = await res.json();
            const li = document.createElement('li');
            const a = document.createElement('a');
            a.href = '/admin/texts/' + text.id;
            a.textContent = text.name;
            li.appendChild(a);
            textsList.appendChild(li);
            form.reset();
        }
    });

    loadTexts();
});