home-frontend/src/js/modules/testimonials.js

export async function initTestimonials() {
    const row1 = document.getElementById('marquee-row-1');
    const row2 = document.getElementById('marquee-row-2');
    if (!row1 || !row2) return;

    try {
        const res = await fetch('src/data/reviews.json');
        if (!res.ok) throw new Error();
        const reviews = await res.json();

        const makeCard = (r) => `
            <article class="testimonial-card">
                <div class="testimonial-user">
                    <img class="testimonial-avatar" src="${r.avatarSmall || r.avatar}" alt="${r.name}" width="44" height="44" loading="lazy" decoding="async">
                    <div class="testimonial-info">
                        <span class="testimonial-name">${r.name}</span>
                        <span class="testimonial-handle">${r.handle}</span>
                    </div>
                </div>
                <p class="testimonial-text">${r.text}</p>
            </article>
        `;

        const half = Math.ceil(reviews.length / 2);
        const set1 = reviews.slice(0, half);
        const set2 = reviews.slice(half);

        const buildLoop = (items) => {
            const batch = items.map(makeCard).join('');
            return batch.repeat(4);
        };

        row1.innerHTML = buildLoop(set1.length ? set1 : reviews);
        row2.innerHTML = buildLoop(set2.length ? set2 : reviews);
    } catch { }
}