feat: config to gate all statistics behind login (#99)

* feat: gate all stats behind login

* docs: add config reference for login gate
This commit is contained in:
Gabe Farrell 2025-11-20 22:50:15 -05:00 committed by GitHub
parent c77481fd59
commit daa1bb2456
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 192 additions and 128 deletions

View file

@ -1,43 +1,50 @@
import { useQuery } from "@tanstack/react-query"
import ArtistLinks from "./ArtistLinks"
import { getTopArtists, imageUrl, type getItemsArgs } from "api/api"
import { Link } from "react-router"
import TopListSkeleton from "./skeletons/TopListSkeleton"
import TopItemList from "./TopItemList"
import { useQuery } from "@tanstack/react-query";
import ArtistLinks from "./ArtistLinks";
import { getTopArtists, imageUrl, type getItemsArgs } from "api/api";
import { Link } from "react-router";
import TopListSkeleton from "./skeletons/TopListSkeleton";
import TopItemList from "./TopItemList";
interface Props {
limit: number,
period: string,
artistId?: Number
albumId?: Number
limit: number;
period: string;
artistId?: Number;
albumId?: Number;
}
export default function TopArtists (props: Props) {
const { isPending, isError, data, error } = useQuery({
queryKey: ['top-artists', {limit: props.limit, period: props.period, page: 0 }],
queryFn: ({ queryKey }) => getTopArtists(queryKey[1] as getItemsArgs),
})
if (isPending) {
return (
<div className="w-[300px]">
<h2>Top Artists</h2>
<p>Loading...</p>
</div>
)
}
if (isError) {
return <p className="error">Error:{error.message}</p>
}
export default function TopArtists(props: Props) {
const { isPending, isError, data, error } = useQuery({
queryKey: [
"top-artists",
{ limit: props.limit, period: props.period, page: 0 },
],
queryFn: ({ queryKey }) => getTopArtists(queryKey[1] as getItemsArgs),
});
if (isPending) {
return (
<div>
<h2 className="hover:underline"><Link to={`/chart/top-artists?period=${props.period}`}>Top Artists</Link></h2>
<div className="max-w-[300px]">
<TopItemList type="artist" data={data} />
{data.items.length < 1 ? 'Nothing to show' : ''}
</div>
</div>
)
}
<div className="w-[300px]">
<h2>Top Artists</h2>
<p>Loading...</p>
</div>
);
}
if (isError) {
return <p className="error">Error:{error.message}</p>;
}
if (!data.items) return;
return (
<div>
<h2 className="hover:underline">
<Link to={`/chart/top-artists?period=${props.period}`}>
Top Artists
</Link>
</h2>
<div className="max-w-[300px]">
<TopItemList type="artist" data={data} />
{data.items.length < 1 ? "Nothing to show" : ""}
</div>
</div>
);
}