Reword an change some TransactionSigning layout

This commit is contained in:
abefernan
2023-05-26 10:28:10 +02:00
parent 3cd08af3ef
commit f2f5080ac1
+37 -42
View File
@@ -193,33 +193,37 @@ const TransactionSigning = (props: Props) => {
};
return (
<StackableContainer lessPadding lessMargin>
{signing === "signed" ? (
<StackableContainer lessPadding lessMargin lessRadius>
<>
<StackableContainer lessPadding lessMargin lessRadius>
<h2>Current Signers</h2>
{props.signatures.map((signature, i) => (
<StackableContainer lessPadding lessRadius lessMargin key={`${signature.address}_${i}`}>
<HashView hash={signature.address} />
</StackableContainer>
))}
{!props.signatures.length ? <p>No signatures yet</p> : null}
</StackableContainer>
<StackableContainer lessPadding lessMargin lessRadius>
{signing === "signed" ? (
<div className="confirmation">
<svg viewBox="0 0 77 60" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5 30L26 51L72 5" stroke="white" strokeWidth="12" />
</svg>
<p>You've signed this transaction.</p>
<p>You've signed this transaction</p>
</div>
</StackableContainer>
) : null}
{signing === "not_a_member" ? (
<StackableContainer lessPadding lessMargin lessRadius>
) : null}
{signing === "not_a_member" ? (
<div className="multisig-error">
<p>You don't belong to this multisig.</p>
<p>You don't belong to this multisig</p>
</div>
</StackableContainer>
) : null}
{signing === "not_signed" ? (
<>
<h2>Sign this transaction</h2>
<StackableContainer lessPadding lessMargin lessRadius>
) : null}
{signing === "not_signed" ? (
<>
{walletAccount ? (
<>
<p>
Connected signer {walletAccount.bech32Address} (
{walletType ?? "Unknown wallet type"}).
You can sign this transaction with {walletAccount.bech32Address} (
{walletType ?? "Unknown wallet type"})
</p>
<Button
label="Sign transaction"
@@ -229,6 +233,7 @@ const TransactionSigning = (props: Props) => {
</>
) : (
<>
<h2>Choose wallet to sign</h2>
<Button label="Connect Keplr" onClick={connectKeplr} loading={loading.keplr} />
<Button
label="Connect Ledger (WebUSB)"
@@ -237,32 +242,22 @@ const TransactionSigning = (props: Props) => {
/>
</>
)}
</>
) : null}
{sigError ? (
<StackableContainer lessPadding lessRadius lessMargin>
<div className="signature-error">
<p>This account has already signed this transaction</p>
</div>
</StackableContainer>
</>
) : null}
{sigError && (
<StackableContainer lessPadding lessRadius lessMargin>
<div className="signature-error">
<p>This account has already signed this transaction.</p>
</div>
</StackableContainer>
)}
{connectError && (
<StackableContainer lessPadding lessRadius lessMargin>
<div className="signature-error">
<p>{connectError}</p>
</div>
</StackableContainer>
)}
<h2>Current Signers</h2>
<StackableContainer lessPadding lessMargin lessRadius>
{props.signatures.map((signature, i) => (
<StackableContainer lessPadding lessRadius lessMargin key={`${signature.address}_${i}`}>
<HashView hash={signature.address} />
) : null}
{connectError ? (
<StackableContainer lessPadding lessRadius lessMargin>
<div className="signature-error">
<p>{connectError}</p>
</div>
</StackableContainer>
))}
{props.signatures.length === 0 && <p>No signatures yet</p>}
) : null}
</StackableContainer>
<style jsx>{`
p {
@@ -302,7 +297,7 @@ const TransactionSigning = (props: Props) => {
font-size: 16px;
}
`}</style>
</StackableContainer>
</>
);
};