let podcasts = [];
        let defaultRadioFilter = '';
        let selectedPodcasts = [];

        async function fetchDefaultRadioFilter() {
            const response = await fetch('/api/podcasts/default-radio');
            if (!response.ok) {
                console.error('Failed to load default radio filter');
                return;
            }
            const data = await response.json();
            defaultRadioFilter = data.defaultRadio;
        }

        async function fetchUniqueRadios() {
            const response = await fetch('/api/podcasts/radios');
            if (!response.ok) {
                console.error('Failed to load unique radios');
                return;
            }
            return await response.json();
        }

        async function fetchCombinedPodcasts() {
            const response = await fetch('/api/podcasts/combined-podcasts');
            if (!response.ok) {
                console.error('Failed to load combined podcasts');
                return;
            }
            return await response.json();
        }

        function sortPodcasts(podcastsArray) {
            podcastsArray.sort((a, b) => new Date(b.pubDate) - new Date(a.pubDate));

            const matchedGroups = new Map();
            podcastsArray.forEach(podcast => {
                if (podcast.color === 'green') {
                    const pubDate = podcast.pubDate;
                    if (!matchedGroups.has(pubDate)) {
                        matchedGroups.set(pubDate, []);
                    }
                    matchedGroups.get(pubDate).push(podcast);
                }
            });

            const sortedPodcasts = [];
            podcastsArray.forEach(podcast => {
                if (podcast.color === 'green') {
                    const pubDate = podcast.pubDate;
                    if (matchedGroups.has(pubDate)) {
                        sortedPodcasts.push(...matchedGroups.get(pubDate));
                        matchedGroups.delete(pubDate);
                    }
                } else {
                    sortedPodcasts.push(podcast);
                }
            });

            return sortedPodcasts;
        }

        async function fetchAndDisplayPodcasts() {
            try {
                await fetchDefaultRadioFilter();
                podcasts = await fetchCombinedPodcasts();
                podcasts = sortPodcasts(podcasts);
                renderPodcasts(podcasts);
                const radios = await fetchUniqueRadios();
                populateRadioFilter(radios);
                if (defaultRadioFilter) {
                    document.getElementById('radio-filter').value = defaultRadioFilter;
                    filterPodcastsByRadio(defaultRadioFilter);
                }
            } catch (error) {
                alert("Failed to load podcasts. Please try again later.");
                console.error("Error in fetchAndDisplayPodcasts:", error);
            }
        }

        function renderPodcasts(podcastsToRender) {
            const tbody = document.getElementById('podcast-list');
            tbody.innerHTML = '';
            podcastsToRender.forEach(podcast => {
                const tr = document.createElement('tr');

                // Apply color class
                if (podcast.color === 'green') {
                    tr.classList.add('green');
                } else if (podcast.color === 'red') {
                    tr.classList.add('red');
                }

                const titleLink = podcast.link ? `<a href="${podcast.link}" target="_blank">${podcast.title || ''}</a>` : podcast.title || '';
                const format = podcast.format || '';
                const length = podcast.length || '';
                const radio = podcast.source === 'radiocorax.de' ? 'Radio Corax, Halle' : (podcast.radio || '');
                const pubDate = podcast.pubDate || 'Unknown Date';

                tr.dataset.link = podcast.link;
                tr.onclick = () => selectPodcast(tr);

                tr.innerHTML = `
                    <td>${titleLink}</td>
                    <td>${format}</td>
                    <td class="length-cell">${length}</td>
                    <td>${radio}</td>
                    <td>${pubDate}</td>
                `;
                tbody.appendChild(tr);
            });
        }


        function selectPodcast(row) {
            const podcastLink = row.dataset.link;
            if (selectedPodcasts.includes(podcastLink)) {
                row.classList.remove('selected');
                selectedPodcasts = selectedPodcasts.filter(link => link !== podcastLink);
            } else {
                if (selectedPodcasts.length < 2) {
                    row.classList.add('selected');
                    selectedPodcasts.push(podcastLink);
                }
            }

            const linkButton = document.getElementById('link-selected-button');
            linkButton.disabled = selectedPodcasts.length !== 2;
        }

        function populateRadioFilter(radios) {
            const radioFilter = document.getElementById('radio-filter');
            radios.forEach(radio => {
                const option = document.createElement('option');
                option.value = radio;
                option.textContent = radio;
                radioFilter.appendChild(option);
            });
            radioFilter.addEventListener('change', function() {
                const selectedRadio = this.value;
                filterPodcastsByRadio(selectedRadio);
            });
        }

        function filterPodcastsByRadio(radio) {
            let filteredPodcasts = podcasts; // Use the global podcasts array
            if (radio) {
                filteredPodcasts = podcasts.filter(podcast => {
                    const podcastRadio = podcast.source === 'radiocorax.de' ? 'Radio Corax, Halle' : (podcast.radio || '');
                    return podcastRadio === radio;
                });
            }
            renderPodcasts(sortPodcasts(filteredPodcasts));
        }

        async function linkSelectedPodcasts() {
            if (selectedPodcasts.length !== 2) {
                alert('Please select exactly two podcasts to link.');
                return;
            }

            const linkButton = document.getElementById('link-selected-button');
            linkButton.disabled = true;
            linkButton.textContent = 'Linking...'; // Show loading state

            // Store the current radio filter value
            const radioFilter = document.getElementById('radio-filter').value;

            try {
                const response = await fetch('/api/podcasts/link', {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                    },
                    body: JSON.stringify({
                        entryId1: selectedPodcasts[0],
                        entryId2: selectedPodcasts[1],
                    }),
                });

                if (response.ok) {
                    // Update the UI locally
                    podcasts = podcasts.map(podcast => {
                        if (selectedPodcasts.includes(podcast.link)) {
                            return { ...podcast, color: 'green' }; // Mark as linked
                        }
                        return podcast;
                    });

                    // Clear selections
                    selectedPodcasts = [];
                    document.querySelectorAll('.selected').forEach(row => {
                        row.classList.remove('selected');
                    });

                    // Reapply the radio filter if it was set
                    if (radioFilter) {
                        filterPodcastsByRadio(radioFilter);
                    } else {
                        // If no filter is applied, render all podcasts
                        renderPodcasts(sortPodcasts(podcasts));
                    }

                    alert('Podcasts linked successfully!');
                } else {
                    alert('Failed to link podcasts.');
                }
            } catch (error) {
                console.error('Error linking podcasts:', error);
                alert('An error occurred while linking podcasts.');
            } finally {
                // Reset the button state
                linkButton.disabled = false;
                linkButton.textContent = 'Link Selected';
            }
        }

        document.addEventListener('DOMContentLoaded', () => {
            fetchAndDisplayPodcasts();
            document.getElementById('link-selected-button').onclick = linkSelectedPodcasts;
        });