feat: improve key export page

closes #712
This commit is contained in:
kieran 2024-04-12 12:09:51 +01:00
parent f601e88b8f
commit 19d72722db
Signed by: Kieran
GPG Key ID: DE71CEB3925BE941
4 changed files with 31 additions and 18 deletions

View File

@ -44,7 +44,8 @@
"defaultRelays": {
"wss://relay.snort.social/": { "read": true, "write": true },
"wss://nostr.wine/": { "read": true, "write": false },
"wss://eden.nostr.land/": { "read": true, "write": false }
"wss://relay.damus.io/": { "read": true, "write": true },
"wss://nos.lol/": { "read": true, "write": true }
},
"alby": {
"clientId": "pohiJjPhQR",

View File

@ -10,11 +10,16 @@ export interface CopyProps {
maxSize?: number;
className?: string;
showText?: boolean;
mask?: string;
}
export default function Copy({ text, maxSize = 32, className, showText }: CopyProps) {
export default function Copy({ text, maxSize = 32, className, showText, mask }: CopyProps) {
const { copy, copied } = useCopy();
const sliceLength = maxSize / 2;
const trimmed = text.length > maxSize ? `${text.slice(0, sliceLength)}...${text.slice(-sliceLength)}` : text;
const displayText = mask ? mask.repeat(text.length) : text;
const trimmed =
displayText.length > maxSize
? `${displayText.slice(0, sliceLength)}...${displayText.slice(-sliceLength)}`
: displayText;
return (
<div className={classNames("copy flex pointer g8 items-center", className)} onClick={() => copy(text)}>

View File

@ -1,9 +1,3 @@
.copy.dashed {
padding: 12px 16px;
border: 2px dashed #222222;
border-radius: 16px;
}
.mnemonic-grid {
display: grid;
text-align: center;

View File

@ -10,26 +10,39 @@ import { hexToMnemonic } from "@/Utils/nip6";
export default function ExportKeys() {
const { publicKey, privateKeyData, generatedEntropy } = useLogin();
const copyClass = "p-3 br border border-dashed border-[var(--gray-medium)]";
return (
<div className="flex flex-col g12">
<h2>
<div className="text-xl">
<FormattedMessage defaultMessage="Public Key" id="bep9C3" />
</h2>
<Copy text={hexToBech32("npub", publicKey ?? "")} className="dashed" />
<Copy text={encodeTLV(NostrPrefix.Profile, publicKey ?? "")} className="dashed" />
</div>
<small>
<FormattedMessage
defaultMessage="The public key is like your username, you can share it with anyone."
id="dK2CcV"
/>
</small>
<Copy text={hexToBech32("npub", publicKey ?? "")} className={copyClass} />
<Copy text={encodeTLV(NostrPrefix.Profile, publicKey ?? "")} className={copyClass} />
{privateKeyData instanceof KeyStorage && (
<>
<h2>
<div className="text-xl">
<FormattedMessage defaultMessage="Private Key" id="JymXbw" />
</h2>
<Copy text={hexToBech32("nsec", privateKeyData.value)} className="dashed" />
</div>
<small>
<FormattedMessage
defaultMessage="The private key is like a password, but it cannot be reset. Guard it carefully and never show it to anyone. Once someone has your private key, they will have access to your account forever."
id="QJfhKt"
/>
</small>
<Copy text={hexToBech32("nsec", privateKeyData.value)} className={copyClass} mask="*" />
</>
)}
{generatedEntropy && (
<>
<h2>
<div className="text-xl">
<FormattedMessage defaultMessage="Mnemonic" id="b12Goz" />
</h2>
</div>
<div className="mnemonic-grid">
{hexToMnemonic(generatedEntropy ?? "")
.split(" ")