feat: add formatted_score property and update score display in templates

Author: FuzzyGrim

src/app/models.py

@@ -771,6 +771,17 @@ def process_status(self):
 
         self.item.fetch_releases(delay=True)
 
+    @property
+    def formatted_score(self):
+        """Return as int if score is 10.0 or 0.0, otherwise show decimal."""
+        if self.score is not None:
+            max_score = 10
+            min_score = 0
+            if self.score in (max_score, min_score):
+                return int(self.score)
+            return self.score
+        return None
+
     @property
     def formatted_progress(self):
         """Return the progress of the media in a formatted string."""

src/app/statistics.py

@@ -227,7 +227,7 @@ def get_score_distribution(user_media):
 
     # Use heapq to maintain top items efficiently
     top_rated = []
-    top_rated_count = 12
+    top_rated_count = 14
     counter = itertools.count()  # For unique identifiers
 
     # Define score range (0-10)
@@ -242,25 +242,17 @@ def get_score_distribution(user_media):
 
         # Process each media item
         for media in scored_media:
-            # Update top rated using heap
-            item_data = {
-                "title": media.item.__str__(),
-                "image": media.item.image,
-                "score": media.score,
-                "url": app_tags.media_url(media.item),
-            }
-
             # Use negative score for max heap (heapq implements min heap)
             # Add counter as tiebreaker
             if len(top_rated) < top_rated_count:
                 heapq.heappush(
                     top_rated,
-                    (float(media.score), next(counter), item_data),
+                    (float(media.score), next(counter), media),
                 )
             else:
                 heapq.heappushpop(
                     top_rated,
-                    (float(media.score), next(counter), item_data),
+                    (float(media.score), next(counter), media),
                 )
 
             # Bin the score
@@ -280,7 +272,7 @@ def get_score_distribution(user_media):
 
     # Convert heap to sorted list of top rated items
     top_rated = [
-        item_data for _, _, item_data in sorted(top_rated, key=lambda x: (-x[0], x[1]))
+        media for _, _, media in sorted(top_rated, key=lambda x: (-x[0], x[1]))
     ]
 
     return {
@@ -295,8 +287,7 @@ def get_score_distribution(user_media):
         ],
         "average_score": average_score,
         "total_scored": total_scored,
-        "top_rated": top_rated,
-    }
+    }, top_rated
 
 
 def get_status_color(status):

src/app/tests/test_statistics.py

@@ -715,14 +715,13 @@ def test_get_score_distribution(self):
             MediaTypes.ANIME.value: Anime.objects.filter(user=self.user),
         }
 
-        score_distribution = statistics.get_score_distribution(user_media)
+        score_distribution, top_rated = statistics.get_score_distribution(user_media)
 
         # Check structure
         self.assertIn("labels", score_distribution)
         self.assertIn("datasets", score_distribution)
         self.assertIn("average_score", score_distribution)
         self.assertIn("total_scored", score_distribution)
-        self.assertIn("top_rated", score_distribution)
 
         # Check content
         self.assertEqual(len(score_distribution["labels"]), 11)  # Scores 0-10
@@ -737,15 +736,15 @@ def test_get_score_distribution(self):
 
         # Check top rated
         self.assertEqual(
-            len(score_distribution["top_rated"]),
+            len(top_rated),
             2,
         )  # Only 2 items have scores
         self.assertEqual(
-            score_distribution["top_rated"][0]["score"],
+            top_rated[0].score,
             8.5,
         )  # TV should be first
         self.assertEqual(
-            score_distribution["top_rated"][1]["score"],
+            top_rated[1].score,
             7.5,
         )  # Movie should be second
 

src/app/views.py

@@ -842,7 +842,7 @@ def statistics(request):
     media_type_distribution = stats.get_media_type_distribution(
         media_count,
     )
-    score_distribution = stats.get_score_distribution(user_media)
+    score_distribution, top_rated = stats.get_score_distribution(user_media)
     status_distribution = stats.get_status_distribution(user_media)
     status_pie_chart_data = stats.get_status_pie_chart_data(
         status_distribution,
@@ -858,6 +858,7 @@ def statistics(request):
         "activity_data": activity_data,
         "media_type_distribution": media_type_distribution,
         "score_distribution": score_distribution,
+        "top_rated": top_rated,
         "status_distribution": status_distribution,
         "status_pie_chart_data": status_pie_chart_data,
         "timeline": timeline,

src/templates/app/components/media_card.html

@@ -22,7 +22,7 @@
                class="w-4 h-4 text-yellow-400 mr-1 fill-current">
             <polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon>
           </svg>
-          <span class="text-sm text-white">{{ media.score }}</span>
+          <span class="text-sm text-white">{{ media.formatted_score }}</span>
         </div>
       </div>
     {% endif %}

src/templates/app/components/media_table_items.html

@@ -58,7 +58,7 @@
                class="w-4 h-4 text-yellow-400 mr-1 fill-current">
             <polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon>
           </svg>
-          <span class="text-white -mt-[3px]">{{ media.score }}</span>
+          <span class="text-white -mt-[3px]">{{ media.formatted_score }}</span>
         </div>
       </td>
     {% else %}

src/templates/app/statistics.html

@@ -462,15 +462,15 @@ <h3 class="text-lg font-medium mb-2">No ratings yet</h3>
     <div class="bg-[#2a2f35] rounded-lg p-6">
       <h2 class="text-xl font-semibold mb-4">Top Rated Media</h2>
 
-      {% if score_distribution.top_rated %}
+      {% if top_rated %}
         <div class="media-grid">
-          {% for media in score_distribution.top_rated %}
+          {% for media in top_rated %}
             <div class="bg-[#39404b] rounded-lg overflow-hidden shadow-lg">
               <div class="relative">
-                <a href="{{ media.url }}" class="block">
-                  <img alt="{{ media.title }}"
-                       class="w-full aspect-[2/3] bg-[#3e454d] {% if media.image != IMG_NONE %}object-cover{% endif %}"
-                       src="{{ media.image }}">
+                <a href="{{ media.item|media_url }}" class="block">
+                  <img alt="{{ media.item.title }}"
+                       class="w-full aspect-[2/3] bg-[#3e454d] {% if media.item.image != IMG_NONE %}object-cover{% endif %}"
+                       src="{{ media.item.image }}">
                   <div class="absolute top-2 right-2 bg-black/75 px-2 py-1 rounded-md flex items-center">
                     <svg xmlns="http://www.w3.org/2000/svg"
                          width="24"
@@ -484,14 +484,14 @@ <h2 class="text-xl font-semibold mb-4">Top Rated Media</h2>
                          class="w-4 h-4 text-yellow-400 fill-current mr-1">
                       <polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon>
                     </svg>
-                    <span class="text-white text-sm font-medium">{{ media.score }}</span>
+                    <span class="text-white text-sm font-medium">{{ media.formatted_score }}</span>
                   </div>
                 </a>
               </div>
               <div class="p-3">
-                <a href="{{ media.url }}"
+                <a href="{{ media.item|media_url }}"
                    class="font-medium text-sm text-white hover:text-indigo-400 transition duration-300 line-clamp-1"
-                   title="{{ media.title }}">{{ media.title }}</a>
+                   title="{{ media.item.title }}">{{ media.item.title }}</a>
               </div>
             </div>
           {% endfor %}
@@ -591,7 +591,7 @@ <h4 class="font-medium">
                                    class="w-4 h-4 mr-1 fill-current">
                                 <polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon>
                               </svg>
-                              <span>{{ media.score }}</span>
+                              <span>{{ media.formatted_score }}</span>
                             </div>
                           {% endif %}
                         </div>