apricote/Listory
1
0
Fork 0
mirror of https://github.com/apricote/Listory.git synced 2026-02-06 17:57:03 +00:00
Code Issues Projects Releases Packages Wiki Activity

feat(frontend): add visual indicator to top lists

Browse source
This commit is contained in:
Julian Tölle 2021-05-22 17:32:20 +02:00
parent 3228b22741
commit 8377b2f6d0
6 changed files with 79 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

9
frontend/src/components/ReportTopArtists.tsx
View file

@ -4,6 +4,7 @@ import { TimeOptions } from "../api/entities/time-options";
import { TimePreset } from "../api/entities/time-preset.enum";
import { useTopArtists } from "../hooks/use-api";
import { useAuth } from "../hooks/use-auth";
import { getMaxCount } from "../util/getMaxCount";
import { ReportTimeOptions } from "./ReportTimeOptions";
import { TopListItem } from "./TopListItem";
@ -26,6 +27,7 @@ export const ReportTopArtists: React.FC = () => {
const { topArtists, isLoading } = useTopArtists(options);
const reportHasItems = !isLoading && topArtists.length !== 0;
const maxCount = getMaxCount(topArtists);
if (!user) {
return <Redirect to="/" />;
@ -54,7 +56,12 @@ export const ReportTopArtists: React.FC = () => {
)}
{reportHasItems &&
topArtists.map(({ artist, count }) => (
<TopListItem key={artist.id} title={artist.name} count={count} />
<TopListItem
key={artist.id}
title={artist.name}
count={count}
maxCount={maxCount}
/>
))}
</div>
</div>