From 01e417ed08a8327169e6488a557c46b6a7b97a08 Mon Sep 17 00:00:00 2001 From: Pinapelz Date: Sun, 7 Jun 2026 21:25:28 -0700 Subject: bundle song list statically, improve search time --- playlist_generator/.gitignore | 2 ++ server/index.ts | 4 ---- src/components/Search/index.tsx | 27 +++++++-------------- src/helpers/fetchSongs.ts | 52 ----------------------------------------- src/helpers/searchSong.ts | 27 ++++++++++----------- 5 files changed, 24 insertions(+), 88 deletions(-) delete mode 100644 src/helpers/fetchSongs.ts diff --git a/playlist_generator/.gitignore b/playlist_generator/.gitignore index 0fda121..d40a36b 100644 --- a/playlist_generator/.gitignore +++ b/playlist_generator/.gitignore @@ -221,3 +221,5 @@ __marimo__/ venvw *.json *.mp3 +*.ts +todo.txt diff --git a/server/index.ts b/server/index.ts index c1ab788..cdc57d5 100644 --- a/server/index.ts +++ b/server/index.ts @@ -1,7 +1,6 @@ import express from "express"; import cors from "cors"; import dotenv from "dotenv"; -import { songs } from "./data/songs"; import { dailyRouter } from "./daily"; import { selectRouter } from "./select"; @@ -16,8 +15,5 @@ const SERVER_PORT = process.env.SERVER_PORT || 3001; app.use(dailyRouter); app.use(selectRouter); -app.get("/songs", (_req, res) => { - res.json(songs.map(({ artist, name }) => ({ artist, name }))); -}); app.listen(SERVER_PORT, () => console.log(`Server running on :${SERVER_PORT}`)); diff --git a/src/components/Search/index.tsx b/src/components/Search/index.tsx index 7f9d502..4d1ae83 100644 --- a/src/components/Search/index.tsx +++ b/src/components/Search/index.tsx @@ -11,30 +11,18 @@ interface Props { } export function Search({ currentTry, setSelectedSong }: Props) { - const [value, setValue] = React.useState(""); + const [value, setValue] = React.useState(""); const [results, setResults] = React.useState([]); React.useEffect(() => { - let cancelled = false; - - async function runSearch() { - if (!value) { - setResults([]); - return; - } - const songs = await searchSong(value); - - if (!cancelled) { - setResults(songs); - } + if (!value.trim()) { + setResults([]); + return; } - runSearch(); - return () => { - cancelled = true; - }; + + setResults(searchSong(value)); }, [value]); - // clear value on selection React.useEffect(() => { setValue(""); }, [currentTry]); @@ -57,13 +45,14 @@ export function Search({ currentTry, setSelectedSong }: Props) { ))} + setValue(e.currentTarget.value)} placeholder="Search" - value={value} /> diff --git a/src/helpers/fetchSongs.ts b/src/helpers/fetchSongs.ts deleted file mode 100644 index f2d91a2..0000000 --- a/src/helpers/fetchSongs.ts +++ /dev/null @@ -1,52 +0,0 @@ -import { Song } from "../types/song"; -let cachedSongs: Song[] | null = null; -function fuzzyMatch(input: string): string { - return input.toLowerCase().replace(/[^0-9a-z ]/gi, ''); -} - - -export async function fetchSongs(useCache=true): Promise { - const API_URL = import.meta.env.VITE_HEARDLE_API_URL || "http://localhost:3001"; - if (useCache && cachedSongs) { - return cachedSongs; - } - - try { - const response = await fetch(`${API_URL}/songs`); - if (!response.ok) { - throw new Error(`HTTP error! status: ${response.status}`); - } - const songsData: Song[] = await response.json(); - cachedSongs = songsData; - return songsData; - } catch (error) { - console.error("Failed to fetch songs:", error); - throw error; - } -} - -export async function searchSongs(searchTerm: string): Promise { - const songsToSearch = await fetchSongs(); - - const processedSearchTerm = fuzzyMatch(searchTerm); - - const matchingSongs = songsToSearch - .filter((song: Song) => { - const songName = fuzzyMatch(song.name); - const songArtist = fuzzyMatch(song.artist); - - if (songArtist.includes(processedSearchTerm) || songName.includes(processedSearchTerm)) { - return true; - } - return false; - }) - .sort((a, b) => - a.artist.toLowerCase().localeCompare(b.artist.toLocaleLowerCase()) - || a.name.toLowerCase().localeCompare(b.name.toLocaleLowerCase()) - ); - - return matchingSongs; -} -export function getCachedSongs(): Song[] | null { - return cachedSongs; -} diff --git a/src/helpers/searchSong.ts b/src/helpers/searchSong.ts index 9ce36cf..62091b6 100644 --- a/src/helpers/searchSong.ts +++ b/src/helpers/searchSong.ts @@ -1,25 +1,26 @@ -import { fetchSongs } from "./fetchSongs"; +import { songs } from "../../server/data/songs"; import { Song } from "../types/song"; -export async function searchSong(searchTerm: string): Promise { - function fuzzyMatch(input: string){ - return input.toLowerCase().replace(/[^0-9a-z ]/gi, ''); - } - searchTerm = fuzzyMatch(searchTerm); +function fuzzyMatch(input: string): string { + return input.toLowerCase().replace(/[^0-9a-z ]/gi, ""); +} - const songs = await fetchSongs(); +export function searchSong(searchTerm: string): Song[] { + const normalizedSearch = fuzzyMatch(searchTerm); return songs .filter((song: Song) => { const songName = fuzzyMatch(song.name); const songArtist = fuzzyMatch(song.artist); - if (songArtist.includes(searchTerm) || songName.includes(searchTerm)) { - return song; - } + return ( + songArtist.includes(normalizedSearch) || + songName.includes(normalizedSearch) + ); }) - .sort((a, b) => - a.artist.toLowerCase().localeCompare(b.artist.toLocaleLowerCase()) - || a.name.toLowerCase().localeCompare(b.name.toLocaleLowerCase()) + .sort( + (a, b) => + a.artist.toLowerCase().localeCompare(b.artist.toLowerCase()) || + a.name.toLowerCase().localeCompare(b.name.toLowerCase()) ); } -- cgit v1.2.3