daphnis/app/(sharing)/[token]/[id]/page.tsx
2024-07-23 17:33:15 -04:00

122 lines
4.1 KiB
TypeScript

import { getAuth } from "@/auth/queries/getauth";
import { shareScore } from "../token";
import { getDifficultyClass, getDifficultyText, getGrade } from "@/lib/helpers";
import {
type chuni_score_playlog,
chuni_static_music,
} from "@/prisma/schemas/artemis/generated/artemis";
import { generatePlaylogId, getSongsWithTitles } from "./actions";
type chunithm = chuni_score_playlog &
chuni_static_music & { playCount: number };
export default async function Share({
params,
}: {
// pass the token and playlog id as params www.www.com/generatedtoken/playlogid
params: { token: string; id: string };
}) {
const { token, id } = params;
// Verify the token
const tokenResult = await shareScore(token);
if (tokenResult.error) {
return <p>{tokenResult.error}</p>;
}
const { user } = await getAuth();
if (!user?.UserId) {
return <p>Error: No user ID found.</p>;
}
const userId = user?.UserId;
const playlogId = parseInt(id);
const songsData = await getSongsWithTitles(userId);
const playlogIds = await generatePlaylogId(playlogId);
// Filter songsData to match the playlogIds
const chunithm: chunithm[] = songsData.filter((song) =>
playlogIds.includes(song.id)
);
return (
<div className="flex flex-col items-center justify-center space-y-4 p-4 dark:text-black">
<div className="w-full p-4 bg-white dark:text-black rounded-sm">
{chunithm.map((song) => (
<div key={song.id} className="w-full">
<span className="text-black text-center font-bold text-xl pr-2">
{song.isNewRecord && "NEW RECORD!!"}
</span>
<span className="text-black text-center font-bold text-xl">
Song: {song.title}
</span>
</div>
))}
</div>
<div className="w-full p-4 bg-white dark:text-black rounded-sm">
{chunithm.map((song) => (
<div key={song.id} className="w-full">
<span className="text-black text-center font-bold text-xl">
Artist: {song.artist}
</span>
</div>
))}
</div>
<div className="w-full p-4 bg-white dark:text-black rounded-sm">
{chunithm.map((song) => (
<div key={song.id} className="w-full">
<span className="text-black text-center font-bold text-xl">
Score: {song.score?.toLocaleString()}
</span>
</div>
))}
</div>
<div className="w-full p-4 bg-white dark:text-black rounded-sm">
{chunithm.map((song) => (
<div key={song.id} className="w-full">
<span className="text-black text-center font-bold text-xl">
Rank: {getGrade(song.score ?? 0)}
</span>
</div>
))}
</div>
<div className="w-full p-4 bg-white dark:text-black rounded-sm">
{chunithm.map((song) => (
<div key={song.id} className="w-full">
<span className="text-black text-center font-bold text-xl">
{song.isFullCombo && "FULL COMBO"}
</span>
<span className="text-black text-center font-bold text-xl">
Max combo: {song.maxCombo}
</span>
</div>
))}
</div>
<div className="w-full p-4 bg-white dark:text-black rounded-sm">
{chunithm.map((song) => (
<div key={song.id} className="w-full">
<div className="flex flex-col items-center justify-center">
<span className="text-white rounded-md shadow-[inset_0px_3px_6px_0px_#1a202c] bg-[#58329F] w-full text-center p-2 font-bold text-md">
Judge Justice: {song.judgeJustice}
</span>
<span className="text-white rounded-md shadow-[inset_0px_3px_6px_0px_#1a202c] bg-[#58329F] w-full text-center p-2 font-bold text-md m-5">
Judge Attack: {song.judgeAttack}
</span>
<span className="text-white rounded-md shadow-[inset_0px_3px_6px_0px_#1a202c] bg-[#58329F] w-full text-center p-2 font-bold text-md">
Miss: {song.judgeGuilty}
</span>
</div>
</div>
))}
</div>
</div>
);
}