Signed-off-by: Matt Bruce <mbrucedogs@gmail.com>

This commit is contained in:
Matt Bruce 2025-07-19 13:51:00 -05:00
parent 80069be722
commit cbbfc1a798
4 changed files with 78 additions and 8 deletions

View File

@ -6,6 +6,7 @@ import { useSongLists } from '../../hooks';
import { useAppSelector } from '../../redux';
import { selectSongList } from '../../redux';
import type { SongListSong, SongList, Song } from '../../types';
import { debugLog } from '../../utils/logger';
const SongLists: React.FC = () => {
const {
@ -143,7 +144,7 @@ const SongLists: React.FC = () => {
);
} else {
// Unavailable songs get a simple item
console.log('Non-accordion item:', {
debugLog('Non-accordion item:', {
title: songListSong.title,
artist: songListSong.artist,
index: index + 1

View File

@ -3,6 +3,7 @@ import { disabledSongsService } from '../firebase/services';
import { useAppSelector } from '../redux';
import { selectControllerName } from '../redux';
import { useToast } from './useToast';
import { debugLog } from '../utils/logger';
import type { Song, DisabledSong } from '../types';
export const useDisabledSongs = () => {
@ -19,9 +20,17 @@ export const useDisabledSongs = () => {
const loadDisabledSongs = async () => {
try {
setLoading(true);
debugLog('useDisabledSongs - loading disabled songs for controller:', controllerName);
const songs = await disabledSongsService.getDisabledSongs(controllerName);
const paths = await disabledSongsService.getDisabledSongPaths(controllerName);
debugLog('useDisabledSongs - loaded disabled songs:', {
songsCount: Object.keys(songs).length,
pathsCount: paths.size,
paths: Array.from(paths)
});
setDisabledSongs(songs);
setDisabledSongPaths(paths);
} catch (error) {
@ -39,6 +48,11 @@ export const useDisabledSongs = () => {
controllerName,
(songs) => {
try {
debugLog('useDisabledSongs - subscription update:', {
songsCount: Object.keys(songs).length,
songs: Object.values(songs).map((song: DisabledSong) => song.path)
});
setDisabledSongs(songs);
setDisabledSongPaths(new Set(Object.values(songs).map((song: DisabledSong) => song.path)));
} catch (error) {
@ -53,6 +67,13 @@ export const useDisabledSongs = () => {
// Check if a song is disabled
const isSongDisabled = useCallback((song: Song): boolean => {
const isDisabled = disabledSongPaths.has(song.path);
debugLog('isSongDisabled check:', {
songTitle: song.title,
songPath: song.path,
isDisabled,
disabledSongPathsSize: disabledSongPaths.size,
disabledSongPaths: Array.from(disabledSongPaths)
});
return isDisabled;
}, [disabledSongPaths]);

View File

@ -5,6 +5,7 @@ import { useToast } from './useToast';
import { useDisabledSongs } from './useDisabledSongs';
import { UI_CONSTANTS } from '../constants';
import { filterSongs } from '../utils/dataProcessing';
import { debugLog } from '../utils/logger';
import type { Song } from '../types';
const ITEMS_PER_PAGE = 20;
@ -14,21 +15,51 @@ export const useSearch = () => {
const [currentPage, setCurrentPage] = useState(1);
const { addToQueue, toggleFavorite } = useSongOperations();
const { showSuccess, showError } = useToast();
const { disabledSongPaths, addDisabledSong, removeDisabledSong, isSongDisabled } = useDisabledSongs();
const { disabledSongPaths, addDisabledSong, removeDisabledSong, isSongDisabled, loading: disabledSongsLoading } = useDisabledSongs();
// Get all songs from Redux (this is memoized)
const allSongs = useAppSelector(selectSongsArray);
// Debug logging
debugLog('useSearch - debug:', {
allSongsLength: allSongs.length,
disabledSongPathsSize: disabledSongPaths.size,
disabledSongPaths: Array.from(disabledSongPaths),
disabledSongsLoading
});
// Memoize filtered results to prevent unnecessary re-computations
const filteredSongs = useMemo(() => {
if (!searchTerm.trim() || searchTerm.length < UI_CONSTANTS.SEARCH.MIN_SEARCH_LENGTH) {
// If no search term, return all songs except disabled ones
return allSongs.filter(song => !isSongDisabled(song));
// Don't return any results if disabled songs are still loading
if (disabledSongsLoading) {
debugLog('useSearch - disabled songs still loading, returning empty array');
return [];
}
// Apply both search filter and disabled songs filter
return filterSongs(allSongs, searchTerm, disabledSongPaths);
}, [allSongs, searchTerm, disabledSongPaths, isSongDisabled]);
// Filter out disabled songs first
const songsWithoutDisabled = allSongs.filter(song => !disabledSongPaths.has(song.path));
debugLog('useSearch - filtering songs:', {
totalSongs: allSongs.length,
afterDisabledFilter: songsWithoutDisabled.length,
searchTerm
});
if (!searchTerm.trim() || searchTerm.length < UI_CONSTANTS.SEARCH.MIN_SEARCH_LENGTH) {
// If no search term, return all songs (disabled ones already filtered out)
debugLog('useSearch - no search term, returning songs without disabled:', songsWithoutDisabled.length);
return songsWithoutDisabled;
}
// Apply search filter to songs without disabled ones
const filtered = filterSongs(songsWithoutDisabled, searchTerm);
debugLog('useSearch - with search term, filtered songs:', {
before: songsWithoutDisabled.length,
after: filtered.length,
searchTerm
});
return filtered;
}, [allSongs, searchTerm, disabledSongPaths, disabledSongsLoading]);
// Paginate the filtered results - show all items up to current page
const searchResults = useMemo(() => {

View File

@ -23,6 +23,7 @@ import {
limitArray
} from '../utils/dataProcessing';
import { UI_CONSTANTS } from '../constants';
import { debugLog } from '../utils/logger';
// Enhanced selectors with data processing
export const selectSongsArray = createSelector(
@ -33,7 +34,23 @@ export const selectSongsArray = createSelector(
// Selector that filters songs and excludes disabled ones
export const selectSongsArrayWithoutDisabled = createSelector(
[selectSongsArray, (_state: RootState, disabledSongPaths: Set<string>) => disabledSongPaths],
(songs, disabledSongPaths) => songs.filter(song => !disabledSongPaths.has(song.path))
(songs, disabledSongPaths) => {
debugLog('selectSongsArrayWithoutDisabled called:', {
songsLength: songs.length,
disabledSongPathsSize: disabledSongPaths.size,
disabledSongPaths: Array.from(disabledSongPaths)
});
const filtered = songs.filter(song => !disabledSongPaths.has(song.path));
debugLog('selectSongsArrayWithoutDisabled result:', {
before: songs.length,
after: filtered.length,
filteredCount: songs.length - filtered.length
});
return filtered;
}
);
export const selectFilteredSongs = createSelector(