From 5934029e959979d4732e094b385849cc6bd88e40 Mon Sep 17 00:00:00 2001
From: Agamya Samuel <github@agamya.dev>
Date: Wed, 28 Jan 2026 19:56:18 +0000
Subject: [PATCH 1/4] Backend: Add show_stats check to votes-stats endpoint

Only return voting statistics when show_stats is enabled for the round.
This prevents statistics from being returned when the feature is disabled.
---
 montage/juror_endpoints.py | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/montage/juror_endpoints.py b/montage/juror_endpoints.py
index 0f6241cd..8a1f5901 100644
--- a/montage/juror_endpoints.py
+++ b/montage/juror_endpoints.py
@@ -172,6 +172,10 @@ def get_votes_stats_from_round(user_dao, round_id):
     juror_dao = JurorDAO(user_dao)
     rnd = juror_dao.get_round(round_id)
 
+    # Only return statistics if show_stats is enabled
+    if not rnd.show_stats:
+        return None
+
     stats = None
 
     if rnd.vote_method == 'yesno':

From 27776550d0d5beb801a818dc51767b2a8998950b Mon Sep 17 00:00:00 2001
From: Agamya Samuel <github@agamya.dev>
Date: Wed, 28 Jan 2026 19:56:19 +0000
Subject: [PATCH 2/4] Frontend: Add voting statistics display to VoteYesNo
 component

- Add statistics display section showing Accept/Decline counts
- Implement statistics fetching on mount and round prop changes
- Refresh statistics automatically after each vote submission
- Add CSS styles for statistics display
---
 frontend/src/components/Vote/VoteYesNo.vue | 80 +++++++++++++++++++++-
 1 file changed, 79 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/Vote/VoteYesNo.vue b/frontend/src/components/Vote/VoteYesNo.vue
index a7fce3a7..cf985600 100644
--- a/frontend/src/components/Vote/VoteYesNo.vue
+++ b/frontend/src/components/Vote/VoteYesNo.vue
@@ -71,6 +71,20 @@
         </span>
       </div>
 
+      <div v-if="round && round.show_stats && voteStats" class="vote-statistics">
+        <h3 class="vote-section-title">{{ $t('montage-round-stats') }}</h3>
+        <div class="vote-stats-content">
+          <div class="vote-stats-item">
+            <span class="vote-stats-label">{{ $t('montage-vote-accept') }}:</span>
+            <span class="vote-stats-value">{{ voteStats.stats?.yes || 0 }}</span>
+          </div>
+          <div class="vote-stats-item">
+            <span class="vote-stats-label">{{ $t('montage-vote-decline') }}:</span>
+            <span class="vote-stats-value">{{ voteStats.stats?.no || 0 }}</span>
+          </div>
+        </div>
+      </div>
+
       <h3 class="vote-section-title">{{ $t('montage-vote-actions') }}</h3>
       <div class="vote-actions">
         <div>
@@ -164,7 +178,7 @@
 </template>
 
 <script setup>
-import { ref, watch, computed } from 'vue'
+import { ref, watch, computed, onMounted } from 'vue'
 import { useI18n } from 'vue-i18n'
 import jurorService from '@/services/jurorService'
 import { useRouter } from 'vue-router'
@@ -209,6 +223,7 @@ const roundLink = [props.round.id, props.round.canonical_url_name].join('-')
 const isLoading = ref(false)
 const images = ref(null)
 const stats = ref(null)
