diff --git a/components/RecentChunithmScores/action.ts b/components/RecentChunithmScores/action.ts
index c96ed98..d25368d 100644
--- a/components/RecentChunithmScores/action.ts
+++ b/components/RecentChunithmScores/action.ts
@@ -21,18 +21,18 @@ export async function getUserRatingBaseList() {
         musicId: true,
         score: true,
         difficultId: true,
-        romVersionCode: true,
         version: true,
         index: true,
       },
+      orderBy: {
+        index: "asc",
+      },
     });
 
-    const baseListMusicIds = userRatingBaseList.map((entry) => entry.musicId!);
-
     const staticMusicInfo = await artemis.chuni_static_music.findMany({
       where: {
         songId: {
-          in: baseListMusicIds,
+          in: userRatingBaseList.map((entry) => entry.musicId!),
         },
         version: supportedVersionNumber,
       },
@@ -43,65 +43,70 @@ export async function getUserRatingBaseList() {
         chartId: true,
         level: true,
         genre: true,
-        worldsEndTag: true,
         jacketPath: true,
       },
     });
 
-    // Map to join `musicId` and `difficultId` with static music info
-    // i hate it
-    const profileRatingToStaticMusic = new Map<
-      string,
-      (typeof staticMusicInfo)[0]
-    >(staticMusicInfo.map((info) => [`${info.songId}-${info.chartId}`, info]));
-
-    const songsWithStaticMusicInfo = userRatingBaseList.map(
-      (ratingListSong) => {
-        const MusicIdtoDiffId = `${ratingListSong.musicId}-${ratingListSong.difficultId}`;
-        const songInfo = profileRatingToStaticMusic.get(MusicIdtoDiffId);
-
-        const level = songInfo?.level ?? 0;
-        const score = ratingListSong.score ?? 0;
-
-        // Rating Formula
-        let rating = 0;
-
-        if (score >= 1009000) {
-          rating = level * 100 + 215;
-        } else if (score >= 1007500) {
-          rating = level * 100 + 200 + (score - 1007500) / 100;
-        } else if (score >= 1005000) {
-          rating = level * 100 + 150 + (score - 1005000) / 50;
-        } else if (score >= 1000000) {
-          rating = level * 100 + 100 + (score - 1000000) / 100;
-        } else if (score >= 975000) {
-          rating = level * 100 + (score - 975000) / 250;
-        } else if (score >= 925000) {
-          rating = level * 100 - 300 + ((score - 925000) * 3) / 500;
-        } else if (score >= 900000) {
-          rating = level * 100 - 500 + ((score - 900000) * 4) / 500;
-        } else if (score >= 800000) {
-          rating =
-            (level * 100 - 500) / 2 +
-            ((score - 800000) * ((level - 500) / 2)) / 100000;
-        }
-
-        return {
-          ...ratingListSong,
-          title: songInfo?.title || "Unknown Title",
-          artist: songInfo?.artist || "Unknown Artist",
-          genre: songInfo?.genre || "Unknown Genre",
-          chartId: songInfo?.chartId || "Unknown chartId",
-          level: songInfo?.level || "Unknown Level",
-          jacketPath: songInfo?.jacketPath || "",
-          rating,
-        };
-      },
+    // Create a map
+    const songIdtoChartId = new Map<string, (typeof staticMusicInfo)[0]>(
+      staticMusicInfo.map((music) => [
+        `${music.songId}-${music.chartId}`,
+        music,
+      ]),
     );
 
-    return songsWithStaticMusicInfo;
+    //  user ratings
+    const musicIdToDifficltId = userRatingBaseList.map((rating) => {
+      const staticMusic = songIdtoChartId.get(
+        `${rating.musicId}-${rating.difficultId}`,
+      );
+
+      const level = staticMusic?.level ?? 0;
+      const score = rating.score ?? 0;
+
+      const ratingChange = calculateRating(level, score);
+
+      return {
+        ...rating,
+        chartId: staticMusic?.chartId || "Unknown chartId",
+        title: staticMusic?.title || "Unknown Title",
+        artist: staticMusic?.artist || "Unknown Artist",
+        genre: staticMusic?.genre || "Unknown Genre",
+        level: staticMusic?.level || "Unknown Level",
+        jacketPath: staticMusic?.jacketPath || "",
+        rating: ratingChange,
+      };
+    });
+
+    return musicIdToDifficltId;
   } catch (error) {
     console.error("Error fetching songs with titles:", error);
     throw error;
   }
 }
