refactor: drs,around,diva display cleanup logic

3 files changed, 11 insertions, 47 deletions

diff --git a/frontend/src/components/displays/DancearoundScoreDisplay.tsx b/frontend/src/components/displays/DancearoundScoreDisplay.tsx
index a2d18f8..a98179d 100644
--- a/frontend/src/components/displays/DancearoundScoreDisplay.tsx
+++ b/frontend/src/components/displays/DancearoundScoreDisplay.tsx
@@ -37,20 +37,16 @@ const DancearoundScoreDisplay: React.FC<ScoreDisplayProps> = ({
 }) => {
   // Key mappings for better display names. Hit or miss
   const keyDisplayNames: Record<string, string> = {
-    title: "Title",
-    artist: "Artist",
     score: "Score",
-    difficulty: "Difficulty Level",
+    difficulty: "Difficulty",
     lamp: "Rank",
-    diff_lamp: "Chart Difficulty",
-    timestamp: "Date",
+    level: "Level",
     judgements: "Judgements",
     maxCombo: "Max Combo",
     perfect: "Perfect",
     great: "Great",
     good: "Good",
     bad: "Bad",
-    miss: "Miss",
     username: "Username",
     clear_status: "Status"
   };
@@ -58,11 +54,10 @@ const DancearoundScoreDisplay: React.FC<ScoreDisplayProps> = ({
   const mainStatKeys = [
     "score",
     "difficulty",
+    "level",
     "lamp",
-    "diff_lamp",
   ];
   const expandableKeys = ["judgements", "optional", "clear_status"];
-  const localSkipKeys = ["num_players"]
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const formatValue = (value: any, key: string): string => {
     if (value === null || value === undefined) return "N/A";
@@ -178,7 +173,7 @@ const DancearoundScoreDisplay: React.FC<ScoreDisplayProps> = ({
 
   const getScoreEntries = (score: Score) => {
     const entries = Object.entries(score).filter(
-      ([key]) => !globalSkipKeys.includes(key) && !localSkipKeys.includes(key),
+      ([key]) => !globalSkipKeys.includes(key) && key !== "num_players",
     );
 
     const mainStats = entries.filter(([key]) => mainStatKeys.includes(key));
@@ -227,7 +222,7 @@ const DancearoundScoreDisplay: React.FC<ScoreDisplayProps> = ({
   // Get all possible keys for table headers
   const allKeys = Array.from(
     new Set(scores.flatMap((score) => Object.keys(score))),
-  ).filter((key) => !globalSkipKeys.includes(key) && !localSkipKeys.includes(key));
+  ).filter((key) => !globalSkipKeys.includes(key) && key !== "num_players");
 
   // Prioritize important keys for table display
   const tableKeys = [
@@ -268,7 +263,6 @@ const DancearoundScoreDisplay: React.FC<ScoreDisplayProps> = ({
     return (
       <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 xl:grid-cols-3 gap-6">
         {sortedScores.map((score, index) => {
-          // eslint-disable-next-line @typescript-eslint/no-unused-vars
           const { mainStats, expandable, timestamp } =
             getScoreEntries(score);
           const chartIdHash = SHA1(`dancearound${score.title}${score.artist}`).toString();
diff --git a/frontend/src/components/displays/DancerushScoreDisplay.tsx b/frontend/src/components/displays/DancerushScoreDisplay.tsx
index fb31870..fcdc254 100644
--- a/frontend/src/components/displays/DancerushScoreDisplay.tsx
+++ b/frontend/src/components/displays/DancerushScoreDisplay.tsx
@@ -37,10 +37,8 @@ const DancerushScoreDisplay: React.FC<ScoreDisplayProps> = ({
 }) => {
   // Key mappings for better display names. Hit or miss
   const keyDisplayNames: Record<string, string> = {
-    title: "Title",
-    artist: "Artist",
     score: "Score",
-    difficulty: "Difficulty Number",
+    difficulty: "Level",
     lamp: "Rank",
     diff_lamp: "Chart Difficulty",
     timestamp: "Date",
@@ -50,7 +48,6 @@ const DancerushScoreDisplay: React.FC<ScoreDisplayProps> = ({
     great: "Great",
     good: "Good",
     bad: "Bad",
-    miss: "Miss",
     username: "Username",
     num_players: "Players"
   };
@@ -61,7 +58,7 @@ const DancerushScoreDisplay: React.FC<ScoreDisplayProps> = ({
     "lamp",
     "diff_lamp",
   ];
-  const expandableKeys = ["judgements", "optional"];
+  const expandableKeys = ["judgements", "optional", "num_players"];
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const formatValue = (value: any, key: string): string => {
     if (value === null || value === undefined) return "N/A";
@@ -272,7 +269,6 @@ const DancerushScoreDisplay: React.FC<ScoreDisplayProps> = ({
     return (
       <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 xl:grid-cols-3 gap-6">
         {sortedScores.map((score, index) => {
-          // eslint-disable-next-line @typescript-eslint/no-unused-vars
           const { mainStats, expandable, timestamp } =
             getScoreEntries(score);
           const chartIdHash = SHA1(`dancerush${score.title}${score.artist}`).toString();
diff --git a/frontend/src/components/displays/DivaScoreDisplay.tsx b/frontend/src/components/displays/DivaScoreDisplay.tsx
index 74dd431..2646b6b 100644
--- a/frontend/src/components/displays/DivaScoreDisplay.tsx
+++ b/frontend/src/components/displays/DivaScoreDisplay.tsx
@@ -44,8 +44,6 @@ const DivaScoreDisplay: React.FC<ScoreDisplayProps> = ({
 }) => {
   // Key mappings for better display names. Hit or miss
   const keyDisplayNames: Record<string, string> = {
-    title: "Title",
-    artist: "Artist",
     score: "SCORE",
     difficulty: "Difficulty Rating",
     lamp: "CLEAR RANK",
@@ -53,13 +51,7 @@ const DivaScoreDisplay: React.FC<ScoreDisplayProps> = ({
     timestamp: "Date",
     judgements: "Judgements",
     maxCombo: "Max Combo",
-    perfect: "Perfect",
-    great: "Great",
-    good: "Good",
-    bad: "Bad",
-    miss: "Miss",
     username: "Username",
-    num_players: "Players"
   };
 
   const mainStatKeys = [
@@ -69,6 +61,7 @@ const DivaScoreDisplay: React.FC<ScoreDisplayProps> = ({
     "diff_lamp",
   ];
   const expandableKeys = ["judgements", "optional"];
+  const gameParam = new URLSearchParams(window.location.search).get("game") || "diva";
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const formatValue = (value: any, key: string): string => {
     if (value === null || value === undefined) return "N/A";
@@ -318,10 +311,9 @@ const DivaScoreDisplay: React.FC<ScoreDisplayProps> = ({
     return (
       <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 xl:grid-cols-3 gap-6">
         {sortedScores.map((score, index) => {
-          // eslint-disable-next-line @typescript-eslint/no-unused-vars
-          const { mainStats, expandable, others, timestamp } =
+          const chartIdHash = SHA1(`${gameParam}${score.title}${score.artist}`).toString();
+          const { mainStats, expandable, timestamp } =
             getScoreEntries(score);
-          const chartIdHash = SHA1(`diva${score.title}${score.artist}`).toString();
           return (
             <div
               key={score.id || index}
@@ -331,7 +323,7 @@ const DivaScoreDisplay: React.FC<ScoreDisplayProps> = ({
               <div className="flex items-start justify-between mb-4">
                 <div className="flex-1 min-w-0">
                   {!hideTitleArtist && (
-                    <Link to={`/chart?chartId=${chartIdHash}&game=diva`}>
+                    <Link to={`/chart?chartId=${chartIdHash}&game=${gameParam}`}>
                       <h3 className="text-lg font-semibold text-white mb-1 break-words leading-tight">
                         {score.title || score.song || "Unknown Title"}
                       </h3>
@@ -376,24 +368,6 @@ const DivaScoreDisplay: React.FC<ScoreDisplayProps> = ({
                 </div>
               ))}
 
-              {/* Other fields */}
-              {others.length > 0 && (
-                <div className="mb-4">
-                  <div className="grid grid-cols-2 gap-2 text-sm">
-                    {others.map(([key, value]) => (
-                      <div key={key} className="flex justify-between">
-                        <span className="text-slate-400">
-                          {getDisplayName(key)}:
-                        </span>
-                        <span className="text-white font-medium">
-                          {renderValue(value, key)}
-                        </span>
-                      </div>
-                    ))}
-                  </div>
-                </div>
-              )}
-
               {/* Timestamp */}
               <div className="pt-4 border-t border-slate-800/50">
                 <p className="text-slate-500 text-xs">