auto reload site stats
All checks were successful
Deploy Website / docker (ubuntu-latest) (push) Successful in 2m23s

This commit is contained in:
Lee 2024-10-27 19:30:58 +00:00
parent b83fb6f3a8
commit 6c81316364
2 changed files with 43 additions and 11 deletions

@ -1,9 +1,9 @@
import { Button } from "@/components/ui/button";
import Link from "next/link";
import { AppStatistics } from "@ssr/common/types/backend/app-statistics";
import Statistic from "@/components/home/statistic";
import { kyFetch } from "@ssr/common/utils/utils";
import { Config } from "@ssr/common/config";
import { AppStats } from "@/components/app-statistics";
export const dynamic = "force-dynamic"; // Always generate the page on load
@ -21,16 +21,7 @@ export default async function HomePage() {
<p>ScoreSaber Reloaded is a website that allows you to track your ScoreSaber data over time.</p>
</div>
{statistics && (
<div className="flex items-center flex-col">
<p className="font-semibold">Site Statistics</p>
<Statistic title="Tracked Players" value={statistics.trackedPlayers} />
<Statistic title="Tracked Scores" value={statistics.trackedScores} />
<Statistic title="Additional Scores Data" value={statistics.additionalScoresData} />
<Statistic title="Cached BeatSaver Maps" value={statistics.cachedBeatSaverMaps} />
<Statistic title="Cached ScoreSaber Leaderboards" value={statistics.cachedScoreSaberLeaderboards} />
</div>
)}
{statistics && <AppStats initialStatistics={statistics} />}
<div className="flex gap-2 flex-wrap">
<Link href="/search">

@ -0,0 +1,41 @@
"use client";
import Statistic from "@/components/home/statistic";
import { AppStatistics } from "@ssr/common/types/backend/app-statistics";
import { useQuery } from "@tanstack/react-query";
import { kyFetch } from "@ssr/common/utils/utils";
import { Config } from "@ssr/common/config";
import { useEffect, useState } from "react";
type AppStatisticsProps = {
/**
* The app statistics.
*/
initialStatistics: AppStatistics;
};
export function AppStats({ initialStatistics }: AppStatisticsProps) {
const [statistics, setStatistics] = useState(initialStatistics);
const { data } = useQuery({
queryKey: ["app-statistics"],
queryFn: () => kyFetch<AppStatistics>(Config.apiUrl + "/statistics"),
});
useEffect(() => {
if (data) {
setStatistics(data);
}
}, [data]);
return (
<div className="flex items-center flex-col">
<p className="font-semibold">Site Statistics</p>
<Statistic title="Tracked Players" value={statistics.trackedPlayers} />
<Statistic title="Tracked Scores" value={statistics.trackedScores} />
<Statistic title="Additional Scores Data" value={statistics.additionalScoresData} />
<Statistic title="Cached BeatSaver Maps" value={statistics.cachedBeatSaverMaps} />
<Statistic title="Cached ScoreSaber Leaderboards" value={statistics.cachedScoreSaberLeaderboards} />
</div>
);
}