Merge pull request #723 from telosnetwork/573-redesign-transaction-pa…

…ge-internal-transactions-tab #573 | Internal Transactions Flat
telosnetwork · May 7, 2024 · 9bdf1ea · 9bdf1ea
2 parents dc1f395 + 047fb95
commit 9bdf1ea
Show file tree

Hide file tree

Showing 23 changed files with 687 additions and 103 deletions.
diff --git a/src/components/AddressField.vue b/src/components/AddressField.vue
@@ -1,19 +1,15 @@
 <!-- eslint-disable @typescript-eslint/no-explicit-any -->
 <script setup lang="ts">
-import { ref, watch, onMounted } from 'vue';
+import { ref, watch, onMounted, computed } from 'vue';
 
 import { contractManager } from 'src/boot/telosApi';
 import { getIcon } from 'src/lib/token-utils';
 import { toChecksumAddress } from 'src/lib/utils';
 
 import CopyButton from 'components/CopyButton.vue';
+import { useStore } from 'vuex';
 
 const props = defineProps({
- highlightAddress: {
- type: String,
- required: false,
- default: '',
- },
  address: {
  type: String,
  required: true,
@@ -38,9 +34,12 @@ const props = defineProps({
  type: Boolean,
  default: false,
  },
+ useHighlight: {
+ type: Boolean,
+ default: true,
+ },
 });
 
-const emit = defineEmits(['highlight']);
 
 const displayName = ref('');
 const fullName = ref(toChecksumAddress(props.address));
@@ -60,7 +59,9 @@ const restart = async () => {
  await getDisplay();
 };
 
-
+const $store = useStore();
+const setHighlightAddress = (method: string) => props.useHighlight ? $store.dispatch('general/setHighlightAddress', method) : null;
+const highlightAddress = computed(() => props.useHighlight ? $store.state.general.highlightAddress : '');
 
 watch(() => props.address, async () => {
  restart();
@@ -124,18 +125,14 @@ const loadContract = async () => {
  }
 };
 
-function emitHighlight(val: string) {
- emit('highlight', val);
-}
-
 </script>
 
 <template>
 <div
  :key="displayName + checksum"
  :class="['c-address-field', props.class]"
- @mouseover="emitHighlight(checksum)"
- @mouseleave="emitHighlight('')"
+ @mouseover="setHighlightAddress(checksum)"
+ @mouseleave="setHighlightAddress('')"
 >
  <router-link
  :to="`/address/${checksum}`"

diff --git a/src/components/AddressOverview.vue b/src/components/AddressOverview.vue
@@ -51,6 +51,11 @@ onBeforeMount(() => {
  width="18"
  >
  {{ getBalanceDisplay(tokenQty) }}
+ <ValueField
+ :value="tokenQty"
+ :symbol="'TLOS'"
+ :decimals="WEI_PRECISION"
+ />
  </div>
  </q-card-section>
  <q-card-section v-if="!loadingComplete" >

diff --git a/src/components/ContractMoreInfo.vue b/src/components/ContractMoreInfo.vue
@@ -36,6 +36,7 @@ const props = defineProps({
  <AddressField
  :address="props.address"
  :truncate="18"
+ :useHighlight="false"
  />
  <CopyButton
  :text="props.address"