+
+// calculate the rating
+function calculateRating(level: number, score: number): number {
+  if (score >= 1009000) {
+    return level * 100 + 215;
+  } else if (score >= 1007500) {
+    return level * 100 + 200 + (score - 1007500) / 100;
+  } else if (score >= 1005000) {
+    return level * 100 + 150 + (score - 1005000) / 50;
+  } else if (score >= 1000000) {
+    return level * 100 + 100 + (score - 1000000) / 100;
+  } else if (score >= 975000) {
+    return level * 100 + (score - 975000) / 250;
+  } else if (score >= 925000) {
+    return level * 100 - 300 + ((score - 925000) * 3) / 500;
+  } else if (score >= 900000) {
+    return level * 100 - 500 + ((score - 900000) * 4) / 500;
+  } else if (score >= 800000) {
+    return (
+      (level * 100 - 500) / 2 +
+      ((score - 800000) * ((level - 500) / 2)) / 100000
+    );
+  } else {
+    return 0;
+  }
+}
diff --git a/components/RecentChunithmScores/page.tsx b/components/RecentChunithmScores/page.tsx
index bdcd736..3a1ed61 100644
--- a/components/RecentChunithmScores/page.tsx
+++ b/components/RecentChunithmScores/page.tsx
@@ -3,20 +3,20 @@ 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;
+  chartId: number;
   level: string | number;
   jacketPath: string;
   rating: number;
   version: number;
   index: number;
   musicId: number | null;
-  difficultId: number | null;
-  romVersionCode: number | null;
+  difficultId: string;
   score: number | null;
 };
 
@@ -44,20 +44,27 @@ export const ChunithmRecentPlays: FC<ChunithmProfileRecentPlays> = ({
                 <img
                   src={`/JacketArt/${jacketPath}`}
                   alt="Jacket"
-                  style={{ width: "80px", height: "80px" }}
+                  style={{ width: "120px", height: "120px" }}
                 />
               )}
               <div>
                 <ul className="pl-2">
                   <li>
-                    <strong>Title:</strong> {playersRecentRatingList.title}
+                    <strong>Title: </strong> {playersRecentRatingList.title}
                   </li>
                   <li>
-                    <strong>Score:</strong>{" "}
+                    <strong>Level: </strong> {playersRecentRatingList.level}
+                  </li>
+                  <li>
+                    <strong>Difficulty: </strong>
+                    {getDifficultyText(playersRecentRatingList.chartId)}
+                  </li>
+                  <li>
+                    <strong>Score: </strong>{" "}
                     {playersRecentRatingList.score?.toLocaleString()}
                   </li>
                   <li>
-                    <strong>Rating:</strong>{" "}
+                    <strong>Rating: </strong>{" "}
                     {(playersRecentRatingList.rating / 100).toFixed(2)}
                   </li>
                 </ul>
diff --git a/lib/helpers.ts b/lib/helpers.ts
index 3f5b0f4..bc82fa4 100644
--- a/lib/helpers.ts
+++ b/lib/helpers.ts
@@ -36,7 +36,6 @@ export const getDifficultyText = (chartId: number | null) => {
   }
 };
 
-
 export const getGrade = (score: number) => {
   if (score >= 1009000) return "SSS+";
   if (score >= 1007500 && score <= 1008999) return "SSS";