XF 2.3 Widget displays prefix but not thread title

kittycaticus

New member
I'm working on this widget. It correctly links to threads that meet the conditions, however it only displays the Prefix (correctly with formatting), not the thread title. Any ideas what I'm doing wrong? I want it to display the prefix and the thread title, linked to the thread.

Code:
<div id="rp-open-threads">
    <ul class="rp-thread-list">
        <li class="rp-loading">Loading open threads…</li>
    </ul>
</div>

<script>
(function () {

    const FORUM_URL = '/forums/9/';
    const list = document.querySelector('#rp-open-threads .rp-thread-list');
    if (!list) return;

    fetch(FORUM_URL, { credentials: 'same-origin' })
        .then(r => r.text())
        .then(html => {

            list.innerHTML = '';

            const doc = new DOMParser().parseFromString(html, 'text/html');
            const threads = doc.querySelectorAll('.structItem--thread');

            threads.forEach(thread => {

                const titleLink = thread.querySelector('.structItem-title a');
                const prefixEl  = thread.querySelector('.label');
                const replyEl   = thread.querySelector('.structItem-cell--meta dd');

                if (!titleLink || !replyEl) return;

                const replies = parseInt(replyEl.textContent.trim(), 10) || 0;
                const prefixText = prefixEl ? prefixEl.textContent.trim() : '';

                const allowed =
                    (prefixText === '1v1' && replies === 0) ||
                    (prefixText === '1vM' && replies <= 2);

                if (!allowed) return;

                const li = document.createElement('li');
                const a  = document.createElement('a');
                a.href = titleLink.href;

                // Native prefix (once)
                if (prefixEl) {
                    a.appendChild(prefixEl.cloneNode(true));
                    a.appendChild(document.createTextNode(' '));
                }

                //  Canonical title
                const cleanTitle =
                    titleLink.getAttribute('title') ||
                    titleLink.textContent.replace(prefixText, '').trim();

                a.appendChild(document.createTextNode(cleanTitle));

                li.appendChild(a);
                list.appendChild(li);
            });

            if (!list.children.length) {
                list.innerHTML = '<li class="rp-empty">Sorry, there are no open threads right now.</li>';
            }
        })
        .catch(err => {
            console.error(err);
            list.innerHTML = '<li class="rp-error">Unable to load threads.</li>';
        });

})();
</script>
 
Back
Top Bottom