feat: Transaction details page hints (#331)

aeternity · Jun 29, 2023 · 635e6ac · 635e6ac
1 parent 09f88f5
commit 635e6ac
Show file tree

Hide file tree

Showing 38 changed files with 511 additions and 52 deletions.
diff --git a/src/components/AccountTransactionsTableCondensed.vue b/src/components/AccountTransactionsTableCondensed.vue
@@ -75,7 +75,7 @@
 </template>
 
 <script setup>
-import { transactionsHints } from '../utils/hints/transactionsHints'
+import { transactionsHints } from '@/utils/hints/transactionsHints'
 import { accountHints } from '@/utils/hints/accountHints'
 import TransactionCell from '@/components/TransactionCell'
 import ValueHashEllipsed from '@/components/ValueHashEllipsed'

diff --git a/src/components/ContractCallTransactionsTable.vue b/src/components/ContractCallTransactionsTable.vue
@@ -5,7 +5,7 @@
         <th>Hash</th>
         <th>Time</th>
         <th>Caller</th>
-        <th>Entry Point</th>
+        <th>Entrypoint</th>
       </tr>
     </thead>
     <tbody>

diff --git a/src/components/ContractCallTransactionsTableCondensed.vue b/src/components/ContractCallTransactionsTableCondensed.vue
@@ -37,7 +37,7 @@
       </tr>
       <tr class="contract-call-transactions-table-condensed__row">
         <th class="contract-call-transactions-table-condensed__header">
-          Entry Point
+          Entrypoint
         </th>
         <td class="contract-call-transactions-table-condensed__data">
           <app-chip

diff --git a/src/components/ContractsTable.vue b/src/components/ContractsTable.vue
@@ -9,21 +9,21 @@
           </hint-tooltip>
         </th>
         <th>
-          Created
+          Created By
           <hint-tooltip>
-            {{ contractsHints.contractCreated }}
+            {{ contractsHints.createdBy }}
           </hint-tooltip>
         </th>
         <th>
           Hash
           <hint-tooltip>
-            {{ contractsHints.contractTxHash }}
+            {{ contractsHints.hash }}
           </hint-tooltip>
         </th>
         <th>
           Created By
           <hint-tooltip>
-            {{ contractsHints.contractCreator }}
+            {{ contractsHints.creator }}
           </hint-tooltip>
         </th>
       </tr>

diff --git a/src/components/ContractsTableCondensed.vue b/src/components/ContractsTableCondensed.vue
@@ -23,9 +23,9 @@
         <tr class="contracts-table-condensed__row">
           <th class="contracts-table-condensed__header">
             <app-tooltip>
-              Created
+              Created By
               <template #tooltip>
-                {{ contractsHints.contractCreated }}
+                {{ contractsHints.createdBy }}
               </template>
             </app-tooltip>
           </th>
@@ -41,7 +41,7 @@
             <app-tooltip>
               Hash
               <template #tooltip>
-                {{ contractsHints.contractTxHash }}
+                {{ contractsHints.hash }}
               </template>
             </app-tooltip>
           </th>
@@ -56,7 +56,7 @@
             <app-tooltip>
               Created By
               <template #tooltip>
-                {{ contractsHints.contractCreator }}
+                {{ contractsHints.creator }}
               </template>
             </app-tooltip>
           </th>

diff --git a/src/components/OracleEventsQueryPanel.vue b/src/components/OracleEventsQueryPanel.vue
@@ -31,7 +31,7 @@
       </dd>
 
       <dt class="oracle-events-query-panel_term">
-        Response Lifetime:
+        Response TTL:
         <hint-tooltip>
           {{ oraclesHints.responseTtl }}
         </hint-tooltip>

diff --git a/src/components/TransactionCellNameUpdateTx.vue b/src/components/TransactionCellNameUpdateTx.vue
@@ -15,7 +15,7 @@
       {{ transactionData.name_ttl }}
     </app-chip>
     <template #tooltip>
-      Lifetime
+      TTL
     </template>
   </app-tooltip>
 </template>

diff --git a/src/components/TransactionCellOracleExtendTx.vue b/src/components/TransactionCellOracleExtendTx.vue
@@ -8,7 +8,7 @@
       {{ transactionData.oracle_ttl.value }}
     </app-chip>
     <template #tooltip>
-      Lifetime
+      TTL
     </template>
   </app-tooltip>
 </template>

diff --git a/src/components/TransactionGeneralPanel.vue b/src/components/TransactionGeneralPanel.vue
@@ -22,6 +22,9 @@
         <tr class="transaction-general-panel__row">
           <th class="transaction-general-panel__table-header">
             Keyblock Height
+            <hint-tooltip>
+              {{ transactionsHints.keyblockHeight }}
+            </hint-tooltip>
           </th>
           <td class="transaction-general-panel__data">
             {{ transactionDetails.blockHeight }}
@@ -30,6 +33,9 @@
         <tr class="transaction-general-panel__row">
           <th class="transaction-general-panel__table-header">
             Keyblock Confirmations
+            <hint-tooltip>
+              {{ transactionsHints.keyblockConfirmations }}
+            </hint-tooltip>
           </th>
           <td class="transaction-general-panel__data">
             {{ transactionDetails.confirmations }}
@@ -38,6 +44,9 @@
         <tr class="transaction-general-panel__row">
           <th class="transaction-general-panel__table-header">
             Status
+            <hint-tooltip>
+              {{ transactionsHints.status }}
+            </hint-tooltip>
           </th>
           <td class="transaction-general-panel__data">
             <app-chip
@@ -57,6 +66,9 @@
           class="transaction-general-panel__row">
           <th class="transaction-general-panel__table-header">
             Microblock Hash
+            <hint-tooltip>
+              {{ transactionsHints.microblockHash }}
+            </hint-tooltip>
           </th>
           <td class="transaction-general-panel__data">
             <span class="transaction-general-panel__hash">
@@ -72,6 +84,9 @@
           class="transaction-general-panel__row">
           <th class="transaction-general-panel__table-header">
             Time
+            <hint-tooltip>
+              {{ transactionsHints.time }}
+            </hint-tooltip>
           </th>
           <td class="transaction-general-panel__data">
             <datetime-label :datetime="transactionDetails.created"/>
@@ -80,6 +95,9 @@
         <tr class="transaction-general-panel__row">
           <th class="transaction-general-panel__table-header">
             Fee
+            <hint-tooltip>
+              {{ transactionsHints.fee }}
+            </hint-tooltip>
           </th>
           <td class="transaction-general-panel__data">
             {{ formatAePrice(formatAettosToAe(transactionDetails.fee), null) }}
@@ -88,6 +106,9 @@
         <tr class="transaction-general-panel__row">
           <th class="transaction-general-panel__table-header">
             Nonce
+            <hint-tooltip>
+              {{ transactionsHints.nonce }}
+            </hint-tooltip>
           </th>
           <td class="transaction-general-panel__data">
             {{ transactionDetails.nonce }}
@@ -96,6 +117,9 @@
         <tr class="transaction-general-panel__row">
           <th class="transaction-general-panel__table-header">
             API links
+            <hint-tooltip>
+              {{ transactionsHints.apiLinks }}
+            </hint-tooltip>
           </th>
           <td class="transaction-general-panel__data">
             <div class="transaction-general-panel__container">
@@ -125,6 +149,7 @@
 </template>
 
 <script setup>
+import { transactionsHints } from '@/utils/hints/transactionsHints'
 import AppPanel from '@/components/AppPanel'
 import AppChip from '@/components/AppChip'
 import AppIcon from '@/components/AppIcon'

diff --git a/src/components/TransactionPointersPanel.vue b/src/components/TransactionPointersPanel.vue
@@ -10,6 +10,9 @@
         <tr class="transaction-pointers-panel__row">
           <th class="transaction-pointers-panel__table-header">
             Account
+            <hint-tooltip>
+              {{ namesHints.accountPointer }}
+            </hint-tooltip>
           </th>
           <td class="transaction-pointers-panel__data">
             <app-link
@@ -18,9 +21,9 @@
               <span class="transaction-pointers-panel__link-text">
                 {{ pointers.account_pubkey }}
               </span>
-              <span class="transaction-pointers-panel__link-text-ellipse">{{
-                formatEllipseHash(pointers.account_pubkey)
-              }}</span>
+              <span class="transaction-pointers-panel__link-text-ellipse">
+                {{ formatEllipseHash(pointers.account_pubkey) }}
+              </span>
             </app-link>
             <template v-else>
               ---
@@ -30,6 +33,9 @@
         <tr class="transaction-pointers-panel__row">
           <th class="transaction-pointers-panel__table-header">
             Channel
+            <hint-tooltip>
+              {{ namesHints.channelPointer }}
+            </hint-tooltip>
           </th>
           <td class="transaction-pointers-panel__data">
             {{ formatNullable(pointers.channel) }}
@@ -38,6 +44,9 @@
         <tr class="transaction-pointers-panel__row">
           <th class="transaction-pointers-panel__table-header">
             Smart Contract
+            <hint-tooltip>
+              {{ namesHints.contractPointer }}
+            </hint-tooltip>
           </th>
           <td class="transaction-pointers-panel__data">
             <app-link
@@ -46,9 +55,9 @@
               <span class="transaction-pointers-panel__link-text">
                 {{ pointers.contract_pubkey }}
               </span>
-              <span class="transaction-pointers-panel__link-text-ellipse">{{
-                formatEllipseHash(pointers.contract_pubkey)
-              }}</span>
+              <span class="transaction-pointers-panel__link-text-ellipse">
+                {{ formatEllipseHash(pointers.contract_pubkey) }}
+              </span>
             </app-link>
             <template v-else>
               ---
@@ -58,6 +67,9 @@
         <tr class="transaction-pointers-panel__row">
           <th class="transaction-pointers-panel__table-header">
             Oracle
+            <hint-tooltip>
+              {{ namesHints.oraclePointer }}
+            </hint-tooltip>
           </th>
           <td class="transaction-pointers-panel__data">
             {{ formatNullable(pointers.oracle_pubkey) }}
@@ -69,6 +81,7 @@
 </template>
 
 <script setup>
+import { namesHints } from '@/utils/hints/namesHints'
 import AppPanel from '@/components/AppPanel'
 import { formatNullable } from '@/utils/format'
 

diff --git a/src/components/TransactionTypeTableChannelCloseMutualTx.vue b/src/components/TransactionTypeTableChannelCloseMutualTx.vue
@@ -4,6 +4,9 @@
       <tr class="transaction-type-panel-channel-close-mutual-tx__row">
         <th class="transaction-type-panel-channel-close-mutual-tx__table-header">
           Channel ID
+          <hint-tooltip>
+            {{ stateChannelsHints.stateChannelId }}
+          </hint-tooltip>
         </th>
         <td class="transaction-type-panel-channel-close-mutual-tx__data">
           <app-link :to="`/state-channels/${transactionData.channel_id}`">
@@ -14,6 +17,9 @@
       <tr class="transaction-type-panel-channel-close-mutual-tx__row">
         <th class="transaction-type-panel-channel-close-mutual-tx__table-header">
           Initiator / Amount
+          <hint-tooltip>
+            {{ stateChannelsHints.initiatorCloseAmount }}
+          </hint-tooltip>
         </th>
         <td class="transaction-type-panel-channel-close-mutual-tx__data">
           <app-link :to="`/accounts/${transactionData.channel.initiator}`">
@@ -31,6 +37,9 @@
       <tr class="transaction-type-panel-channel-close-mutual-tx__row">
         <th class="transaction-type-panel-channel-close-mutual-tx__table-header">
           Responder / Amount
+          <hint-tooltip>
+            {{ stateChannelsHints.responderCloseAmount }}
+          </hint-tooltip>
         </th>
         <td class="transaction-type-panel-channel-close-mutual-tx__data">
           <app-link :to="`/accounts/${transactionData.channel.responder}`">
@@ -48,6 +57,9 @@
       <tr class="transaction-type-panel-channel-close-mutual-tx__row">
         <th class="transaction-type-panel-channel-close-mutual-tx__table-header">
           Sent By
+          <hint-tooltip>
+            {{ stateChannelsHints.sentBy }}
+          </hint-tooltip>
         </th>
         <td class="transaction-type-panel-channel-close-mutual-tx__data">
           <app-link :to="`/accounts/${transactionData.from_id}`">
@@ -60,6 +72,7 @@
 </template>
 
 <script setup>
+import { stateChannelsHints } from '@/utils/hints/stateChannelsHints'
 import AppLink from '@/components/AppLink'
 import { formatAePrice, formatAettosToAe } from '@/utils/format'
 

diff --git a/src/components/TransactionTypeTableChannelCloseSoloTx.vue b/src/components/TransactionTypeTableChannelCloseSoloTx.vue
@@ -4,6 +4,9 @@
       <tr class="transaction-type-panel-channel-close-solo-tx__row">
         <th class="transaction-type-panel-channel-close-solo-tx__table-header">
           Channel ID
+          <hint-tooltip>
+            {{ stateChannelsHints.stateChannelId }}
+          </hint-tooltip>
         </th>
         <td class="transaction-type-panel-channel-close-solo-tx__data">
           <app-link :to="`/state-channels/${transactionData.channel_id}`">
@@ -14,6 +17,9 @@
       <tr class="transaction-type-panel-channel-close-solo-tx__row">
         <th class="transaction-type-panel-channel-close-solo-tx__table-header">
           Round
+          <hint-tooltip>
+            {{ stateChannelsHints.closeRound }}
+          </hint-tooltip>
         </th>
         <td class="transaction-type-panel-channel-close-solo-tx__data">
           {{ transactionData.round }}
@@ -22,6 +28,9 @@
       <tr class="transaction-type-panel-channel-close-solo-tx__row">
         <th class="transaction-type-panel-channel-close-solo-tx__table-header">
           Initiator
+          <hint-tooltip>
+            {{ stateChannelsHints.initiator }}
+          </hint-tooltip>
         </th>
         <td class="transaction-type-panel-channel-close-solo-tx__data">
           <app-link :to="`/accounts/${transactionData.channel.initiator}`">
@@ -32,6 +41,9 @@
       <tr class="transaction-type-panel-channel-close-solo-tx__row">
         <th class="transaction-type-panel-channel-close-solo-tx__table-header">
           Responder
+          <hint-tooltip>
+            {{ stateChannelsHints.responder }}
+          </hint-tooltip>
         </th>
         <td class="transaction-type-panel-channel-close-solo-tx__data">
           <app-link :to="`/accounts/${transactionData.channel.responder}`">
@@ -42,6 +54,9 @@
       <tr class="transaction-type-panel-channel-close-solo-tx__row">
         <th class="transaction-type-panel-channel-close-solo-tx__table-header">
           Proposed By
+          <hint-tooltip>
+            {{ stateChannelsHints.closeProposedBy }}
+          </hint-tooltip>
         </th>
         <td class="transaction-type-panel-channel-close-solo-tx__data">
           <app-link :to="`/accounts/${transactionData.from_id}`">
@@ -54,6 +69,7 @@
 </template>
 
 <script setup>
+import { stateChannelsHints } from '@/utils/hints/stateChannelsHints'
 import AppLink from '@/components/AppLink'
 
 defineProps({