+const voteStats = ref(null)
 
 const rating = ref({
   current: null,
@@ -225,6 +240,20 @@ const goPrevVoteEditing = () => {
   router.push({ name: 'vote-edit', params: { id: roundLink } })
 }
 
+const fetchVoteStats = () => {
+  if (props.round?.show_stats) {
+    jurorService.getRoundVotesStats(props.round.id)
+      .then((response) => {
+        // API interceptor already returns response.data, so response is the data itself
+        voteStats.value = response
+      })
+      .catch(() => {
+        // Silently fail if stats can't be loaded
+        voteStats.value = null
+      })
+  }
+}
+
 const handleImageLoad = () => {
   imageLoading.value = false
 }
@@ -278,6 +307,10 @@ function setRate(rate) {
         if (stats.value.total_open_tasks <= 10) {
           skips.value = 0
         }
+        // Refresh statistics after voting
+        if (props.round?.show_stats) {
+          fetchVoteStats()
+        }
         if (counter.value === 4 || !stats.value.total_open_tasks) {
           counter.value = 0
           getTasks()
@@ -419,6 +452,24 @@ watch( voteContainer, () => {
     voteContainer.value.focus();
   }
 });
+
+watch(
+  () => props.round,
+  (round) => {
+    if (round?.show_stats) {
+      fetchVoteStats()
+    } else {
+      voteStats.value = null
+    }
+  },
+  { immediate: true }
+)
+
+onMounted(() => {
+  if (props.round?.show_stats) {
+    fetchVoteStats()
+  }
+})
 </script>
 
 <style scoped>
@@ -607,4 +658,31 @@ watch( voteContainer, () => {
   margin-top: 24px;
   width: 232px;
 }
+
+.vote-statistics {
+  margin-top: 16px;
+}
+
+.vote-stats-content {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.vote-stats-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.vote-stats-label {
+  font-size: 14px;
+  color: rgba(0, 0, 0, 0.87);
+}
+
+.vote-stats-value {
+  font-size: 16px;
+  font-weight: 500;
+  color: rgba(0, 0, 0, 0.87);
+}
 </style>

From 97edce5c2a4a6615968538adc991760eca14d332 Mon Sep 17 00:00:00 2001
From: Agamya Samuel <github@agamya.dev>
Date: Wed, 28 Jan 2026 19:56:20 +0000
Subject: [PATCH 3/4] Frontend: Add voting statistics display to VoteRating
 component

- Add statistics display section showing star ratings distribution (1-5 stars)
- Implement statistics fetching on mount and round prop changes
- Refresh statistics automatically after each vote submission
- Add CSS styles for statistics display
---
 frontend/src/components/Vote/VoteRating.vue | 87 ++++++++++++++++++++-
 1 file changed, 86 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/Vote/VoteRating.vue b/frontend/src/components/Vote/VoteRating.vue
index fec33399..06a8b3a3 100644
--- a/frontend/src/components/Vote/VoteRating.vue
+++ b/frontend/src/components/Vote/VoteRating.vue
@@ -70,6 +70,19 @@
         </span>
       </div>
 
+      <div v-if="round && round.show_stats && voteStats" class="vote-statistics">
+        <h3 class="vote-section-title">{{ $t('montage-round-stats') }}</h3>
+        <div class="vote-stats-content">
+          <div v-for="star in [1, 2, 3, 4, 5]" :key="star" class="vote-stats-item">
+            <span class="vote-stats-label">
+              <star class="vote-stats-star-icon" />
+              {{ star }}:
+            </span>
+            <span class="vote-stats-value">{{ voteStats.stats?.[star] || 0 }}</span>
+          </div>
+        </div>
+      </div>
+
       <h3 class="vote-section-title">{{ $t('montage-vote-actions') }}</h3>
       <div class="vote-actions">
         <div>
@@ -163,7 +176,7 @@
 </template>
 
 <script setup>
-import { ref, watch, computed } from 'vue'
+import { ref, watch, computed, onMounted } from 'vue'
 import { useI18n } from 'vue-i18n'
 import jurorService from '@/services/jurorService'
 import { useRouter } from 'vue-router'
@@ -207,6 +220,7 @@ const roundLink = [props.round.id, props.round.canonical_url_name].join('-')
 
 const images = ref(null)
 const stats = ref(null)
+const voteStats = ref(null)
 
 const rating = ref({
   current: null,
@@ -223,6 +237,20 @@ function goPrevVoteEditing() {
   router.push({ name: 'vote-edit', params: { id: roundLink } })
 }
 
+function fetchVoteStats() {
+  if (props.round?.show_stats) {
+    jurorService.getRoundVotesStats(props.round.id)
+      .then((response) => {
+        // API interceptor already returns response.data, so response is the data itself
+        voteStats.value = response
+      })
+      .catch(() => {
+        // Silently fail if stats can't be loaded
+        voteStats.value = null
+      })
+  }
+}
+
 function handleImageLoad() {
   imageLoading.value = false
 }
@@ -276,6 +304,10 @@ function setRate(rate) {
         if (stats.value.total_open_tasks <= 10) {
           skips.value = 0
         }
+        // Refresh statistics after voting
+        if (props.round?.show_stats) {
+          fetchVoteStats()
+        }
         if (counter.value === 4 || !stats.value.total_open_tasks) {
           counter.value = 0
           getTasks()
@@ -415,6 +447,24 @@ watch( voteContainer, () => {
     voteContainer.value.focus();
   }
 });
+
+watch(
+  () => props.round,
+  (round) => {
+    if (round?.show_stats) {
+      fetchVoteStats()
+    } else {
+      voteStats.value = null
+    }
+  },
+  { immediate: true }
+)
+
+onMounted(() => {
+  if (props.round?.show_stats) {
+    fetchVoteStats()
+  }
+})
 </script>
 
 <style scoped>
@@ -603,4 +653,39 @@ watch( voteContainer, () => {
   margin-top: 24px;
   width: 232px;
 }
+
+.vote-statistics {
+  margin-top: 16px;
+}
+
+.vote-stats-content {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.vote-stats-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.vote-stats-label {
+  font-size: 14px;
+  color: rgba(0, 0, 0, 0.87);
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+
+.vote-stats-star-icon {
+  width: 16px;
+  height: 16px;
+}
+
+.vote-stats-value {
+  font-size: 16px;
+  font-weight: 500;
+  color: rgba(0, 0, 0, 0.87);
+}
 </style>

From 1657280e32f57d6ee97f77a8afc61f039d6bdedc Mon Sep 17 00:00:00 2001
From: Agamya Samuel <github@agamya.dev>
Date: Wed, 28 Jan 2026 20:16:04 +0000
Subject: [PATCH 4/4] Fix star icon alignment in voting statistics display

Improve vertical alignment of star icons in the statistics section by using
inline-flex with center alignment for better visual consistency.
---
 frontend/src/components/Vote/VoteRating.vue | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/frontend/src/components/Vote/VoteRating.vue b/frontend/src/components/Vote/VoteRating.vue
index 06a8b3a3..9ed954dc 100644
--- a/frontend/src/components/Vote/VoteRating.vue
+++ b/frontend/src/components/Vote/VoteRating.vue
@@ -681,6 +681,9 @@ onMounted(() => {
 .vote-stats-star-icon {
   width: 16px;
   height: 16px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
 }
 
 .vote-stats-value {