From 3246cbe28288449aa556e9752a9a453ea38f7de3 Mon Sep 17 00:00:00 2001
From: Simon Warta <simon@warta.it>
Date: Mon, 13 Jan 2025 15:01:37 +0100
Subject: [PATCH] Display validator consistently in UI component

---
 components/SelectValidator.tsx                 | 18 ++++++++++++------
 .../MsgForm/MsgBeginRedelegateForm.tsx         |  4 ++--
 .../MsgForm/MsgDelegateForm.tsx                |  2 +-
 .../MsgForm/MsgUndelegateForm.tsx              |  2 +-
 .../MsgForm/MsgWithdrawDelegatorRewardForm.tsx |  2 +-
 5 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/components/SelectValidator.tsx b/components/SelectValidator.tsx
index 35e68bd3..acfef138 100644
--- a/components/SelectValidator.tsx
+++ b/components/SelectValidator.tsx
@@ -12,16 +12,17 @@ import {
 import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
 import { useChains } from "@/context/ChainsContext";
 import { cn } from "@/lib/utils";
+import { Validator } from "cosmjs-types/cosmos/staking/v1beta1/staking";
 import { Check, ChevronsUpDown } from "lucide-react";
 import { useState } from "react";
 
 interface SelectValidatorProps {
-  readonly validatorAddress: string;
+  readonly selectedValidatorAddress: string;
   readonly setValidatorAddress: (validatorAddress: string) => void;
 }
 
 export default function SelectValidator({
-  validatorAddress,
+  selectedValidatorAddress,
   setValidatorAddress,
 }: SelectValidatorProps) {
   const {
@@ -38,6 +39,12 @@ export default function SelectValidator({
   // reasonable filtering here.
   const validators = [...bonded, ...unbonding, ...unbonded];
 
+  function displayValidator(val: Validator): string {
+    return val.description.moniker + (val.jailed ? " (jailed)" : "")
+  }
+
+  const selectedValidator = validators.find((validatorItem) => selectedValidatorAddress === validatorItem.operatorAddress);
+
   return (
     <Popover open={open} onOpenChange={setOpen}>
       <PopoverTrigger asChild>
@@ -47,9 +54,8 @@ export default function SelectValidator({
           aria-expanded={open}
           className="mb-4 w-full max-w-[300px] justify-between border-white bg-fuchsia-900 hover:bg-fuchsia-900"
         >
-          {validatorAddress
-            ? validators.find((validatorItem) => validatorAddress === validatorItem.operatorAddress)
-                ?.description.moniker || "Unknown validator"
+          {selectedValidatorAddress
+            ? selectedValidator ? displayValidator(selectedValidator): "Unknown validator"
             : "Select validator…"}
           <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
         </Button>
@@ -76,7 +82,7 @@ export default function SelectValidator({
                   <Check
                     className={cn(
                       "mr-2 h-4 w-4",
-                      validatorAddress === validatorItem.operatorAddress
+                      selectedValidatorAddress === validatorItem.operatorAddress
                         ? "opacity-100"
                         : "opacity-0",
                     )}
diff --git a/components/forms/OldCreateTxForm/MsgForm/MsgBeginRedelegateForm.tsx b/components/forms/OldCreateTxForm/MsgForm/MsgBeginRedelegateForm.tsx
index 1227598c..839420ee 100644
--- a/components/forms/OldCreateTxForm/MsgForm/MsgBeginRedelegateForm.tsx
+++ b/components/forms/OldCreateTxForm/MsgForm/MsgBeginRedelegateForm.tsx
@@ -111,7 +111,7 @@ const MsgBeginRedelegateForm = ({
       <h2>MsgBeginRedelegate</h2>
       <div className="form-item">
         <SelectValidator
-          validatorAddress={validatorSrcAddress}
+          selectedValidatorAddress={validatorSrcAddress}
           setValidatorAddress={setValidatorSrcAddress}
         />
         <Input
@@ -128,7 +128,7 @@ const MsgBeginRedelegateForm = ({
       </div>
       <div className="form-item">
         <SelectValidator
-          validatorAddress={validatorDstAddress}
+          selectedValidatorAddress={validatorDstAddress}
           setValidatorAddress={setValidatorDstAddress}
         />
         <Input
diff --git a/components/forms/OldCreateTxForm/MsgForm/MsgDelegateForm.tsx b/components/forms/OldCreateTxForm/MsgForm/MsgDelegateForm.tsx
index 34141472..4cecb09e 100644
--- a/components/forms/OldCreateTxForm/MsgForm/MsgDelegateForm.tsx
+++ b/components/forms/OldCreateTxForm/MsgForm/MsgDelegateForm.tsx
@@ -92,7 +92,7 @@ const MsgDelegateForm = ({ senderAddress, setMsgGetter, deleteMsg }: MsgDelegate
       <h2>MsgDelegate</h2>
       <div className="form-item">
         <SelectValidator
-          validatorAddress={validatorAddress}
+          selectedValidatorAddress={validatorAddress}
           setValidatorAddress={setValidatorAddress}
         />
         <Input
diff --git a/components/forms/OldCreateTxForm/MsgForm/MsgUndelegateForm.tsx b/components/forms/OldCreateTxForm/MsgForm/MsgUndelegateForm.tsx
index 0138c909..70d9e3d8 100644
--- a/components/forms/OldCreateTxForm/MsgForm/MsgUndelegateForm.tsx
+++ b/components/forms/OldCreateTxForm/MsgForm/MsgUndelegateForm.tsx
@@ -92,7 +92,7 @@ const MsgUndelegateForm = ({ senderAddress, setMsgGetter, deleteMsg }: MsgUndele
       <h2>MsgUndelegate</h2>
       <div className="form-item">
         <SelectValidator
-          validatorAddress={validatorAddress}
+          selectedValidatorAddress={validatorAddress}
           setValidatorAddress={setValidatorAddress}
         />
         <Input
diff --git a/components/forms/OldCreateTxForm/MsgForm/MsgWithdrawDelegatorRewardForm.tsx b/components/forms/OldCreateTxForm/MsgForm/MsgWithdrawDelegatorRewardForm.tsx
index 742062b5..96faf9e9 100644
--- a/components/forms/OldCreateTxForm/MsgForm/MsgWithdrawDelegatorRewardForm.tsx
+++ b/components/forms/OldCreateTxForm/MsgForm/MsgWithdrawDelegatorRewardForm.tsx
@@ -65,7 +65,7 @@ const MsgWithdrawDelegatorRewardForm = ({
       <h2>MsgWithdrawDelegatorReward</h2>
       <div className="form-item">
         <SelectValidator
-          validatorAddress={validatorAddress}
+          selectedValidatorAddress={validatorAddress}
           setValidatorAddress={setValidatorAddress}
         />
         <Input