Display validator consistently in UI component

cosmos · Jan 13, 2025 · 3246cbe · 3246cbe
1 parent 7419890
commit 3246cbe
Show file tree

Hide file tree

Showing 5 changed files with 17 additions and 11 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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
@@ -65,7 +65,7 @@ const MsgWithdrawDelegatorRewardForm = ({
       <h2>MsgWithdrawDelegatorReward</h2>
       <div className="form-item">
         <SelectValidator
-          validatorAddress={validatorAddress}
+          selectedValidatorAddress={validatorAddress}
           setValidatorAddress={setValidatorAddress}
         />
         <Input