diff --git a/next.config.js b/next.config.js index bdf75d2..dca7fa1 100644 --- a/next.config.js +++ b/next.config.js @@ -60,41 +60,41 @@ const nextConfig = { }, }; -// module.exports = withBundleAnalyzer(nextConfig); +module.exports = withBundleAnalyzer(nextConfig); -// // Injected content via Sentry wizard below +// Injected content via Sentry wizard below -// const { withSentryConfig } = require("@sentry/nextjs"); +const { withSentryConfig } = require("@sentry/nextjs"); -// module.exports = withSentryConfig( -// module.exports, -// { -// // For all available options, see: -// // https://github.com/getsentry/sentry-webpack-plugin#options +module.exports = withSentryConfig( + module.exports, + { + // For all available options, see: + // https://github.com/getsentry/sentry-webpack-plugin#options -// // Suppresses source map uploading logs during build -// silent: true, -// org: "sentry", -// project: "scoresaber-reloaded", -// url: "https://sentry.fascinated.cc/", -// }, -// { -// // For all available options, see: -// // https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/ + // Suppresses source map uploading logs during build + silent: true, + org: "sentry", + project: "scoresaber-reloaded", + url: "https://sentry.fascinated.cc/", + }, + { + // For all available options, see: + // https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/ -// // Upload a larger set of source maps for prettier stack traces (increases build time) -// widenClientFileUpload: false, + // Upload a larger set of source maps for prettier stack traces (increases build time) + widenClientFileUpload: false, -// // Transpiles SDK to be compatible with IE11 (increases bundle size) -// transpileClientSDK: false, + // Transpiles SDK to be compatible with IE11 (increases bundle size) + transpileClientSDK: false, -// // Routes browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers (increases server load) -// tunnelRoute: "/monitoring", + // Routes browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers (increases server load) + tunnelRoute: "/monitoring", -// // Hides source maps from generated client bundles -// hideSourceMaps: true, + // Hides source maps from generated client bundles + hideSourceMaps: true, -// // Automatically tree-shake Sentry logger statements to reduce bundle size -// disableLogger: true, -// }, -// ); + // Automatically tree-shake Sentry logger statements to reduce bundle size + disableLogger: true, + }, +); diff --git a/src/app/player/[id]/[sort]/[page]/page.tsx b/src/app/player/[id]/[sort]/[page]/page.tsx index 0f374ae..f4d8125 100644 --- a/src/app/player/[id]/[sort]/[page]/page.tsx +++ b/src/app/player/[id]/[sort]/[page]/page.tsx @@ -1,9 +1,25 @@ -import PlayerPage from "@/components/player/PlayerPage"; +import Card from "@/components/Card"; +import Container from "@/components/Container"; +import Spinner from "@/components/Spinner"; +import PlayerChart from "@/components/player/PlayerChart"; +import PlayerInfo from "@/components/player/PlayerInfo"; +import Scores from "@/components/player/Scores"; +import { + Tooltip, + TooltipContent, + TooltipTrigger, +} from "@/components/ui/Tooltip"; import ssrSettings from "@/ssrSettings.json"; +import { SortTypes } from "@/types/SortTypes"; import { formatNumber } from "@/utils/numberUtils"; import { ScoreSaberAPI } from "@/utils/scoresaber/api"; import { normalizedRegionName } from "@/utils/utils"; +import clsx from "clsx"; import { Metadata } from "next"; +import Image from "next/image"; +import { Suspense } from "react"; + +const DEFAULT_SORT_TYPE = SortTypes.top; type Props = { params: { id: string; sort: string; page: string }; @@ -61,10 +77,61 @@ async function getData(id: string) { } export default async function Player({ params: { id, sort, page } }: Props) { - const { data } = await getData(id); - if (!data) { - return
Player not found
; + const { data: player } = await getData(id); + if (!player) { + return ( +
+ + +

Player not found

+
+
+
+ ); } - return ; + const sortType = SortTypes[sort] || DEFAULT_SORT_TYPE; + const badges = player.badges; + + return ( +
+ + + {/* Chart */} + + {/* Badges */} +
0 ? "block" : "hidden", + )} + > + {badges.map((badge) => { + return ( + + + {badge.description} + + +

{badge.description}

+
+
+ ); + })} +
+
+ }> + + +
+
+ +
+
+ ); } diff --git a/src/components/player/PlayerPage.tsx b/src/components/player/PlayerPage.tsx deleted file mode 100644 index 45e8b19..0000000 --- a/src/components/player/PlayerPage.tsx +++ /dev/null @@ -1,69 +0,0 @@ -import Card from "@/components/Card"; -import Container from "@/components/Container"; -import Scores from "@/components/player/Scores"; -import { ScoresaberPlayer } from "@/schemas/scoresaber/player"; -import { SortTypes } from "@/types/SortTypes"; -import clsx from "clsx"; -import Image from "next/image"; -import { Tooltip, TooltipContent, TooltipTrigger } from "../ui/Tooltip"; -import PlayerChart from "./PlayerChart"; -import PlayerInfo from "./PlayerInfo"; - -type PlayerInfo = { - loading: boolean; - player: ScoresaberPlayer | undefined; -}; - -type PlayerPageProps = { - player: ScoresaberPlayer; - sort: string; - page: string; -}; - -const DEFAULT_SORT_TYPE = SortTypes.top; - -export default function PlayerPage({ player, sort, page }: PlayerPageProps) { - const sortType = SortTypes[sort] || DEFAULT_SORT_TYPE; - - const badges = player.badges; - - return ( -
- - - {/* Chart */} - - {/* Badges */} -
0 ? "block" : "hidden", - )} - > - {badges.map((badge) => { - return ( - - - {badge.description} - - -

{badge.description}

-
-
- ); - })} -
-
- -
-
- -
-
- ); -} diff --git a/src/components/player/Scores.tsx b/src/components/player/Scores.tsx index b68ecc0..e5c8611 100644 --- a/src/components/player/Scores.tsx +++ b/src/components/player/Scores.tsx @@ -6,6 +6,7 @@ import { useSettingsStore } from "@/store/settingsStore"; import { SortType, SortTypes } from "@/types/SortTypes"; import { ScoreSaberAPI } from "@/utils/scoresaber/api"; import useStore from "@/utils/useStore"; +import clsx from "clsx"; import dynamic from "next/dynamic"; import { useCallback, useEffect, useState } from "react"; import Card from "../Card"; @@ -99,7 +100,13 @@ export default function Scores({ playerData, page, sortType }: ScoresProps) { } return ( - + {/* Sort */}
@@ -124,46 +131,45 @@ export default function Scores({ playerData, page, sortType }: ScoresProps) {
-
+
{scores.loading ? ( -
+
) : ( -
- {!scores.loading && scores.scores.length == 0 ? ( -

{errorMessage}

- ) : ( - scores.scores.map((scoreData, id) => { - const { score, leaderboard } = scoreData; + <> +
+ {!scores.loading && scores.scores.length == 0 ? ( +

{errorMessage}

+ ) : ( + scores.scores.map((scoreData, id) => { + const { score, leaderboard } = scoreData; - return ( - - ); - }) - )} -
+ return ( + + ); + }) + )} +
+ {/* Pagination */} +
+ { + updateScoresPage(scores.sortType, page); + }} + /> +
+ )}
- - {/* Pagination */} -
-
- { - updateScoresPage(scores.sortType, page); - }} - /> -
-
); }