diff --git a/components/SelectValidator.tsx b/components/SelectValidator.tsx new file mode 100644 index 0000000..13d3bc2 --- /dev/null +++ b/components/SelectValidator.tsx @@ -0,0 +1,83 @@ +"use client"; + +import { Button } from "@/components/ui/button"; +import { + Command, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, +} from "@/components/ui/command"; +import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover"; +import { useChains } from "@/context/ChainsContext"; +import { cn } from "@/lib/utils"; +import { Check, ChevronsUpDown } from "lucide-react"; +import { useState } from "react"; + +interface SelectValidatorProps { + readonly validatorAddress: string; + readonly setValidatorAddress: (validatorAddress: string) => void; +} + +export default function SelectValidator({ + validatorAddress, + setValidatorAddress, +}: SelectValidatorProps) { + const { + validatorState: { validators }, + } = useChains(); + const [open, setOpen] = useState(false); + const [searchText, setSearchText] = useState(""); + + return ( + + + + + + + + No framework found. + + {validators?.map((validatorItem) => ( + { + setValidatorAddress(validatorItem.operatorAddress); + setOpen(false); + }} + > + + {validatorItem.description.moniker} + + ))} + + + + + ); +}