121 lines
2.9 KiB
TypeScript
121 lines
2.9 KiB
TypeScript
import { FormattedMessage } from "react-intl";
|
|
import { useNavigate } from "react-router-dom";
|
|
|
|
import Logo from "Element/Logo";
|
|
import { CollapsedSection } from "Element/Collapsed";
|
|
import Copy from "Element/Copy";
|
|
import { hexToBech32 } from "Util";
|
|
import { hexToMnemonic } from "nip6";
|
|
import useLogin from "Hooks/useLogin";
|
|
|
|
import messages from "./messages";
|
|
import { PROFILE } from ".";
|
|
|
|
const WhatIsSnort = () => {
|
|
return (
|
|
<CollapsedSection
|
|
title={
|
|
<h3>
|
|
<FormattedMessage {...messages.WhatIsSnort} />
|
|
</h3>
|
|
}>
|
|
<p>
|
|
<FormattedMessage {...messages.WhatIsSnortIntro} />
|
|
</p>
|
|
<p>
|
|
<FormattedMessage {...messages.WhatIsSnortNotes} />
|
|
</p>
|
|
<p>
|
|
<FormattedMessage {...messages.WhatIsSnortExperience} />
|
|
</p>
|
|
</CollapsedSection>
|
|
);
|
|
};
|
|
|
|
const HowDoKeysWork = () => {
|
|
return (
|
|
<CollapsedSection
|
|
title={
|
|
<h3>
|
|
<FormattedMessage {...messages.HowKeysWork} />
|
|
</h3>
|
|
}>
|
|
<p>
|
|
<FormattedMessage {...messages.DigitalSignatures} />
|
|
</p>
|
|
<p>
|
|
<FormattedMessage {...messages.TamperProof} />
|
|
</p>
|
|
<p>
|
|
<FormattedMessage {...messages.Bitcoin} />
|
|
</p>
|
|
</CollapsedSection>
|
|
);
|
|
};
|
|
|
|
const Extensions = () => {
|
|
return (
|
|
<CollapsedSection
|
|
title={
|
|
<h3>
|
|
<FormattedMessage {...messages.ImproveSecurity} />
|
|
</h3>
|
|
}>
|
|
<p>
|
|
<FormattedMessage {...messages.Extensions} />
|
|
</p>
|
|
<ul>
|
|
<li>
|
|
<a href="https://getalby.com/" target="_blank" rel="noreferrer">
|
|
Alby
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="https://github.com/fiatjaf/nos2x" target="_blank" rel="noreferrer">
|
|
nos2x
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<p>
|
|
<FormattedMessage {...messages.ExtensionsNostr} />
|
|
</p>
|
|
</CollapsedSection>
|
|
);
|
|
};
|
|
|
|
export default function NewUserFlow() {
|
|
const { publicKey, generatedEntropy } = useLogin();
|
|
const navigate = useNavigate();
|
|
|
|
return (
|
|
<div className="main-content new-user" dir="auto">
|
|
<Logo />
|
|
<div className="progress-bar">
|
|
<div className="progress progress-first"></div>
|
|
</div>
|
|
<h1>
|
|
<FormattedMessage {...messages.SaveKeys} />
|
|
</h1>
|
|
<p>
|
|
<FormattedMessage {...messages.SaveKeysHelp} />
|
|
</p>
|
|
<h2>
|
|
<FormattedMessage {...messages.YourPubkey} />
|
|
</h2>
|
|
<Copy text={hexToBech32("npub", publicKey ?? "")} />
|
|
<h2>
|
|
<FormattedMessage {...messages.YourMnemonic} />
|
|
</h2>
|
|
<Copy text={hexToMnemonic(generatedEntropy ?? "")} />
|
|
<div className="next-actions">
|
|
<button type="button" onClick={() => navigate(PROFILE)}>
|
|
<FormattedMessage {...messages.KeysSaved} />{" "}
|
|
</button>
|
|
</div>
|
|
<WhatIsSnort />
|
|
<HowDoKeysWork />
|
|
<Extensions />
|
|
</div>
|
|
);
|
|
}
|