From a99fecc2bcd0f7e8126f5e6c286588fd727efd09 Mon Sep 17 00:00:00 2001
From: marcel-bitfly <174338434+marcel-bitfly@users.noreply.github.com>
Date: Mon, 4 Nov 2024 08:32:28 +0100
Subject: [PATCH] fix: show `3 validator indexes` or correct `validator count`

On DashboardTableSummary

See: BEDS-649
---
 .../dashboard/table/DashboardTableValidators.vue  | 15 +++++++--------
 .../components/dashboard/table/SummaryValue.vue   |  8 +++++++-
 frontend/utils/dashboard/validator.ts             |  7 -------
 3 files changed, 14 insertions(+), 16 deletions(-)

diff --git a/frontend/components/dashboard/table/DashboardTableValidators.vue b/frontend/components/dashboard/table/DashboardTableValidators.vue
index 477c162c7..a1359940f 100644
--- a/frontend/components/dashboard/table/DashboardTableValidators.vue
+++ b/frontend/components/dashboard/table/DashboardTableValidators.vue
@@ -7,7 +7,6 @@ import type {
 } from '~/types/dashboard/summary'
 import { DashboardValidatorSubsetModal } from '#components'
 import { getGroupLabel } from '~/utils/dashboard/group'
-import { sortValidatorIds } from '~/utils/dashboard/validator'
 import type { DashboardKey } from '~/types/dashboard'
 import type {
   VDBGroupSummaryData,
@@ -21,6 +20,7 @@ interface Props {
   groupId?: number,
   row: VDBSummaryTableRow,
   timeFrame?: SummaryTimeFrame,
+  validatorCount: number,
   validators: number[],
 }
 const props = defineProps<Props>()
@@ -50,17 +50,16 @@ const openValidatorModal = () => {
 const groupName = computed(() => {
   return getGroupLabel($t, props.groupId, groups.value, $t('common.total'))
 })
-
-const cappedValidators = computed(() =>
-  sortValidatorIds(props.validators).slice(0, 10),
-)
 </script>
 
 <template>
   <div class="validator_column">
-    <span v-if="cappedValidators.length <= 3" class="validators">
+    <span
+      v-if="validators.length && validatorCount <= 3"
+      class="validators"
+    >
       <template
-        v-for="validator in cappedValidators"
+        v-for="validator in validators"
         :key="validator"
       >
         <BcLink
@@ -74,7 +73,7 @@ const cappedValidators = computed(() =>
       </template>
     </span>
     <span v-else>
-      {{ cappedValidators.length }} {{ $t('common.validator', cappedValidators.length) }}
+      {{ validatorCount }} {{ $t('common.validator', validatorCount) }}
     </span>
     <FontAwesomeIcon
       v-if="validators?.length"
diff --git a/frontend/components/dashboard/table/SummaryValue.vue b/frontend/components/dashboard/table/SummaryValue.vue
index d5d012a69..a8e906313 100644
--- a/frontend/components/dashboard/table/SummaryValue.vue
+++ b/frontend/components/dashboard/table/SummaryValue.vue
@@ -82,21 +82,26 @@ const data = computed(() => {
     )
   ) {
     let validators: number[] = []
+    let validatorCount: number = 0
     let context: DashboardValidatorContext = 'attestation'
     if (props.property === 'validators_proposal') {
-      validators = col.proposal_validators
+      validators = col.proposal_validators ?? []
+      validatorCount = col.proposal_validator_count ?? 0
       context = 'proposal'
     }
     else if (props.property === 'validators_sync') {
       validators = col.sync.validators ?? []
+      validatorCount = col.sync.validator_count ?? 0
       context = 'sync'
     }
     else if (props.property === 'validators_slashings') {
       validators = col.slashings?.validators ?? []
+      validatorCount = col.slashings.validator_count ?? 0
       context = 'slashings'
     }
     return {
       context,
+      validatorCount,
       validators,
     }
   }
@@ -252,6 +257,7 @@ const openValidatorModal = () => {
   <DashboardTableValidators
     v-else-if="data?.validators"
     :validators="data.validators"
+    :validator-count="data?.validatorCount"
     :time-frame="props.timeFrame"
     :context="data.context"
     :dashboard-key
diff --git a/frontend/utils/dashboard/validator.ts b/frontend/utils/dashboard/validator.ts
index 78ecc6bcd..87cd47ab6 100644
--- a/frontend/utils/dashboard/validator.ts
+++ b/frontend/utils/dashboard/validator.ts
@@ -26,13 +26,6 @@ export function totalDutyRewards(duties?: ValidatorHistoryDuties) {
   }
 }
 
-export function sortValidatorIds(list?: number[]): number[] {
-  if (!list) {
-    return []
-  }
-  return [ ...list ].sort((a, b) => a - b)
-}
-
 export function sortSummaryValidators(
   list?: VDBSummaryValidator[],
 ): VDBSummaryValidator[] {