improve text in validator panel

0LNetworkCommunity · Nov 30, 2023 · 2ac683d · 2ac683d
1 parent 6b121fe
commit 2ac683d
Show file tree

Hide file tree

Showing 8 changed files with 95 additions and 67 deletions.
diff --git a/src/api/payloads/system.ts b/src/api/payloads/system.ts
@@ -24,8 +24,6 @@ export const infra_balance: ViewObj = {
   arguments: [],
 }
 
-
-
 export const getPoFBidders = (filter_unqualified: boolean): ViewObj => {
   return {
     function: '0x1::proof_of_fee::get_bidders_and_bids',
@@ -41,3 +39,9 @@ export const getPoFErrors = (addr: string): ViewObj => {
     arguments: [addr],
   }
 }
+
+export const getConsensusReward: ViewObj = {
+  function: '0x1::proof_of_fee::get_consensus_reward',
+  type_arguments: [],
+  arguments: [],
+}
diff --git a/src/api/payloads/validators.ts b/src/api/payloads/validators.ts
@@ -18,7 +18,6 @@ export const validator_bid_payload = (address: string): ViewObj => ({
   arguments: [address],
 })
 
-
 export const validator_grade_payload = (address: string): ViewObj => ({
   function: '0x1::grade::get_validator_grade',
   type_arguments: [],

diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
@@ -8,7 +8,7 @@
   import Validators from '../ui/Validators.svelte'
   import AccountView from '../ui/AccountView.svelte'
   import BoundaryStatus from '../ui/BoundaryStatus.svelte'
-    // import GovEvents from '../ui/GovEvents.svelte'
+  // import GovEvents from '../ui/GovEvents.svelte'
 
   onMount(async () => {
     await initApi() // ONLY DO THIS ONCE ON LOAD
@@ -17,40 +17,40 @@
 
     setInterval(
       refresh,
-      30000 // 30 secs
+      30000, // 30 secs
     )
   })
 </script>
 
 <main class="uk-text-small">
   <div class="uk-grid">
     <div class="uk-column-1-2 uk-margin-bottom">
-    <div class="">
-      {#if $apiUrl}
-        <input
-          class="uk-input"
-          type="text"
-          placeholder={$apiUrl}
-          aria-label="Input"
-          bind:value={$apiUrl}
-        />
-        <button class="uk-button uk-button-default"
-        on:click={setApi($apiUrl)}>update url</button>
-        <button class="uk-button uk-button-default" on:click={refresh}>refresh</button>
-        note: {$apiUrlNote}
+      <div class="">
+        {#if $apiUrl}
+          <input
+            class="uk-input"
+            type="text"
+            placeholder={$apiUrl}
+            aria-label="Input"
+            bind:value={$apiUrl}
+          />
+          <button class="uk-button uk-button-default" on:click={setApi($apiUrl)}>update url</button>
+          <button class="uk-button uk-button-default" on:click={refresh}>refresh</button>
+          note: {$apiUrlNote}
+        {/if}
+      </div>
+    </div>
+    <div class="uk-flex">
+      {#if $selectedAccount && $selectedAccount.address}
+        <AccountView />
+      {:else}
+        <SystemInfo />
+        <BoundaryStatus />
+        <!-- <GovEvents/> -->
       {/if}
     </div>
-  </div>
-  <div class="uk-flex">
-    {#if $selectedAccount && $selectedAccount.address}
-      <AccountView />
-    {:else}
-      <SystemInfo />
-      <BoundaryStatus />
-      <!-- <GovEvents/> -->
-    {/if}
     <div class="uk-flex">
-        <Validators />
+      <Validators />
     </div>
   </div>
 </main>
diff --git a/src/store/index.ts b/src/store/index.ts
@@ -1,7 +1,14 @@
 import { writable, get } from 'svelte/store'
 import moment from 'moment'
 import { postViewFunc, getIndex, getAccountResource, getEventList } from '../api'
-import type { UserAccount, valData, IndexData, SystemInfo, ProofOfFee, govEventData } from '../types'
+import type {
+  UserAccount,
+  valData,
+  IndexData,
+  SystemInfo,
+  ProofOfFee,
+  govEventData,
+} from '../types'
 import * as systemPayloads from '../api/payloads/system'
 import * as validatorPayloads from '../api/payloads/validators'
 import * as commonPayloads from '../api/payloads/common'
@@ -82,7 +89,7 @@ export const populateVouchers = async (user: UserAccount): Promise<UserAccount>
     postViewFunc(validatorPayloads.vouchers_in_val_set_payload(user.address)),
   ]
 
-  const [buddies_res, buddies_in_set_res,] = await Promise.all(requests)
+  const [buddies_res, buddies_in_set_res] = await Promise.all(requests)
 
   user.active_vouchers = buddies_in_set_res[0]
   user.all_vouchers = buddies_res[0]
@@ -91,21 +98,18 @@ export const populateVouchers = async (user: UserAccount): Promise<UserAccount>
 }
 
 export const populateBalance = async (user: UserAccount): Promise<UserAccount> => {
-  const requests = [
-    postViewFunc(commonPayloads.account_balance_payload(user.address)),
-  ]
+  const requests = [postViewFunc(commonPayloads.account_balance_payload(user.address))]
 
   const [bal_res] = await Promise.all(requests)
 
   user.balance = {
     unlocked: bal_res[0],
     total: bal_res[1],
-  };
+  }
 
   return user
 }
 
-
 export const getSystemInfo = async () => {
   try {
     // TODO(zoz): it would be better to let these be async and parallel
@@ -116,22 +120,19 @@ export const getSystemInfo = async () => {
       postViewFunc(systemPayloads.infra_balance),
       getAccountResource('0x1', '0x1::musical_chairs::Chairs'),
       getAccountResource('0x1', '0x1::epoch_boundary::BoundaryStatus'),
+      getAccountResource('0x1', '0x1::proof_of_fee::ConsensusReward'),
     ]
-    const [
-      fees,
-      epochResponse,
-      vdfDifficulty,
-      infraBalance,
-      chairs,
-      boundaryStatus,
-    ] = await Promise.all(requests)
+    const [fees, epochResponse, vdfDifficulty, infraBalance, chairs, boundaryStatus, cr] =
+      await Promise.all(requests)
 
     const duration = moment.duration(Number(epochResponse[0]), 'seconds') // Cast to Number
     const epoch = `${Math.floor(duration.asHours())} hrs : ${duration.minutes()} mins`
     const indexData = get(indexDataStore)
 
+    console.log('cr', cr)
     // TODO(zoz): make this an interface
     const newSystemInfo: SystemInfo = {
+      consensus_reward: cr.nominal_reward,
       fees: fees[0],
       epoch_duration: epoch,
       vdf: vdfDifficulty,
@@ -157,8 +158,7 @@ export const refresh = async () => {
     getIndexData()
     getSystemInfo()
     getValidators()
-    getEventList(govEvents())
-      .then(res => govStore.set(res))
+    getEventList(govEvents()).then((res) => govStore.set(res))
   } catch (error) {
     console.error(`Failed to refresh: ${error}`)
   }

diff --git a/src/types/index.ts b/src/types/index.ts
@@ -11,6 +11,7 @@ export interface IndexData {
 }
 
 export interface SystemInfo {
+  consensus_reward: number
   fees: number | string
   epoch_duration: string
   chain_id: number
@@ -29,7 +30,7 @@ export interface SystemInfo {
 }
 
 export interface ProofOfFee {
-  val_universe: string[],
+  val_universe: string[]
   bidders: string[]
   bids: number[]
   qualified: string[]
@@ -41,7 +42,7 @@ export interface SlowWalletBalance {
 }
 export interface UserAccount {
   address: string
-  in_val_set?: boolean,
+  in_val_set?: boolean
   active_vouchers?: string[] // Array of addresses
   all_vouchers?: string[] // Array of addresses
   balance?: SlowWalletBalance
@@ -54,10 +55,10 @@ export interface valData {
 }
 export interface govEventData {
   data: {
-    num_votes: string,
-    proposal_id: string,
-    should_pass: boolean,
-    stake_pool: string,
+    num_votes: string
+    proposal_id: string
+    should_pass: boolean
+    stake_pool: string
     voter: string
   }
-}
+}
diff --git a/src/ui/AccountTable.svelte b/src/ui/AccountTable.svelte
@@ -1,30 +1,37 @@
 <script lang="ts">
   import { postViewFunc } from '../api'
   import { account_balance_payload } from '../api/payloads/common'
+  import { getPoFErrors } from '../api/payloads/system'
   import {
     validator_bid_payload,
     validator_grade_payload,
     vouchers_in_val_set_payload,
   } from '../api/payloads/validators'
-  import { setAccount } from '../store'
+  import { setAccount, systemInfo } from '../store'
   import type { UserAccount } from '../types'
+  import { mapPoFErrors } from '../types/proof_of_fee'
   import { scaleCoin } from '../utils/coin'
 
   export let profiles: UserAccount[] = []
+
+  const getErrors = async (addr: string): Promise<string[]> => {
+    return postViewFunc(getPoFErrors(addr)).then((res) => {
+      return mapPoFErrors(res[0])
+    })
+  }
 </script>
 
 <main>
-  <!-- {JSON.stringify(profiles, null, 2)} -->
-
   <table class="uk-table uk-table-responsive uk-table-divider">
     <thead>
       <tr>
         <th>Address</th>
         <th>In Set</th>
-        <th>Bid</th>
+        <th>Bid : Entry Fee</th>
         <th>Active Vouchers</th>
-        <th>Balance</th>
-        <th>Grade</th>
+        <th>Balance (Locked)</th>
+        <th>Proposing: success / fail</th>
+        <th>Qualification Errors</th>
       </tr>
     </thead>
     <tbody>
@@ -48,7 +55,7 @@
               {#await postViewFunc(validator_bid_payload(a.address))}
                 ...
               {:then res}
-                {res[0] / 10}%
+                {res[0] / 10}% : {scaleCoin((res[0] / 1000) * $systemInfo.consensus_reward) }
               {/await}
             </td>
             <!-- <td>{(a.all_vouchers && a.all_vouchers.length) || 'no buddies'}</td> -->
@@ -76,6 +83,16 @@
                 {res[0]} : {res[1]}/{res[2]}
               {/await}
             </td>
+
+            <td>
+              {#await getErrors(a.address)}
+                ...
+              {:then errs}
+                {errs}
+              {:catch error}
+                <p style="color: red">{error.message}</p>
+              {/await}
+            </td>
           </tr>
         {/each}
       {/if}

diff --git a/src/ui/SystemInfo.svelte b/src/ui/SystemInfo.svelte
@@ -13,9 +13,11 @@
       <ul>
         <li>Chain ID: {$systemInfo.chain_id}</li>
         <li>Epoch: {$systemInfo.epoch}</li>
-        <li>Ledger Version: {$systemInfo.ledger_version}</li>
-        <li>Oldest Ledger Version: {$systemInfo.oldest_ledger_version}</li>
-        <li>Fees: {$systemInfo.fees}</li>
+        <li>Ledger version: {$systemInfo.ledger_version}</li>
+        <li>Oldest ledger version: {$systemInfo.oldest_ledger_version}</li>
+        <li>Fees collected: {scaleCoin($systemInfo.fees)}</li>
+        <li>Epoch reward: {scaleCoin($systemInfo.consensus_reward)}</li>
+
       </ul>
       <ul>
         <!-- Display part 2 of the system information -->

diff --git a/src/ui/ValidatorSet.svelte b/src/ui/ValidatorSet.svelte
@@ -1,23 +1,23 @@
 <script lang="ts">
-  import { fetchUserAccounts, valDataStore } from '../store'
+  import { fetchUserAccounts, systemInfo, valDataStore } from '../store'
   import type { UserAccount } from '../types'
   import AccountTable from './AccountTable.svelte'
+  import { scaleCoin } from '../utils/coin'
 
   let profiles: UserAccount[]
   valDataStore.subscribe((valState) => {
     if (valState) {
-      fetchUserAccounts(valState.eligible_validators).then((r) =>
-      {
+      fetchUserAccounts(valState.eligible_validators).then((r) => {
         r.map((el) => {
-          el.in_val_set = valState.current_list.includes(el.address);
+          el.in_val_set = valState.current_list.includes(el.address)
         })
         r.sort(sortVals)
         profiles = r
       })
     }
   })
 
-  function sortVals(a: UserAccount, b: UserAccount) {
+  function sortVals(a: UserAccount) {
     if (a.in_val_set) return -1 // sort to top
     else return 1
   }
@@ -32,6 +32,11 @@
         0}):
     </h5>
   {/if}
+
+  {#if $systemInfo}
+    Epoch Reward: {scaleCoin($systemInfo.consensus_reward)}
+  {/if}
+
   {#if profiles && profiles.length > 0}
     <AccountTable {profiles} />
   {:else}