Fascinated/scoresaber-reloaded-v2
1
2
Fork 0
Code Issues 1 Pull Requests 10 Actions Activity

feat(ssr): server side render some things to speed up page loads
All checks were successful
deploy / deploy (push) Successful in 1m12s
Details

Browse Source
This commit is contained in:
Lee
2023-11-08 07:41:07 +00:00
parent 3a6312510a
commit c251239e45
11 changed files with 344 additions and 321 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
src/app/ranking/country/[country]/[page]/page.tsx
View File

@ -1,4 +1,8 @@
import Card from "@/components/Card";
import Container from "@/components/Container";
import Error from "@/components/Error";
import GlobalRanking from "@/components/GlobalRanking";
import { ScoreSaberAPI } from "@/utils/scoresaber/api";
import { Metadata } from "next";
export const metadata: Metadata = {
@ -9,6 +13,43 @@ type Props = {
params: { page: string; country: string };
};
export default function RankingGlobal({ params: { page, country } }: Props) {
return <GlobalRanking page={Number(page)} country={country} />;
async function getData(page: number, country: string) {
const response = await ScoreSaberAPI.fetchTopPlayers(page, country);
return {
data: response,
};
}
export default async function RankingGlobal({
params: { page, country },
}: Props) {
const { data } = await getData(Number(page), country);
if (!data) {
return (
<main>
<Container>
<Card outerClassName="mt-2" className="mt-2">
<div className="p-3 text-center">
<div role="status">
<div className="flex flex-col items-center justify-center gap-2">
<Error errorMessage="Unable to find this page or country" />
</div>
</div>
</div>
</Card>
</Container>
</main>
);
}
return (
<GlobalRanking
pageInfo={{
page: Number(page),
totalPages: data.pageInfo.totalPages,
}}
players={data.players}
country={country}
/>
);
}

42
src/app/ranking/global/[page]/page.tsx
View File

@ -1,4 +1,8 @@
import Card from "@/components/Card";
import Container from "@/components/Container";
import Error from "@/components/Error";
import GlobalRanking from "@/components/GlobalRanking";
import { ScoreSaberAPI } from "@/utils/scoresaber/api";
import { Metadata } from "next";
export const metadata: Metadata = {
@ -9,6 +13,40 @@ type Props = {
params: { page: string };
};
export default function RankingGlobal({ params: { page } }: Props) {
return <GlobalRanking page={Number(page)} />;
async function getData(page: number) {
const response = await ScoreSaberAPI.fetchTopPlayers(page);
return {
data: response,
};
}
export default async function RankingGlobal({ params: { page } }: Props) {
const { data } = await getData(Number(page));
if (!data) {
return (
<main>
<Container>
<Card outerClassName="mt-2" className="mt-2">
<div className="p-3 text-center">
<div role="status">
<div className="flex flex-col items-center justify-center gap-2">
<Error errorMessage="Unable to find this page" />
</div>
</div>
</div>
</Card>
</Container>
</main>
);
}
return (
<GlobalRanking
pageInfo={{
page: Number(page),
totalPages: data.pageInfo.totalPages,
}}
players={data.players}
/>
);
}