This commit is contained in:
parent
5c7fe53484
commit
9ccb719a43
@ -113,9 +113,5 @@ export default function PlayerChart({
|
|||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return <Line className={className} options={options} data={data} />;
|
||||||
<div className="h-[310px] w-full">
|
|
||||||
<Line className={className} options={options} data={data} />
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
@ -20,7 +20,6 @@ import { useStore } from "zustand";
|
|||||||
import Avatar from "../Avatar";
|
import Avatar from "../Avatar";
|
||||||
import Card from "../Card";
|
import Card from "../Card";
|
||||||
import Label from "../Label";
|
import Label from "../Label";
|
||||||
import PlayerChart from "./PlayerChart";
|
|
||||||
|
|
||||||
const ReactCountryFlag = dynamic(() => import("react-country-flag"));
|
const ReactCountryFlag = dynamic(() => import("react-country-flag"));
|
||||||
|
|
||||||
@ -158,6 +157,7 @@ export default function PlayerInfo({ playerData }: PlayerInfoProps) {
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="mt-1 flex w-full flex-col items-center gap-2 md:items-start">
|
<div className="mt-1 flex w-full flex-col items-center gap-2 md:items-start">
|
||||||
{/* Name */}
|
{/* Name */}
|
||||||
<p className="text-2xl leading-none">{playerData.name}</p>
|
<p className="text-2xl leading-none">{playerData.name}</p>
|
||||||
@ -249,9 +249,6 @@ export default function PlayerInfo({ playerData }: PlayerInfoProps) {
|
|||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Chart */}
|
|
||||||
<PlayerChart scoresaber={playerData} />
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Card>
|
</Card>
|
||||||
|
@ -7,8 +7,11 @@ import Scores from "@/components/player/Scores";
|
|||||||
import { ScoresaberPlayer } from "@/schemas/scoresaber/player";
|
import { ScoresaberPlayer } from "@/schemas/scoresaber/player";
|
||||||
import { SortTypes } from "@/types/SortTypes";
|
import { SortTypes } from "@/types/SortTypes";
|
||||||
import { ScoreSaberAPI } from "@/utils/scoresaber/api";
|
import { ScoreSaberAPI } from "@/utils/scoresaber/api";
|
||||||
|
import clsx from "clsx";
|
||||||
import dynamic from "next/dynamic";
|
import dynamic from "next/dynamic";
|
||||||
|
import Image from "next/image";
|
||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
|
import PlayerChart from "./PlayerChart";
|
||||||
import PlayerInfo from "./PlayerInfo";
|
import PlayerInfo from "./PlayerInfo";
|
||||||
|
|
||||||
const Error = dynamic(() => import("@/components/Error"));
|
const Error = dynamic(() => import("@/components/Error"));
|
||||||
@ -79,11 +82,38 @@ export default function PlayerPage({ id, sort, page }: PlayerPageProps) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const playerData = player.player;
|
const playerData = player.player;
|
||||||
|
const badges = playerData.badges;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<main>
|
<main>
|
||||||
<Container>
|
<Container>
|
||||||
<PlayerInfo playerData={playerData} />
|
<PlayerInfo playerData={playerData} />
|
||||||
|
{/* Chart */}
|
||||||
|
<Card className="mt-2">
|
||||||
|
{/* Badges */}
|
||||||
|
<div
|
||||||
|
className={clsx(
|
||||||
|
"mb-2 mt-2 flex flex-wrap items-center justify-center gap-2",
|
||||||
|
badges.length > 0 ? "block" : "hidden",
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
{badges.map((badge) => {
|
||||||
|
return (
|
||||||
|
<Image
|
||||||
|
key={badge.image}
|
||||||
|
src={badge.image}
|
||||||
|
alt={badge.description}
|
||||||
|
title={badge.description}
|
||||||
|
width={80}
|
||||||
|
height={30}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
<div className="h-[320px] w-full">
|
||||||
|
<PlayerChart scoresaber={playerData} />
|
||||||
|
</div>
|
||||||
|
</Card>
|
||||||
<Scores
|
<Scores
|
||||||
playerData={playerData}
|
playerData={playerData}
|
||||||
page={Number(page)}
|
page={Number(page)}
|
||||||
|
Loading…
Reference in New Issue
Block a user