From 78ccb1a325ab4cfbc57979fc313febba3e4605a6 Mon Sep 17 00:00:00 2001
From: onmax <maximogarciamtnez@gmail.com>
Date: Wed, 20 Nov 2024 08:31:04 -0600
Subject: [PATCH] feat: update validator logo handling and API endpoint
 configuration

---
 src/components/staking/ValidatorIcon.vue | 11 ++++++++++-
 src/config/config.local.ts               |  2 +-
 src/config/config.mainnet.ts             |  2 +-
 src/config/config.testnet.ts             |  2 +-
 src/network.ts                           |  6 ++++--
 src/stores/Staking.ts                    |  5 +++--
 6 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/src/components/staking/ValidatorIcon.vue b/src/components/staking/ValidatorIcon.vue
index 0662a0bdc..2650754f5 100644
--- a/src/components/staking/ValidatorIcon.vue
+++ b/src/components/staking/ValidatorIcon.vue
@@ -1,11 +1,12 @@
 <template>
-    <img class="validator-icon" v-if="'logo' in validator" :src="validator.logo" :alt="validator.name" />
+    <img class="validator-icon" v-if="src" :src="src" :alt="validator.name" loading="lazy" />
     <Identicon class="validator-icon" v-else :address="validator.address"/>
 </template>
 
 <script lang="ts">
 import { defineComponent } from '@vue/composition-api';
 import { Identicon } from '@nimiq/vue-components';
+import { useConfig } from '@/composables/useConfig';
 import { Validator } from '../../stores/Staking';
 
 export default defineComponent({
@@ -15,6 +16,14 @@ export default defineComponent({
             required: true,
         },
     },
+    setup(props) {
+        const { config } = useConfig();
+
+        return {
+            src: 'logoPath' in props.validator
+                ? `${config.staking.validatorsEndpoint}}/${props.validator.logoPath}` : undefined,
+        };
+    },
     components: {
         Identicon,
     },
diff --git a/src/config/config.local.ts b/src/config/config.local.ts
index 7f24db96c..6d06c1d5d 100644
--- a/src/config/config.local.ts
+++ b/src/config/config.local.ts
@@ -24,7 +24,7 @@ export default {
         prestakingStartBlock: 3_023_730,
         prestakingEndBlock: 3_028_050,
         transitionBlock: 3_032_010,
-        validatorsEndpoint: 'https://validators-api-testnet.nuxt.dev/api/v1/validators?only-known=false',
+        validatorsEndpoint: 'https://validators-api-testnet.nuxt.dev',
         genesis: {
             height: 3032010,
             date: new Date('2024-11-13T20:00:00Z'),
diff --git a/src/config/config.mainnet.ts b/src/config/config.mainnet.ts
index 797592da7..becec2ec2 100644
--- a/src/config/config.mainnet.ts
+++ b/src/config/config.mainnet.ts
@@ -34,7 +34,7 @@ export default {
         prestakingStartBlock: 3_392_200, // 2024-10-06T02:53:18Z
         prestakingEndBlock: 3_456_000, // ~2024-11-19T16:00:00Z
         transitionBlock: 3_456_000,
-        validatorsEndpoint: 'https://validators-api-mainnet.nuxt.dev/api/v1/validators?only-known=false',
+        validatorsEndpoint: 'https://validators-api-mainnet.nuxt.dev',
         genesis: {
             height: 3456000,
             date: new Date('2024-11-19T16:00:00Z'),
diff --git a/src/config/config.testnet.ts b/src/config/config.testnet.ts
index 6cfc31760..038028caa 100644
--- a/src/config/config.testnet.ts
+++ b/src/config/config.testnet.ts
@@ -22,7 +22,7 @@ export default {
         prestakingStartBlock: 3_023_730,
         prestakingEndBlock: 3_028_050,
         transitionBlock: 3_032_010,
-        validatorsEndpoint: 'https://validators-api-testnet.nuxt.dev/api/v1/validators?with-scores=true',
+        validatorsEndpoint: 'https://validators-api-testnet.nuxt.dev',
         genesis: {
             height: 3032010,
             date: new Date('2024-11-13T20:00:00Z'),
diff --git a/src/network.ts b/src/network.ts
index 5e37081a3..bc24726a0 100644
--- a/src/network.ts
+++ b/src/network.ts
@@ -242,7 +242,8 @@ export async function launchNetwork() {
             payoutType: 'none' | 'direct' | 'restake',
             payoutSchedule: string,
             isMaintainedByNimiq: boolean,
-            icon?: string,
+            logo?: string,
+            logoPath?: string,
             hasDefaultIcon: boolean,
             accentColor: string,
             website: string | null,
@@ -256,8 +257,9 @@ export async function launchNetwork() {
         };
 
         const { config } = useConfig();
+        const url = `${config.staking.validatorsEndpoint}/api/v1/validators?only-known=false`;
         const apiValidators = await retry<ApiValidator[]>(
-            () => fetch(config.staking.validatorsEndpoint).then((res) => res.json()).catch(() => []), 1000, 3,
+            () => fetch(url).then((res) => res.json()).catch(() => []), 1000, 3,
         );
         // TODO: Make it work even in the case this request fails
         const validatorData: Record<string, ApiValidator> = {};
diff --git a/src/stores/Staking.ts b/src/stores/Staking.ts
index e81480e49..17c756731 100644
--- a/src/stores/Staking.ts
+++ b/src/stores/Staking.ts
@@ -34,6 +34,7 @@ export type RegisteredValidator = RawValidator & {
     payoutSchedule: string,
     isMaintainedByNimiq: boolean,
     logo?: string,
+    logoPath?: string,
     hasDefaultIcon: boolean,
     accentColor: string,
     website: string | null,
@@ -167,7 +168,7 @@ export const useStakingStore = createStore({
             };
         },
         setStakes(stakes: Stake[]) {
-            const newStakes: {[address: string]: Stake} = {};
+            const newStakes: { [address: string]: Stake } = {};
 
             for (const stake of stakes) {
                 newStakes[stake.address] = stake;
@@ -197,7 +198,7 @@ export const useStakingStore = createStore({
             };
         },
         setValidators(validators: Validator[]) {
-            const newValidators: {[address: string]: Validator} = {};
+            const newValidators: { [address: string]: Validator } = {};
 
             for (const validator of validators) {
                 newValidators[validator.address] = validator;