feat: Implement game metadata caching to reduce redundant API calls for game details.

This commit is contained in:
code002lover 2025-12-05 11:32:26 +01:00
parent 0a526c0c57
commit b6a31e5eec

View File

@ -12,6 +12,8 @@ export function GameFilter() {
const [people, setPeople] = useState<Person[]>([]); const [people, setPeople] = useState<Person[]>([]);
const [selectedPeople, setSelectedPeople] = useState<Set<string>>(new Set()); const [selectedPeople, setSelectedPeople] = useState<Set<string>>(new Set());
const [filteredGames, setFilteredGames] = useState<string[]>([]); const [filteredGames, setFilteredGames] = useState<string[]>([]);
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const [metaData, _setMetaData] = useState<{ [key: string]: GameProto }>({});
useEffect(() => { useEffect(() => {
apiFetch("/api") apiFetch("/api")
@ -56,11 +58,16 @@ export function GameFilter() {
.filter(([, players]) => players.size === 0) .filter(([, players]) => players.size === 0)
.map(([game]) => game); .map(([game]) => game);
const games = game_titles.map((title) => { const games = game_titles.map(async (title) => {
return apiFetch(`/api/game/${encodeURIComponent(title)}`) if (metaData[title]) {
console.log("returned cached metadata");
return metaData[title];
}
return await apiFetch(`/api/game/${encodeURIComponent(title)}`)
.then((res) => res.arrayBuffer()) .then((res) => res.arrayBuffer())
.then((buffer) => { .then((buffer) => {
const game = GameProto.decode(new Uint8Array(buffer)); const game = GameProto.decode(new Uint8Array(buffer)) as GameProto;
metaData[title] = game;
return game; return game;
}) })
.catch((err) => console.error("Failed to fetch game:", err)); .catch((err) => console.error("Failed to fetch game:", err));
@ -76,7 +83,7 @@ export function GameFilter() {
}); });
setFilteredGames(filteredGames.map((g) => (g as GameProto).title)); setFilteredGames(filteredGames.map((g) => (g as GameProto).title));
}); });
}, [selectedPeople, people]); }, [selectedPeople, people, metaData]);
const togglePerson = (name: string) => { const togglePerson = (name: string) => {
const newSelected = new Set(selectedPeople); const newSelected = new Set(selectedPeople);