From 56199cf54cc26c75eb9bc9395010de7e73b5cdde Mon Sep 17 00:00:00 2001
From: Antonio Pitasi <antonio@pitasi.dev>
Date: Mon, 15 Jul 2024 12:05:32 +0200
Subject: [PATCH] fix(spaceward): show correct tx count and more details for tx
 msgs

---
 spaceward/src/components/BlockDetails.tsx    |  2 +-
 spaceward/src/components/TxMsgDetails.tsx    | 31 ++++++++++++++++++++
 spaceward/src/features/explorer/Explorer.tsx |  7 +++--
 3 files changed, 36 insertions(+), 4 deletions(-)

diff --git a/spaceward/src/components/BlockDetails.tsx b/spaceward/src/components/BlockDetails.tsx
index 7fe9b15c7..d1e1f2cdf 100644
--- a/spaceward/src/components/BlockDetails.tsx
+++ b/spaceward/src/components/BlockDetails.tsx
@@ -28,7 +28,7 @@ function BlockDetails({ block, txs }: { block: Block; txs: Tx[] }) {
 					{formatDateTime(block.header.time)}
 				</CardRow>
 				<CardRow label="Transactions">
-					{block.data.txs.length} txs
+					{txs.length} txs
 				</CardRow>
 
 				<div className="flex flex-row gap-4 pt-8">
diff --git a/spaceward/src/components/TxMsgDetails.tsx b/spaceward/src/components/TxMsgDetails.tsx
index f05a83e74..cb97fc3cf 100644
--- a/spaceward/src/components/TxMsgDetails.tsx
+++ b/spaceward/src/components/TxMsgDetails.tsx
@@ -11,6 +11,7 @@ import AddressAvatar from "./AddressAvatar";
 import { MsgSend } from "@wardenprotocol/wardenjs/codegen/cosmos/bank/v1beta1/tx";
 import { MsgApproveAction, MsgNewRule } from "@wardenprotocol/wardenjs/codegen/warden/act/v1beta1/tx";
 import { MsgAddSpaceOwner, MsgNewKeyRequest, MsgNewKeychain, MsgNewSpace, MsgRemoveSpaceOwner, MsgUpdateSpace } from "@wardenprotocol/wardenjs/codegen/warden/warden/v1beta3/tx";
+import { cosmosProtoRegistry, wardenProtoRegistry } from "@wardenprotocol/wardenjs";
 
 export function TxMsgDetails({ msg }: { msg: DecodeObject }) {
 	try {
@@ -222,6 +223,15 @@ function MsgNewRuleDetails({ msg }: { msg: MsgNewRule }) {
 
 function MsgFallback({ msg }: { msg: DecodeObject }) {
 	const type = msg.typeUrl;
+
+	const t = [
+		...wardenProtoRegistry,
+		...cosmosProtoRegistry,
+	].find((r) => r[0] === type)?.[1];
+	if (t) {
+		return <MsgFallbackDetails type={type} msg={t.decode(msg.value)} />;
+	}
+
 	return (
 		<Card className="bg-background">
 			<CardHeader>
@@ -241,3 +251,24 @@ function MsgFallback({ msg }: { msg: DecodeObject }) {
 		</Card>
 	);
 }
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function MsgFallbackDetails({ type, msg }: { type: string, msg: any }) {
+	return (
+		<Card className="bg-background">
+			<CardHeader>
+				<CardTitle>{type}</CardTitle>
+				<CardDescription>
+					<span className="text-sm text-red-500">
+						Partially supported message type.
+					</span>
+				</CardDescription>
+			</CardHeader>
+			<CardContent>
+				{Object.entries(msg).map(([key, value]) => (
+					<CardRow label={key} key={key}>{String(value)}</CardRow>
+				))}
+			</CardContent>
+		</Card>
+	);
+}
diff --git a/spaceward/src/features/explorer/Explorer.tsx b/spaceward/src/features/explorer/Explorer.tsx
index 152623e72..262a856d5 100644
--- a/spaceward/src/features/explorer/Explorer.tsx
+++ b/spaceward/src/features/explorer/Explorer.tsx
@@ -25,7 +25,7 @@ export function Explorer() {
 				queryKey: ["block", latestHeight - BigInt(i)],
 				queryFn: async () => {
 					const client = await getClient();
-					return client.cosmos.base.tendermint.v1beta1.getBlockByHeight({
+					return client.cosmos.tx.v1beta1.getBlockWithTxs({
 						height: (latestHeight - BigInt(i)),
 					});
 				},
@@ -55,6 +55,7 @@ export function Explorer() {
 								<Block
 									key={q.data?.block?.header?.height}
 									block={q.data?.block}
+									txCount={q.data?.txs?.length ?? 0}
 								/>
 							) : null
 						))}
@@ -64,7 +65,7 @@ export function Explorer() {
 	);
 }
 
-function Block({ block }: { block: BlockModel }) {
+function Block({ block, txCount }: { block: BlockModel, txCount: number }) {
 	return (
 		<TableRow
 			className={
@@ -88,7 +89,7 @@ function Block({ block }: { block: BlockModel }) {
 				</span>
 			</TableCell>
 			<TableCell className="text-right">
-				{block.data.txs.length} txs
+				{txCount} txs
 			</TableCell>
 			<TableCell className="text-right">
 				<Button variant="outline" size={"sm"}>