Files
lume/apps/desktop/src/routes/auth/login-nsecbunker.tsx
T
2024-01-26 10:17:23 +07:00

113 lines
3.2 KiB
TypeScript

import { useArk } from "@lume/ark";
import { LoaderIcon } from "@lume/icons";
import { useStorage } from "@lume/storage";
import NDK, { NDKNip46Signer, NDKPrivateKeySigner } from "@nostr-dev-kit/ndk";
import { nip19 } from "nostr-tools";
import { useState } from "react";
import { useForm } from "react-hook-form";
import { useNavigate } from "react-router-dom";
import { toast } from "sonner";
export function LoginWithNsecbunker() {
const ark = useArk();
const storage = useStorage();
const navigate = useNavigate();
const [loading, setLoading] = useState(false);
const {
register,
handleSubmit,
setError,
formState: { errors, isValid },
} = useForm();
const onSubmit = async (data: { npub: string }) => {
try {
if (!data.npub.startsWith("npub1"))
return toast.info("You need to enter a token start with npub1");
if (!data.npub.includes("#"))
return toast.info("Token must include #secret");
setLoading(true);
const bunker = new NDK({
explicitRelayUrls: [
"wss://relay.nsecbunker.com",
"wss://nostr.vulpem.com",
],
});
await bunker.connect(2000);
const pubkey = nip19.decode(data.npub.split("#")[0]).data as string;
const localSigner = NDKPrivateKeySigner.generate();
const remoteSigner = new NDKNip46Signer(bunker, data.npub, localSigner);
await remoteSigner.blockUntilReady();
ark.updateNostrSigner({ signer: remoteSigner });
await storage.createSetting("nsecbunker", "1");
const account = await storage.createAccount({
pubkey: pubkey,
privkey: localSigner.privateKey,
});
ark.account = account;
return navigate("/auth/onboarding", { replace: true });
} catch (e) {
setLoading(false);
setError("npub", {
type: "manual",
message: String(e),
});
}
};
return (
<div className="relative flex items-center justify-center w-full h-full">
<div className="flex flex-col w-full max-w-md gap-8 mx-auto">
<div className="flex flex-col gap-1 text-center items-center">
<h1 className="text-2xl font-semibold">
Enter your nsecbunker token
</h1>
</div>
<div className="flex flex-col gap-6">
<form
onSubmit={handleSubmit(onSubmit)}
className="flex flex-col gap-4 mb-0"
>
<div className="relative flex flex-col gap-1">
<input
type="text"
{...register("npub", { required: false })}
spellCheck={false}
autoCapitalize="none"
autoCorrect="none"
placeholder="npub1...#..."
className="px-3 text-xl border-transparent rounded-xl h-14 bg-neutral-950 placeholder:text-neutral-600 focus:border-blue-500 focus:ring focus:ring-blue-800"
/>
{errors.npub && (
<p className="text-sm text-center text-red-600">
{errors.npub.message as string}
</p>
)}
</div>
<button
type="submit"
disabled={!isValid || loading}
className="inline-flex items-center justify-center w-full text-lg h-12 font-medium text-white bg-blue-500 rounded-xl hover:bg-blue-600 disabled:opacity-50"
>
{loading ? (
<LoaderIcon className="size-5 animate-spin" />
) : (
"Continue"
)}
</button>
</form>
</div>
</div>
</div>
);
}