From 2e1c11e3f7bfb61e158c28fd285a5b15d593a221 Mon Sep 17 00:00:00 2001
From: abefernan <44572727+abefernan@users.noreply.github.com>
Date: Fri, 19 May 2023 13:45:19 +0200
Subject: [PATCH] Add and use TxMsgSetWithdrawAddressDetails

---
 .../TxMsgSetWithdrawAddressDetails.tsx        | 47 +++++++++++++++++++
 .../dataViews/TransactionInfo/index.tsx       |  3 ++
 2 files changed, 50 insertions(+)
 create mode 100644 components/dataViews/TransactionInfo/TxMsgSetWithdrawAddressDetails.tsx

diff --git a/components/dataViews/TransactionInfo/TxMsgSetWithdrawAddressDetails.tsx b/components/dataViews/TransactionInfo/TxMsgSetWithdrawAddressDetails.tsx
new file mode 100644
index 0000000..56d646e
--- /dev/null
+++ b/components/dataViews/TransactionInfo/TxMsgSetWithdrawAddressDetails.tsx
@@ -0,0 +1,47 @@
+import { TxMsgSetWithdrawAddress } from "../../../types/txMsg";
+import HashView from "../HashView";
+
+interface TxMsgSetWithdrawAddressDetailsProps {
+  readonly msg: TxMsgSetWithdrawAddress;
+}
+
+const TxMsgSetWithdrawAddressDetails = ({ msg }: TxMsgSetWithdrawAddressDetailsProps) => (
+  <>
+    <li>
+      <h2>MsgSetWithdrawAddress</h2>
+    </li>
+    <li>
+      <label>Withdraw Address:</label>
+      <div title={msg.value.withdrawAddress}>
+        <HashView hash={msg.value.withdrawAddress} />
+      </div>
+    </li>
+    <style jsx>{`
+      li:not(:has(h2)) {
+        background: rgba(255, 255, 255, 0.03);
+        padding: 6px 10px;
+        border-radius: 8px;
+        display: flex;
+        align-items: center;
+      }
+      li + li:nth-child(2) {
+        margin-top: 25px;
+      }
+      li + li {
+        margin-top: 10px;
+      }
+      li div {
+        padding: 3px 6px;
+      }
+      label {
+        font-size: 12px;
+        background: rgba(255, 255, 255, 0.1);
+        padding: 3px 6px;
+        border-radius: 5px;
+        display: block;
+      }
+    `}</style>
+  </>
+);
+
+export default TxMsgSetWithdrawAddressDetails;
diff --git a/components/dataViews/TransactionInfo/index.tsx b/components/dataViews/TransactionInfo/index.tsx
index 593550b..722746d 100644
--- a/components/dataViews/TransactionInfo/index.tsx
+++ b/components/dataViews/TransactionInfo/index.tsx
@@ -5,6 +5,7 @@ import {
   isTxMsgDelegate,
   isTxMsgRedelegate,
   isTxMsgSend,
+  isTxMsgSetWithdrawAddress,
   isTxMsgUndelegate,
 } from "../../../lib/txMsgHelpers";
 import { DbTransaction } from "../../../types";
@@ -13,6 +14,7 @@ import TxMsgClaimRewardsDetails from "./TxMsgClaimRewardsDetails";
 import TxMsgDelegateDetails from "./TxMsgDelegateDetails";
 import TxMsgRedelegateDetails from "./TxMsgRedelegateDetails";
 import TxMsgSendDetails from "./TxMsgSendDetails";
+import TxMsgSetWithdrawAddressDetails from "./TxMsgSetWithdrawAddressDetails";
 import TxMsgUndelegateDetails from "./TxMsgUndelegateDetails";
 
 interface Props {
@@ -33,6 +35,7 @@ const TransactionInfo = ({ tx }: Props) => {
               {isTxMsgUndelegate(msg) ? <TxMsgUndelegateDetails msg={msg} /> : null}
               {isTxMsgRedelegate(msg) ? <TxMsgRedelegateDetails msg={msg} /> : null}
               {isTxMsgClaimRewards(msg) ? <TxMsgClaimRewardsDetails msg={msg} /> : null}
+              {isTxMsgSetWithdrawAddress(msg) ? <TxMsgSetWithdrawAddressDetails msg={msg} /> : null}
             </StackableContainer>
           ))}
           <StackableContainer lessPadding lessMargin>