Merge pull request #1499 from cosmos/jordan/1496-val-address

Jordan/1496 misc fixes
luniehq · Oct 31, 2018 · c18dbb0 · c18dbb0
2 parents 00cf836 + fda0ac6
commit c18dbb0
Show file tree

Hide file tree

Showing 13 changed files with 91 additions and 21 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -26,6 +26,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 * Updated PR template @fedekunze
 * [\#1454](https://github.com/cosmos/voyager/issues/1454) Updated a bunch of words to (hopefully) be clearer. @jbibla
 * [\#1473](https://github.com/cosmos/voyager/issues/1473) added "percent of vote" to validator in vuex module instead of in component @jbibla
+* [\#1496](https://github.com/cosmos/voyager/issues/1496) display validator pub_key instead of operator_address on livalidator and validator profile @jbibla
 
 ### Fixed
 

diff --git a/app/src/renderer/components/common/TmBalance.vue b/app/src/renderer/components/common/TmBalance.vue
@@ -114,7 +114,6 @@ export default {
 
 .tabs
   display flex
-  margin-left 2rem
   margin-top 2rem
 
   .tab

diff --git a/app/src/renderer/components/staking/LiValidator.vue b/app/src/renderer/components/staking/LiValidator.vue
@@ -2,10 +2,10 @@
 li.li-validator(:class='styles')
   router-link(:to="{ name: 'validator', params: { validator: validator.id }}")
     .li-validator__value.name
-      span.validator-profile__status(v-bind:class="statusColor" v-tooltip.top="status")
       img.avatar(v-if="validator.keybase" :src="validator.keybase.avatarUrl" width="48" height="48")
       img.avatar(v-else src="~assets/images/validator-icon.svg" width="48" height="48")
       .vert
+        span.validator-profile__status(v-bind:class="statusColor" v-tooltip.top="status")
         .top {{ validator.description.moniker }}
         short-bech32(:address="validator.operator_address")
     .li-validator__value.your-votes
@@ -137,6 +137,7 @@ export default {
 
 .li-validator
   margin 0.5rem 0rem 0.5rem 2rem
+  width 100%
 
 .li-validator a
   display flex
@@ -209,14 +210,20 @@ export default {
     display flex
     flex-direction column
     color var(--bright)
+    margin-left 1rem
     padding-left 1rem
+    position relative
 
     .top
       padding-bottom 0.5rem
       line-height 1rem
       font-size 1rem
       font-weight 500
 
+    .validator-profile__status
+      left 0
+      top 5px
+
     .bottom
       font-size sm
       line-height sm

diff --git a/app/src/renderer/components/staking/PageStaking.vue b/app/src/renderer/components/staking/PageStaking.vue
@@ -1,5 +1,5 @@
 <template lang="pug">
-tm-page(data-title="Staking")
+tm-page(data-title="Staking").staking
   template(slot="menu-body")
     tm-balance(:tabs="tabs")
 

diff --git a/app/src/renderer/components/staking/PageValidator.vue b/app/src/renderer/components/staking/PageValidator.vue
@@ -119,7 +119,7 @@ import { mapGetters } from "vuex"
 import num from "scripts/num"
 import { TmBtn, TmListItem, TmPage, TmPart, TmToolBar } from "@tendermint/ui"
 import TmModal from "common/TmModal"
-import { TmDataError } from "common/TmDataError"
+import TmDataError from "common/TmDataError"
 import { shortAddress, ratToBigNumber } from "scripts/common"
 import DelegationModal from "staking/DelegationModal"
 import UndelegationModal from "staking/UndelegationModal"

diff --git a/app/src/renderer/components/staking/PanelSort.vue b/app/src/renderer/components/staking/PanelSort.vue
@@ -3,7 +3,7 @@
   v-for="(property, i) in properties",
   @click="orderBy(property.value, $event)",
   :class="property.class")
-  .label(v-tooltip.top="property.tooltip" v-if="i !== 0")
+  .label(v-tooltip.top="property.tooltip")
     .label-text {{ property.title }}
 </template>
 

diff --git a/app/src/renderer/components/staking/TabMyDelegations.vue b/app/src/renderer/components/staking/TabMyDelegations.vue
@@ -61,6 +61,10 @@ export default {
 .info-button
   color var(--link)
 
+.staking
+  .tm-data-msg
+    margin 1rem 0 0 2rem
+
 .check-out-message
   background var(--app-fg)
   border 1px solid var(--bc-dim)

diff --git a/test/unit/specs/components/staking/LiValidator.spec.js b/test/unit/specs/components/staking/LiValidator.spec.js
@@ -11,7 +11,7 @@ describe(`LiValidator`, () => {
       propsData: {
         validator: {
           id: `abc`,
-          pub_key: `12345`,
+          pub_key: `cosmosvalpub12345`,
           operator_address: lcdClientMock.validators[1],
           tokens: `190000000000`,
           delegator_shares: `190000000000`,

diff --git a/test/unit/specs/components/staking/__snapshots__/LiValidator.spec.js.snap b/test/unit/specs/components/staking/__snapshots__/LiValidator.spec.js.snap
@@ -11,9 +11,6 @@ exports[`LiValidator has the expected html structure 1`] = `
     <div
       class="li-validator__value name"
     >
-      <span
-        class="validator-profile__status green"
-      />
       <img
         class="avatar"
         height="48"
@@ -23,6 +20,9 @@ exports[`LiValidator has the expected html structure 1`] = `
       <div
         class="vert"
       >
+        <span
+          class="validator-profile__status green"
+        />
         <div
           class="top"
         >

diff --git a/test/unit/specs/components/staking/__snapshots__/PageStaking.spec.js.snap b/test/unit/specs/components/staking/__snapshots__/PageStaking.spec.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`PageStaking has the expected html structure 1`] = `
-"<div class=\\"tm-page\\" data-title=\\"Staking\\">
+"<div class=\\"tm-page staking\\" data-title=\\"Staking\\">
    <header class=\\"tm-page-header\\">
       <div class=\\"tm-page-header-container\\">
          <div class=\\"tm-page-header-text\\">

diff --git a/test/unit/specs/components/staking/__snapshots__/PageValidator.spec.js.snap b/test/unit/specs/components/staking/__snapshots__/PageValidator.spec.js.snap
@@ -922,7 +922,43 @@ exports[`PageValidator shows an error if the validator couldn't be found 1`] = `
     class="tm-page-main"
   >
     <!---->
-    <tm-data-error />
+    <div
+      class="tm-data-msg"
+    >
+      <div
+        class="tm-data-msg__icon"
+      >
+        <i
+          class="material-icons"
+        >
+          sentiment_very_dissatisfied
+        </i>
+      </div>
+      <div
+        class="tm-data-msg__text"
+      >
+        <div
+          class="tm-data-msg__title"
+        >
+          <div>
+            Aw shucks!
+          </div>
+        </div>
+        <div
+          class="tm-data-msg__subtitle"
+        >
+          <div>
+            Even though you're connected a full node, we can't display this data for you right now. Please try again later or 
+            <a
+              href="https://github.com/cosmos/voyager/issues"
+            >
+              file a bug report
+            </a>
+            . Apologies!
+          </div>
+        </div>
+      </div>
+    </div>
   </main>
 </div>
 `;

diff --git a/test/unit/specs/components/staking/__snapshots__/PanelSort.spec.js.snap b/test/unit/specs/components/staking/__snapshots__/PanelSort.spec.js.snap
@@ -10,7 +10,15 @@ exports[`PanelSort has the expected html structure 1`] = `
     <div
       class="sort-by"
     >
-      <!---->
+      <div
+        class="label"
+      >
+        <div
+          class="label-text"
+        >
+          ID
+        </div>
+      </div>
     </div>
     <div
       class="sort-by"

diff --git a/test/unit/specs/components/staking/__snapshots__/TableValidators.spec.js.snap b/test/unit/specs/components/staking/__snapshots__/TableValidators.spec.js.snap
@@ -6,8 +6,12 @@ exports[`TableValidators has the expected html structure 1`] = `
       <div class=\\"panel-sort\\">
          <div class=\\"panel-sort-container\\">
             <div class=\\"sort-by name\\">
-               <!---->
-            </div>
+               <div class=\\"label\\">
+                  <div class=\\"label-text\\">
+                     Moniker
+                  </div>
+</div>
+</div>
 <div class=\\"sort-by your-votes\\">
    <div class=\\"label\\">
       <div class=\\"label-text\\">
@@ -56,8 +60,9 @@ exports[`TableValidators has the expected html structure 1`] = `
    <li class=\\"li-validator li-validator-validator \\">
       <a href=\\"#/\\" class=\\"router-link-exact-active router-link-active\\">
       <div class=\\"li-validator__value name\\">
-         <span class=\\"validator-profile__status green\\"></span><img src=\\"~assets/images/validator-icon.svg\\" width=\\"48\\" height=\\"48\\" class=\\"avatar\\">
+         <img src=\\"~assets/images/validator-icon.svg\\" width=\\"48\\" height=\\"48\\" class=\\"avatar\\">
          <div class=\\"vert\\">
+            <span class=\\"validator-profile__status green\\"></span>
             <div class=\\"top\\">
                good_greg
             </div>
@@ -97,8 +102,9 @@ exports[`TableValidators has the expected html structure 1`] = `
    <li class=\\"li-validator li-validator-validator \\">
       <a href=\\"#/\\" class=\\"router-link-exact-active router-link-active\\">
       <div class=\\"li-validator__value name\\">
-         <span class=\\"validator-profile__status red\\"></span><img src=\\"~assets/images/validator-icon.svg\\" width=\\"48\\" height=\\"48\\" class=\\"avatar\\">
+         <img src=\\"~assets/images/validator-icon.svg\\" width=\\"48\\" height=\\"48\\" class=\\"avatar\\">
          <div class=\\"vert\\">
+            <span class=\\"validator-profile__status red\\"></span>
             <div class=\\"top\\">
                herr_schmidt_revoked
             </div>
@@ -138,8 +144,9 @@ exports[`TableValidators has the expected html structure 1`] = `
    <li class=\\"li-validator li-validator-validator \\">
       <a href=\\"#/\\" class=\\"router-link-exact-active router-link-active\\">
       <div class=\\"li-validator__value name\\">
-         <span class=\\"validator-profile__status green\\"></span><img src=\\"~assets/images/validator-icon.svg\\" width=\\"48\\" height=\\"48\\" class=\\"avatar\\">
+         <img src=\\"~assets/images/validator-icon.svg\\" width=\\"48\\" height=\\"48\\" class=\\"avatar\\">
          <div class=\\"vert\\">
+            <span class=\\"validator-profile__status green\\"></span>
             <div class=\\"top\\">
                mr_mounty
             </div>
@@ -193,7 +200,15 @@ exports[`TableValidators should filter the delegates 1`] = `
         <div
           class="sort-by name"
         >
-          <!---->
+          <div
+            class="label"
+          >
+            <div
+              class="label-text"
+            >
+              Moniker
+            </div>
+          </div>
         </div>
         <div
           class="sort-by your-votes"
@@ -288,9 +303,6 @@ exports[`TableValidators should filter the delegates 1`] = `
           <div
             class="li-validator__value name"
           >
-            <span
-              class="validator-profile__status green"
-            />
             <img
               class="avatar"
               height="48"
@@ -300,6 +312,9 @@ exports[`TableValidators should filter the delegates 1`] = `
             <div
               class="vert"
             >
+              <span
+                class="validator-profile__status green"
+              />
               <div
                 class="top"
               >
-Original file line number
+Diff line change
@@ Expand Up / @@ -114,7 +114,6 @@ export default { @@
     .tabs
       display flex
-      margin-left 2rem
       margin-top 2rem
       .tab
@@ Expand Down @@