Rockbox open source high quality audio player as a Music Player Daemon
mpris rockbox mpd libadwaita audio rust zig deno
2
fork

Configure Feed

Select the types of activity you want to include in your feed.

webui: fix infinite AlbumDetails re-render

+17 -11
+17 -11
webui/rockbox/src/Components/AlbumDetails/AlbumDetailsWithData.tsx
··· 1 - import { FC, useEffect, useState } from "react"; 1 + import { FC, useEffect, useMemo, useState } from "react"; 2 2 import AlbumDetails from "./AlbumDetails"; 3 3 import { useNavigate, useParams } from "react-router-dom"; 4 4 import { useGetAlbumQuery } from "../../Hooks/GraphQL"; ··· 16 16 id: id!, 17 17 }, 18 18 }); 19 - const album = data 20 - ? { 21 - ...data.album!, 22 - albumArt: data.album?.albumArt 23 - ? `http://localhost:6062/covers/${data.album?.albumArt}` 24 - : "", 25 - } 26 - : null; 19 + 20 + const album = useMemo( 21 + () => 22 + data 23 + ? { 24 + ...data.album!, 25 + albumArt: data.album?.albumArt 26 + ? `http://localhost:6062/covers/${data.album?.albumArt}` 27 + : "", 28 + } 29 + : null, 30 + [data] 31 + ); 32 + 27 33 useEffect(() => { 28 34 if (loading || !album) { 29 35 return; ··· 48 54 }, [id]); 49 55 50 56 useEffect(() => { 51 - if (loading || !tracks.length) { 57 + if (!tracks.length) { 52 58 return; 53 59 } 54 60 getVolumes(); 55 61 // eslint-disable-next-line react-hooks/exhaustive-deps 56 - }, [tracks, loading]); 62 + }, [tracks]); 57 63 58 64 function getVolumes() { 59 65 if (!tracks.some((track) => track.discnum === 2)) {