Small fixes before release

Author: GusevPM

components/AddressBadge.vue

@@ -4,45 +4,49 @@ defineProps({
 		type: String,
 		required: true,
 	},
+	color: {
+		type: String,
+		default: "primary"
+	}
 })
 </script>
 
 <template>
 	<NuxtLink :to="`/address/${hash}`" @click.stop>
 		<Flex align="center" gap="6">
 			<template v-if="hash.startsWith('celestiavaloper')">
-				<Text size="13" weight="600" color="primary"> celestiavaloper </Text>
+				<Text size="13" weight="600" :color="color"> celestiavaloper </Text>
 
 				<Flex align="center" gap="3">
 					<div v-for="dot in 3" class="dot" />
 				</Flex>
 
-				<Text size="13" weight="600" color="primary">
+				<Text size="13" weight="600" :color="color">
 					{{ hash.slice(hash.length - 4, hash.length) }}
 				</Text>
 			</template>
 			<template v-else-if="hash.startsWith('celestiavalcons')">
-				<Text size="13" weight="600" color="primary"> celestiavalcons </Text>
+				<Text size="13" weight="600" :color="color"> celestiavalcons </Text>
 
 				<Flex align="center" gap="3">
 					<div v-for="dot in 3" class="dot" />
 				</Flex>
 
-				<Text size="13" weight="600" color="primary">
+				<Text size="13" weight="600" :color="color">
 					{{ hash.slice(hash.length - 4, hash.length) }}
 				</Text>
 			</template>
 			<template v-else>
-				<Text size="13" weight="600" color="primary"> celestia </Text>
+				<Text size="13" weight="600" :color="color"> celestia </Text>
 
 				<Flex align="center" gap="3">
 					<div v-for="dot in 3" class="dot" />
 				</Flex>
 
-				<Text size="13" weight="600" color="primary">
+				<Text size="13" weight="600" :color="color">
 					{{ hash.slice(hash.length - 4, hash.length) }}
 				</Text>
 			</template>
 		</Flex>
 	</NuxtLink>
-</template>
+</template>

components/modules/block/BlockOverview.vue

@@ -731,11 +731,11 @@ const handleViewRawTransactions = () => {
 					</Flex>
 
 					<!-- Pagination -->
-					<Flex v-if="transactions.length < 10" align="center" gap="6" :class="$style.pagination">
-						<Button @click="page = 1" type="secondary" size="mini" :disabled="page === 1 || transactions.length !== 10">
+					<Flex v-if="transactions.length" align="center" gap="6" :class="$style.pagination">
+						<Button @click="page = 1" type="secondary" size="mini" :disabled="page === 1">
 							<Icon name="arrow-left-stop" size="12" color="primary" />
 						</Button>
-						<Button type="secondary" @click="handlePrev" size="mini" :disabled="page === 1 || transactions.length !== 10">
+						<Button type="secondary" @click="handlePrev" size="mini" :disabled="page === 1">
 							<Icon name="arrow-left" size="12" color="primary" />
 						</Button>
 

components/modules/tx/TxOverview.vue

@@ -12,7 +12,7 @@ import MessageTypeBadge from "@/components/shared/MessageTypeBadge.vue"
 import MessagesTable from "@/components/modules/tx/MessagesTable.vue"
 
 /** Services */
-import { comma, tia } from "@/services/utils"
+import { comma, splitAddress, tia } from "@/services/utils"
 
 /** API */
 import { fetchTxMessages } from "@/services/api/tx"
@@ -231,6 +231,15 @@ const handleViewRawTransaction = () => {
 					<Flex direction="column" gap="16">
 						<Text size="12" weight="600" color="secondary">Details</Text>
 
+						<Flex align="center" justify="between">
+							<Text size="12" weight="600" color="tertiary"> Signer</Text>
+							<Flex align="center" gap="6">
+								<AddressBadge :hash="tx.signers[0]" color="secondary" />
+
+								<CopyButton :text="tx.signers[0]" />
+							</Flex>
+							<!-- <Text size="12" weight="600" color="secondary"> {{ splitAddress(tx.signers[0]) }} </Text> -->
+						</Flex>
 						<Flex align="center" justify="between">
 							<Text size="12" weight="600" color="tertiary"> Events</Text>
 							<Text size="12" weight="600" color="secondary"> {{ tx.events_count }} </Text>

pages/txs.vue

@@ -13,7 +13,7 @@ import Checkbox from "@/components/ui/Checkbox.vue"
 import MessageTypeBadge from "@/components/shared/MessageTypeBadge.vue"
 
 /** Services */
-import { comma, space, tia } from "@/services/utils"
+import { comma, space, splitAddress, tia } from "@/services/utils"
 import { MsgTypes } from "@/services/constants/messages"
 
 /** API */
@@ -203,6 +203,7 @@ const config = reactive({
 	columns: {
 		time: true,
 		messages: true,
+		signer: true,
 		block: true,
 		gas: true,
 		fee: true,
@@ -490,6 +491,9 @@ const handleNext = () => {
 								<Checkbox v-model="config.columns.messages">
 									<Text size="12" weight="500" color="primary">Messages</Text>
 								</Checkbox>
+								<Checkbox v-model="config.columns.signer">
+									<Text size="12" weight="500" color="primary">Signer</Text>
+								</Checkbox>
 								<Checkbox v-model="config.columns.block">
 									<Text size="12" weight="500" color="primary">Block</Text>
 								</Checkbox>
@@ -627,6 +631,13 @@ const handleNext = () => {
 										</Flex>
 									</NuxtLink>
 								</td>
+								<td v-if="config.columns.signer" style="width: 1px">
+									<NuxtLink :to="`/tx/${tx.hash}`">
+										<Flex align="center">
+											<Text size="13" weight="600" color="primary"> {{ splitAddress(tx.signers[0]) }} </Text>
+										</Flex>
+									</NuxtLink>
+								</td>
 								<td v-if="config.columns.block" style="width: 1px">
 									<NuxtLink :to="`/tx/${tx.hash}`">
 										<Flex align="center">
@@ -702,7 +713,7 @@ const handleNext = () => {
 
 <style module>
 .wrapper {
-	max-width: calc(var(--base-width) + 48px);
+	max-width: calc(var(--base-width) + 124px);
 
 	padding: 40px 24px 60px 24px;
 }