renamed recents to userratingbase

components/userRatingBase/page.tsx

@@ -0,0 +1,77 @@
+import React, { FC } from "react";
+import {
+  chuni_profile_rating,
+  chuni_static_music,
+} from "@/prisma/schemas/artemis/generated/artemis";
+import { getDifficultyText } from "@/lib/helpers";
+
+type userRatingBaseList = {
+  title: string;
+  artist: string;
+  genre: string;
+  chartId: string | number;
+  level: string | number;
+  jacketPath: string;
+  rating: number;
+  version: number;
+  index: number;
+  musicId: number | null;
+  difficultId: number | null;
+  score: number | null;
+};
+
+type ChunithmProfileRecentPlays = {
+  chuniProfileRecentPlays: {
+    recentRating: userRatingBaseList[];
+  };
+};
+export const ChunithmRecentPlays: FC<ChunithmProfileRecentPlays> = ({
+  chuniProfileRecentPlays,
+}) => {
+  return (
+    <div>
+      {chuniProfileRecentPlays.recentRating.map(
+        (playersRecentRatingList, index) => {
+          const jacketPath = playersRecentRatingList.jacketPath?.replace(
+            ".dds",
+            ".png",
+          );
+          return (
+            <div key={index} className="center flex p-2">
+              <div className="m-4 font-bold">{index + 1}.</div>
+              {jacketPath && (
+                <img
+                  src={`/JacketArt/${jacketPath}`}
+                  alt="Jacket"
+                  style={{ width: "120px", height: "120px" }}
+                />
+              )}
+              <div>
+                <ul className="pl-2">
+                  <li>
+                    <strong>Title: </strong> {playersRecentRatingList.title}
+                  </li>
+                  <li>
+                    <strong>Level: </strong> {playersRecentRatingList.level}
+                  </li>
+                  <li>
+                    <strong>Difficulty: </strong>
+                    {getDifficultyText(Number(playersRecentRatingList.chartId))}
+                  </li>
+                  <li>
+                    <strong>Score: </strong>{" "}
+                    {playersRecentRatingList.score?.toLocaleString()}
+                  </li>
+                  <li>
+                    <strong>Rating: </strong>{" "}
+                    {(playersRecentRatingList.rating / 100).toFixed(2)}
+                  </li>
+                </ul>
+              </div>
+            </div>
+          );
+        },
+      )}
+    </div>
+  );
+};