Explicitly move copy tooltip to the right
This commit is contained in:
parent
62e330213f
commit
05d2bf21d2
|
@ -148,7 +148,7 @@ function UnknownAccountCard({ account }: { account: Account }) {
|
|||
<tr>
|
||||
<td>Owner</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={details.owner.toBase58()}>
|
||||
<Copyable text={details.owner.toBase58()} right>
|
||||
<code>{displayAddress(details.owner.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -26,7 +26,7 @@ function ClusterModal() {
|
|||
<div className="modal-dialog modal-dialog-vertical">
|
||||
<div className="modal-content">
|
||||
<div className="modal-body" onClick={e => e.stopPropagation()}>
|
||||
<span className="close" onClick={onClose}>
|
||||
<span className="c-pointer" onClick={onClose}>
|
||||
×
|
||||
</span>
|
||||
|
||||
|
|
|
@ -4,22 +4,23 @@ type CopyableProps = {
|
|||
text: string;
|
||||
children: ReactNode;
|
||||
bottom?: boolean;
|
||||
right?: boolean;
|
||||
};
|
||||
|
||||
type State = "hide" | "copy" | "copied";
|
||||
|
||||
function Popover({ state, bottom }: { state: State; bottom?: boolean }) {
|
||||
function Popover({ state, bottom, right }: { state: State; bottom?: boolean, right?: boolean }) {
|
||||
if (state === "hide") return null;
|
||||
const text = state === "copy" ? "Copy" : "Copied!";
|
||||
return (
|
||||
<div className={`popover bs-popover-${bottom ? "bottom" : "top"} show`}>
|
||||
<div className="arrow" />
|
||||
<div className={`popover bs-popover-${bottom ? "bottom" : "top"}${right ? " right" : ""} show`}>
|
||||
<div className={`arrow${right ? " right" : ""}`} />
|
||||
<div className="popover-body">{text}</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function Copyable({ bottom, text, children }: CopyableProps) {
|
||||
function Copyable({ bottom, right, text, children }: CopyableProps) {
|
||||
const [state, setState] = useState<State>("hide");
|
||||
|
||||
const copyToClipboard = () => navigator.clipboard.writeText(text);
|
||||
|
@ -31,13 +32,13 @@ function Copyable({ bottom, text, children }: CopyableProps) {
|
|||
|
||||
return (
|
||||
<div
|
||||
className="popoover-container"
|
||||
className="popover-container c-pointer"
|
||||
onClick={handleClick}
|
||||
onMouseOver={() => setState("copy")}
|
||||
onMouseOut={() => state === "copy" && setState("hide")}
|
||||
>
|
||||
{children}
|
||||
<Popover bottom={bottom} state={state} />
|
||||
<Popover bottom={bottom} right={right} state={state} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -151,7 +151,7 @@ function StatusCard({ signature }: Props) {
|
|||
<td>Timestamp</td>
|
||||
<td className="text-right">
|
||||
{info.timestamp !== "unavailable" ? displayTimestamp(info.timestamp) : (
|
||||
<InfoTooltip text="Timestamps older than 5 epochs are not available at this time">
|
||||
<InfoTooltip bottom right text="Timestamps older than 5 epochs are not available at this time">
|
||||
Unavailable
|
||||
</InfoTooltip>
|
||||
)}
|
||||
|
|
|
@ -65,7 +65,7 @@ function OverviewCard({
|
|||
<tr>
|
||||
<td>Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={account.pubkey.toBase58()}>
|
||||
<Copyable text={account.pubkey.toBase58()} bottom right>
|
||||
<code>{account.pubkey.toBase58()}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -130,7 +130,7 @@ function DelegationCard({ stakeAccount }: { stakeAccount: StakeAccount }) {
|
|||
<tr>
|
||||
<td>Delegated Vote Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={stake.delegation.voterPubkey.toBase58()}>
|
||||
<Copyable text={stake.delegation.voterPubkey.toBase58()} right>
|
||||
<code>
|
||||
{displayAddress(stake.delegation.voterPubkey.toBase58())}
|
||||
</code>
|
||||
|
@ -175,7 +175,7 @@ function AuthoritiesCard({ meta }: { meta: Meta }) {
|
|||
<tr>
|
||||
<td>Stake Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={meta.authorized.staker.toBase58()}>
|
||||
<Copyable text={meta.authorized.staker.toBase58()} bottom right>
|
||||
<code>{meta.authorized.staker.toBase58()}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -184,7 +184,7 @@ function AuthoritiesCard({ meta }: { meta: Meta }) {
|
|||
<tr>
|
||||
<td>Withdraw Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={meta.authorized.withdrawer.toBase58()}>
|
||||
<Copyable text={meta.authorized.withdrawer.toBase58()} right>
|
||||
<code>{meta.authorized.withdrawer.toBase58()}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -194,7 +194,7 @@ function AuthoritiesCard({ meta }: { meta: Meta }) {
|
|||
<tr>
|
||||
<td>Lockup Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={meta.lockup.custodian.toBase58()}>
|
||||
<Copyable text={meta.lockup.custodian.toBase58()} right>
|
||||
<code>{displayAddress(meta.lockup.custodian.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -18,7 +18,7 @@ export function RawDetails({ ix }: { ix: TransactionInstruction }) {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={ix.programId.toBase58()}>
|
||||
<Copyable text={ix.programId.toBase58()} bottom right>
|
||||
<code>{displayAddress(ix.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -36,7 +36,7 @@ export function RawDetails({ ix }: { ix: TransactionInstruction }) {
|
|||
)}
|
||||
</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={pubkey.toBase58()}>
|
||||
<Copyable text={pubkey.toBase58()} right>
|
||||
<code>{pubkey.toBase58()}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -46,7 +46,7 @@ export function RawDetails({ ix }: { ix: TransactionInstruction }) {
|
|||
<tr>
|
||||
<td>Instruction Data (Base58)</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={data}>
|
||||
<Copyable text={data} right>
|
||||
<code>{displayData(data)}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -52,7 +52,7 @@ export function AuthorizeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={StakeProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={StakeProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(StakeProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -61,7 +61,7 @@ export function AuthorizeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Stake Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={stakePubkey}>
|
||||
<Copyable right text={stakePubkey}>
|
||||
<code>{stakePubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -70,7 +70,7 @@ export function AuthorizeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Old Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={authorizedPubkey}>
|
||||
<Copyable right text={authorizedPubkey}>
|
||||
<code>{authorizedPubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -79,7 +79,7 @@ export function AuthorizeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>New Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={newAuthorizedPubkey}>
|
||||
<Copyable right text={newAuthorizedPubkey}>
|
||||
<code>{newAuthorizedPubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -38,7 +38,7 @@ export function DeactivateDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={StakeProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={StakeProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(StakeProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -47,7 +47,7 @@ export function DeactivateDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Stake Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={stakePubkey}>
|
||||
<Copyable right text={stakePubkey}>
|
||||
<code>{stakePubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -56,7 +56,7 @@ export function DeactivateDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={authorizedPubkey}>
|
||||
<Copyable right text={authorizedPubkey}>
|
||||
<code>{authorizedPubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -39,7 +39,7 @@ export function DelegateDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={StakeProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={StakeProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(StakeProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -48,7 +48,7 @@ export function DelegateDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Stake Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={stakePubkey}>
|
||||
<Copyable right text={stakePubkey}>
|
||||
<code>{stakePubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -57,7 +57,7 @@ export function DelegateDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Delegated Vote Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={votePubkey}>
|
||||
<Copyable right text={votePubkey}>
|
||||
<code>{votePubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -66,7 +66,7 @@ export function DelegateDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={authorizedPubkey}>
|
||||
<Copyable right text={authorizedPubkey}>
|
||||
<code>{authorizedPubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -40,7 +40,7 @@ export function InitializeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={StakeProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={StakeProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(StakeProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -49,7 +49,7 @@ export function InitializeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Stake Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={stakePubkey}>
|
||||
<Copyable right text={stakePubkey}>
|
||||
<code>{stakePubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -58,7 +58,7 @@ export function InitializeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Stake Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={stakerPubkey}>
|
||||
<Copyable right text={stakerPubkey}>
|
||||
<code>{stakerPubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -67,7 +67,7 @@ export function InitializeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Withdraw Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={withdrawerPubkey}>
|
||||
<Copyable right text={withdrawerPubkey}>
|
||||
<code>{withdrawerPubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -93,7 +93,7 @@ export function InitializeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Lockup Custodian Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={params.lockup.custodian.toBase58()}>
|
||||
<Copyable right text={params.lockup.custodian.toBase58()}>
|
||||
<code>{displayAddress(params.lockup.custodian.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -35,7 +35,7 @@ export function SplitDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={StakeProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={StakeProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(StakeProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -44,7 +44,7 @@ export function SplitDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Stake Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={stakePubkey}>
|
||||
<Copyable right text={stakePubkey}>
|
||||
<code>{stakePubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -53,7 +53,7 @@ export function SplitDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={authorizedPubkey}>
|
||||
<Copyable right text={authorizedPubkey}>
|
||||
<code>{authorizedPubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -62,7 +62,7 @@ export function SplitDetailsCard(props: {
|
|||
<tr>
|
||||
<td>New Stake Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={splitStakePubkey}>
|
||||
<Copyable right text={splitStakePubkey}>
|
||||
<code>{splitStakePubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -40,7 +40,7 @@ export function WithdrawDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={StakeProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={StakeProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(StakeProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -49,7 +49,7 @@ export function WithdrawDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Stake Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={stakePubkey}>
|
||||
<Copyable right text={stakePubkey}>
|
||||
<code>{stakePubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -58,7 +58,7 @@ export function WithdrawDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={authorizedPubkey}>
|
||||
<Copyable right text={authorizedPubkey}>
|
||||
<code>{authorizedPubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -67,7 +67,7 @@ export function WithdrawDetailsCard(props: {
|
|||
<tr>
|
||||
<td>To Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={toPubkey}>
|
||||
<Copyable right text={toPubkey}>
|
||||
<code>{toPubkey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -37,7 +37,7 @@ export function AllocateDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={SystemProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={SystemProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(SystemProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -46,7 +46,7 @@ export function AllocateDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Account Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={accountKey}>
|
||||
<Copyable right text={accountKey}>
|
||||
<code>{accountKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -38,7 +38,7 @@ export function AllocateWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={SystemProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={SystemProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(SystemProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -47,7 +47,7 @@ export function AllocateWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Account Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={accountKey}>
|
||||
<Copyable right text={accountKey}>
|
||||
<code>{accountKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -56,7 +56,7 @@ export function AllocateWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Base Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={baseKey}>
|
||||
<Copyable right text={baseKey}>
|
||||
<code>{baseKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -65,7 +65,7 @@ export function AllocateWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Seed</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={params.seed}>
|
||||
<Copyable right text={params.seed}>
|
||||
<code>{params.seed}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -79,7 +79,7 @@ export function AllocateWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Assigned Owner</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={params.programId.toBase58()}>
|
||||
<Copyable right text={params.programId.toBase58()}>
|
||||
<code>{displayAddress(params.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -37,7 +37,7 @@ export function AssignDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={SystemProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={SystemProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(SystemProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -46,7 +46,7 @@ export function AssignDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Account Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={accountKey}>
|
||||
<Copyable right text={accountKey}>
|
||||
<code>{accountKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -55,7 +55,7 @@ export function AssignDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Assigned Owner</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={params.programId.toBase58()}>
|
||||
<Copyable right text={params.programId.toBase58()}>
|
||||
<code>{displayAddress(params.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -38,7 +38,7 @@ export function AssignWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={SystemProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={SystemProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(SystemProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -47,7 +47,7 @@ export function AssignWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Account Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={accountKey}>
|
||||
<Copyable right text={accountKey}>
|
||||
<code>{accountKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -56,7 +56,7 @@ export function AssignWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Base Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={baseKey}>
|
||||
<Copyable right text={baseKey}>
|
||||
<code>{baseKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -65,7 +65,7 @@ export function AssignWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Seed</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={params.seed}>
|
||||
<Copyable right text={params.seed}>
|
||||
<code>{params.seed}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -74,7 +74,7 @@ export function AssignWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Assigned Owner</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={params.programId.toBase58()}>
|
||||
<Copyable right text={params.programId.toBase58()}>
|
||||
<code>{displayAddress(params.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -39,7 +39,7 @@ export function CreateDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={SystemProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={SystemProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(SystemProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -48,7 +48,7 @@ export function CreateDetailsCard(props: {
|
|||
<tr>
|
||||
<td>From Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={from}>
|
||||
<Copyable right text={from}>
|
||||
<code>{from}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -57,7 +57,7 @@ export function CreateDetailsCard(props: {
|
|||
<tr>
|
||||
<td>New Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={newKey}>
|
||||
<Copyable right text={newKey}>
|
||||
<code>{newKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -76,7 +76,7 @@ export function CreateDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Assigned Owner</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={params.programId.toBase58()}>
|
||||
<Copyable right text={params.programId.toBase58()}>
|
||||
<code>{displayAddress(params.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -40,7 +40,7 @@ export function CreateWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={SystemProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={SystemProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(SystemProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -49,7 +49,7 @@ export function CreateWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>From Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={from}>
|
||||
<Copyable right text={from}>
|
||||
<code>{from}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -58,7 +58,7 @@ export function CreateWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>New Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={newKey}>
|
||||
<Copyable right text={newKey}>
|
||||
<code>{newKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -67,7 +67,7 @@ export function CreateWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>New Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={newKey}>
|
||||
<Copyable right text={newKey}>
|
||||
<code>{newKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -76,7 +76,7 @@ export function CreateWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Base Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={baseKey}>
|
||||
<Copyable right text={baseKey}>
|
||||
<code>{baseKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -85,7 +85,7 @@ export function CreateWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Seed</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={params.seed}>
|
||||
<Copyable right text={params.seed}>
|
||||
<code>{params.seed}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -104,7 +104,7 @@ export function CreateWithSeedDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Assigned Owner</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={params.programId.toBase58()}>
|
||||
<Copyable right text={params.programId.toBase58()}>
|
||||
<code>{displayAddress(params.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -38,7 +38,7 @@ export function NonceAdvanceDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={SystemProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={SystemProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(SystemProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -47,7 +47,7 @@ export function NonceAdvanceDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Nonce Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={nonceKey}>
|
||||
<Copyable right text={nonceKey}>
|
||||
<code>{nonceKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -56,7 +56,7 @@ export function NonceAdvanceDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={authorizedKey}>
|
||||
<Copyable right text={authorizedKey}>
|
||||
<code>{authorizedKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -39,7 +39,7 @@ export function NonceAuthorizeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={SystemProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={SystemProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(SystemProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -48,7 +48,7 @@ export function NonceAuthorizeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Nonce Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={nonceKey}>
|
||||
<Copyable right text={nonceKey}>
|
||||
<code>{nonceKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -57,7 +57,7 @@ export function NonceAuthorizeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Old Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={authorizedKey}>
|
||||
<Copyable right text={authorizedKey}>
|
||||
<code>{authorizedKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -66,7 +66,7 @@ export function NonceAuthorizeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>New Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={newAuthorizedKey}>
|
||||
<Copyable right text={newAuthorizedKey}>
|
||||
<code>{newAuthorizedKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -38,7 +38,7 @@ export function NonceInitializeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={SystemProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={SystemProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(SystemProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -47,7 +47,7 @@ export function NonceInitializeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Nonce Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={nonceKey}>
|
||||
<Copyable right text={nonceKey}>
|
||||
<code>{nonceKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -56,7 +56,7 @@ export function NonceInitializeDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={authorizedKey}>
|
||||
<Copyable right text={authorizedKey}>
|
||||
<code>{authorizedKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -41,7 +41,7 @@ export function NonceWithdrawDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={SystemProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={SystemProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(SystemProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -50,7 +50,7 @@ export function NonceWithdrawDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Nonce Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={nonceKey}>
|
||||
<Copyable right text={nonceKey}>
|
||||
<code>{nonceKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -59,7 +59,7 @@ export function NonceWithdrawDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Authority Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={authorizedKey}>
|
||||
<Copyable right text={authorizedKey}>
|
||||
<code>{authorizedKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -68,7 +68,7 @@ export function NonceWithdrawDetailsCard(props: {
|
|||
<tr>
|
||||
<td>To Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={toKey}>
|
||||
<Copyable right text={toKey}>
|
||||
<code>{toKey}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
|
@ -33,7 +33,7 @@ export function TransferDetailsCard(props: {
|
|||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-right">
|
||||
<Copyable bottom text={SystemProgram.programId.toBase58()}>
|
||||
<Copyable bottom right text={SystemProgram.programId.toBase58()}>
|
||||
<code>{displayAddress(SystemProgram.programId.toBase58())}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -42,7 +42,7 @@ export function TransferDetailsCard(props: {
|
|||
<tr>
|
||||
<td>From Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={from}>
|
||||
<Copyable right text={from}>
|
||||
<code>{from}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
@ -51,7 +51,7 @@ export function TransferDetailsCard(props: {
|
|||
<tr>
|
||||
<td>To Address</td>
|
||||
<td className="text-right">
|
||||
<Copyable text={to}>
|
||||
<Copyable right text={to}>
|
||||
<code>{to}</code>
|
||||
</Copyable>
|
||||
</td>
|
||||
|
|
Loading…
Reference in New Issue