fix: add key alias to dropdown (#1813)

This commit is contained in:
Matthew Russell 2022-10-21 03:34:36 -05:00 committed by GitHub
parent 5a5e06a8e9
commit e66b6586b5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -10,6 +10,7 @@ import {
DropdownMenuTrigger, DropdownMenuTrigger,
Icon, Icon,
} from '@vegaprotocol/ui-toolkit'; } from '@vegaprotocol/ui-toolkit';
import type { PubKey } from '@vegaprotocol/wallet';
import { useVegaWallet, useVegaWalletDialogStore } from '@vegaprotocol/wallet'; import { useVegaWallet, useVegaWalletDialogStore } from '@vegaprotocol/wallet';
import { useEffect, useMemo, useState } from 'react'; import { useEffect, useMemo, useState } from 'react';
import CopyToClipboard from 'react-copy-to-clipboard'; import CopyToClipboard from 'react-copy-to-clipboard';
@ -45,8 +46,8 @@ export const VegaWalletConnectButton = () => {
selectPubKey(value); selectPubKey(value);
}} }}
> >
{pubKeys.map((k) => ( {pubKeys.map((pk) => (
<KeypairItem key={k.publicKey} kp={k.publicKey} /> <KeypairItem key={pk.publicKey} pk={pk} />
))} ))}
</DropdownMenuRadioGroup> </DropdownMenuRadioGroup>
<DropdownMenuItem data-testid="disconnect" onClick={disconnect}> <DropdownMenuItem data-testid="disconnect" onClick={disconnect}>
@ -69,7 +70,7 @@ export const VegaWalletConnectButton = () => {
); );
}; };
const KeypairItem = ({ kp }: { kp: string }) => { const KeypairItem = ({ pk }: { pk: PubKey }) => {
const [copied, setCopied] = useState(false); const [copied, setCopied] = useState(false);
useEffect(() => { useEffect(() => {
// eslint-disable-next-line // eslint-disable-next-line
@ -87,13 +88,16 @@ const KeypairItem = ({ kp }: { kp: string }) => {
}, [copied]); }, [copied]);
return ( return (
<DropdownMenuRadioItem key={kp} value={kp}> <DropdownMenuRadioItem value={pk.publicKey}>
<div className="flex-1 mr-2" data-testid={`key-${kp}`}> <div className="flex-1 mr-2" data-testid={`key-${pk.publicKey}`}>
<span className="mr-2"> <span className="mr-2">
<span>{truncateByChars(kp)}</span> <span>
<span className="uppercase">{pk.name}</span>:{' '}
{truncateByChars(pk.publicKey)}
</span>
</span> </span>
<span> <span>
<CopyToClipboard text={kp} onCopy={() => setCopied(true)}> <CopyToClipboard text={pk.publicKey} onCopy={() => setCopied(true)}>
<button <button
data-testid="copy-vega-public-key" data-testid="copy-vega-public-key"
onClick={(e) => e.stopPropagation()} onClick={(e) => e.stopPropagation()}