diff --git a/front/API.ts b/front/API.ts index 64c2e6d..80e2298 100644 --- a/front/API.ts +++ b/front/API.ts @@ -705,6 +705,7 @@ export default class API { public static searchSongs(query: searchProps): Query { const queryParams: string[] = []; + if (query.query) queryParams.push(`q=${encodeURIComponent(query.query)}`); if (query.artist) queryParams.push(`artistId=${query.artist}`); if (query.genre) queryParams.push(`genreId=${query.genre}`); @@ -715,13 +716,13 @@ export default class API { exec: () => { return API.fetch( { - route: `/search/songs/${query.query}${queryString}`, + route: `/search/songs${queryString}`, }, { handler: ListHandler(SongHandler) } ); }, }; - } + } public static getPartitionMelodyUrl(songId: number): string { return `${API.baseUrl}/song/${songId}/assets/melody`; diff --git a/front/components/V2/SearchBar.tsx b/front/components/V2/SearchBar.tsx index 1ccf789..2979d7b 100644 --- a/front/components/V2/SearchBar.tsx +++ b/front/components/V2/SearchBar.tsx @@ -150,7 +150,7 @@ const SearchBarComponent = (props: { onValidate: (searchData: searchProps) => vo props.onValidate({ artist: artist.id, genre: - genresQuery.data?.find((g) => g.name === genre) + genresQuery.data?.find((a) => a.name === genre) ?.id ?? undefined, query: query, }); @@ -167,6 +167,15 @@ const SearchBarComponent = (props: { onValidate: (searchData: searchProps) => vo accessibilityLabel="Genre" onValueChange={(itemValue) => { setGenre(itemValue); + props.onValidate({ + artist: + artistsQuery.data?.find((a) => a.name === artist)?.id ?? + undefined, + genre: + genresQuery.data?.find((g) => g.name === itemValue)?.id ?? + undefined, + query: query, + }); }} > diff --git a/front/i18n/Translations.ts b/front/i18n/Translations.ts index 6c65c82..5dc903f 100644 --- a/front/i18n/Translations.ts +++ b/front/i18n/Translations.ts @@ -307,7 +307,7 @@ export const en = { leaderBoardHeading: 'These are the best players', leaderBoardHeadingFull: 'The players having the best scores, thanks to their exceptional accuracy, are highlighted here.', - emptySelection: 'None,', + emptySelection: 'None', gamesPlayed: 'Games Played', metronome: 'Metronome', loading: 'Loading... Please Wait', diff --git a/front/views/V2/SearchView.tsx b/front/views/V2/SearchView.tsx index 712060c..d2ebc56 100644 --- a/front/views/V2/SearchView.tsx +++ b/front/views/V2/SearchView.tsx @@ -94,6 +94,7 @@ const SearchView = () => { const artistsQuery = useQuery(API.getAllArtists()); const [searchQuery, setSearchQuery] = React.useState({} as searchProps); const rawResult = useQuery(API.searchSongs(searchQuery), { + enabled: !!searchQuery.query || !!searchQuery.artist || !!searchQuery.genre, onSuccess() { const artist = artistsQuery?.data?.find(({ id }) => id == searchQuery.artist)?.name ?? @@ -142,10 +143,10 @@ const SearchView = () => { } return ( - - setSearchQuery(query)} /> - {result.length != 0 ? : } - + + setSearchQuery(query)} /> + {result.length != 0 ? : } + ); };