Replace nsec.app signup with njump.me

This commit is contained in:
Jon Staab
2025-01-28 13:04:37 -08:00
parent 414f5a5ace
commit e95c57bcb7
4 changed files with 71 additions and 99 deletions

View File

@@ -4,6 +4,7 @@
* Add reply to long-press menu * Add reply to long-press menu
* Fix @-mentions * Fix @-mentions
* Replace nsec.app signup with njump.me
# 0.2.5 # 0.2.5

View File

@@ -1,107 +1,50 @@
<script lang="ts"> <script lang="ts">
import {postJson, assoc} from "@welshman/lib" import {postJson} from "@welshman/lib"
import {makeSecret, Nip46Broker} from "@welshman/signer" import {isMobile} from "@lib/html"
import {pubkey, loadHandle, updateSession} from "@welshman/app"
import Icon from "@lib/components/Icon.svelte" import Icon from "@lib/components/Icon.svelte"
import Field from "@lib/components/Field.svelte"
import FieldInline from "@lib/components/FieldInline.svelte" import FieldInline from "@lib/components/FieldInline.svelte"
import Link from "@lib/components/Link.svelte"
import Button from "@lib/components/Button.svelte" import Button from "@lib/components/Button.svelte"
import Divider from "@lib/components/Divider.svelte" import Divider from "@lib/components/Divider.svelte"
import Spinner from "@lib/components/Spinner.svelte" import Spinner from "@lib/components/Spinner.svelte"
import LogIn from "@app/components/LogIn.svelte" import LogIn from "@app/components/LogIn.svelte"
import InfoNostr from "@app/components/InfoNostr.svelte" import InfoNostr from "@app/components/InfoNostr.svelte"
import SignUpSuccess from "@app/components/SignUpSuccess.svelte" import SignUpSuccess from "@app/components/SignUpSuccess.svelte"
import {pushModal, clearModals} from "@app/modal" import {pushModal} from "@app/modal"
import {setChecked} from "@app/notifications" import {BURROW_URL, PLATFORM_NAME} from "@app/state"
import {BURROW_URL, PLATFORM_NAME, NIP46_PERMS} from "@app/state"
import {pushToast} from "@app/toast" import {pushToast} from "@app/toast"
import {loginWithNip46} from "@app/commands"
const relays = ["wss://relay.nsec.app"] const ac = window.location.origin
const signerDomain = "nsec.app" const at = isMobile ? "android" : "web"
const signerPubkey = "e24a86943d37a91ab485d6f9a7c66097c25ddd67e8bd1b75ed252a3c266cf9bb" const nstart = `https://start.njump.me/?an=Flotilla&at=${at}&ac=${ac}`
const login = () => pushModal(LogIn) const login = () => pushModal(LogIn)
const withLoading = const signupPassword = async () => {
(cb: (...args: any[]) => any) =>
async (...args: any[]) => {
loading = true loading = true
try { try {
await cb(...args) const res = await postJson(BURROW_URL + "/user", {email, password})
if (res.error) {
pushToast({message: res.error, theme: "error"})
} else {
pushModal(SignUpSuccess, {email}, {replaceState: true})
}
} finally { } finally {
loading = false loading = false
} }
} }
const signupPassword = withLoading(async () => {
const res = await postJson(BURROW_URL + "/user", {email, password})
if (res.error) {
return pushToast({message: res.error, theme: "error"})
}
pushModal(SignUpSuccess, {email}, {replaceState: true})
})
const signupNsecApp = withLoading(async () => {
const handle = await loadHandle(`${username}@${signerDomain}`)
if (handle?.pubkey) {
return pushToast({
theme: "error",
message: "Sorry, it looks like that account already exists. Try logging in instead.",
})
}
const clientSecret = makeSecret()
const broker = Nip46Broker.get({
relays,
clientSecret,
signerPubkey,
algorithm: "nip04",
})
const userPubkey = await broker.createAccount(username, signerDomain, NIP46_PERMS)
if (!userPubkey) {
return pushToast({
theme: "error",
message: "Sorry, it looks like something went wrong. Please try again.",
})
}
// Now we can log in. Use the user's pubkey for the handler (legacy stuff)
const success = await loginWithNip46({relays, signerPubkey: userPubkey, clientSecret})
if (!success) {
return pushToast({
theme: "error",
message: "Sorry, it looks like something went wrong. Please try again.",
})
}
updateSession($pubkey!, assoc("email", email))
pushToast({message: "Successfully logged in!"})
setChecked("*")
clearModals()
})
const signup = () => { const signup = () => {
if (BURROW_URL) { if (BURROW_URL) {
signupPassword() signupPassword()
} else {
signupNsecApp()
} }
} }
let email = "" let email = ""
let password = "" let password = ""
let username = ""
let loading = false let loading = false
</script> </script>
@@ -136,29 +79,12 @@
on other nostr applications, you can create a nostr key yourself, or export your key from {PLATFORM_NAME} on other nostr applications, you can create a nostr key yourself, or export your key from {PLATFORM_NAME}
later. later.
</p> </p>
{:else}
<Field>
<div class="flex items-center gap-2" slot="input">
<label class="input input-bordered flex w-full items-center gap-2">
<Icon icon="user-rounded" />
<input bind:value={username} class="grow" type="text" placeholder="username" />
</label>
@{signerDomain}
</div>
</Field>
<Button type="submit" class="btn btn-primary" disabled={loading || !username}>
<Spinner {loading}>Sign Up</Spinner>
<Icon icon="alt-arrow-right" />
</Button>
{/if}
<Divider>Or</Divider> <Divider>Or</Divider>
<Link {/if}
external <a href={nstart} class="btn {email || password ? 'btn-neutral' : 'btn-primary'}">
href="https://nosta.me"
class="btn {username || email || password ? 'btn-neutral' : 'btn-primary'}">
<Icon icon="square-share-line" /> <Icon icon="square-share-line" />
Get started on Nosta.me Get started on njump
</Link> </a>
<div class="text-sm"> <div class="text-sm">
Already have an account? Already have an account?
<Button class="link" on:click={login}>Log in instead</Button> <Button class="link" on:click={login}>Log in instead</Button>

View File

@@ -1,3 +1,6 @@
import {hexToBytes, bytesToHex} from "@noble/hashes/utils"
import * as nip19 from "nostr-tools/nip19"
export const displayList = <T>(xs: T[], conj = "and", n = 6, locale = "en-US") => { export const displayList = <T>(xs: T[], conj = "and", n = 6, locale = "en-US") => {
const stringItems = xs.map(String) const stringItems = xs.map(String)
@@ -11,3 +14,13 @@ export const displayList = <T>(xs: T[], conj = "and", n = 6, locale = "en-US") =
return new Intl.ListFormat(locale, {style: "long", type: "conjunction"}).format(stringItems) return new Intl.ListFormat(locale, {style: "long", type: "conjunction"}).format(stringItems)
} }
export const nsecEncode = (secret: string) => nip19.nsecEncode(hexToBytes(secret))
export const nsecDecode = (nsec: string) => {
const {type, data} = nip19.decode(nsec)
if (type !== "nsec") throw new Error(`Invalid nsec: ${nsec}`)
return bytesToHex(data)
}

View File

@@ -1,10 +1,11 @@
<script lang="ts"> <script lang="ts">
import "@src/app.css" import "@src/app.css"
import {onMount} from "svelte" import {onMount} from "svelte"
import {nip19} from "nostr-tools" import * as nip19 from "nostr-tools/nip19"
import {get, derived} from "svelte/store" import {get, derived} from "svelte/store"
import {App} from "@capacitor/app" import {App} from "@capacitor/app"
import {dev} from "$app/environment" import {dev} from "$app/environment"
import {goto} from "$app/navigation"
import {bytesToHex, hexToBytes} from "@noble/hashes/utils" import {bytesToHex, hexToBytes} from "@noble/hashes/utils"
import {identity, sleep, take, sortBy, ago, now, HOUR, WEEK, MONTH, Worker} from "@welshman/lib" import {identity, sleep, take, sortBy, ago, now, HOUR, WEEK, MONTH, Worker} from "@welshman/lib"
import type {TrustedEvent} from "@welshman/util" import type {TrustedEvent} from "@welshman/util"
@@ -21,6 +22,7 @@
getPubkeyTagValues, getPubkeyTagValues,
getListTags, getListTags,
} from "@welshman/util" } from "@welshman/util"
import {Nip46Broker, getPubkey, makeSecret} from "@welshman/signer"
import { import {
relays, relays,
handles, handles,
@@ -39,6 +41,7 @@
getRelayUrls, getRelayUrls,
subscribe, subscribe,
userInboxRelaySelections, userInboxRelaySelections,
addSession,
} from "@welshman/app" } from "@welshman/app"
import * as lib from "@welshman/lib" import * as lib from "@welshman/lib"
import * as util from "@welshman/util" import * as util from "@welshman/util"
@@ -49,9 +52,10 @@
import ModalContainer from "@app/components/ModalContainer.svelte" import ModalContainer from "@app/components/ModalContainer.svelte"
import {setupTracking} from "@app/tracking" import {setupTracking} from "@app/tracking"
import {setupAnalytics} from "@app/analytics" import {setupAnalytics} from "@app/analytics"
import {nsecDecode} from "@lib/util"
import {theme} from "@app/theme" import {theme} from "@app/theme"
import {INDEXER_RELAYS, userMembership, ensureUnwrapped, canDecrypt} from "@app/state" import {INDEXER_RELAYS, userMembership, ensureUnwrapped, canDecrypt} from "@app/state"
import {loadUserData} from "@app/commands" import {loadUserData, loginWithNip46} from "@app/commands"
import {listenForNotifications} from "@app/requests" import {listenForNotifications} from "@app/requests"
import * as commands from "@app/commands" import * as commands from "@app/commands"
import * as requests from "@app/requests" import * as requests from "@app/requests"
@@ -82,6 +86,34 @@
...notifications, ...notifications,
}) })
// Nstart login
if (window.location.hash?.startsWith("#nostr-login")) {
const params = new URLSearchParams(window.location.hash.slice(1))
const login = params.get("nostr-login")
let success = false
try {
if (login?.startsWith("bunker://")) {
success = await loginWithNip46({
clientSecret: makeSecret(),
...Nip46Broker.parseBunkerUrl(login),
})
} else if (login) {
const secret = nsecDecode(login)
addSession({method: "nip01", secret, pubkey: getPubkey(secret)})
success = true
}
} catch (e) {
console.error(e)
}
if (success) {
goto("/home")
}
}
if (!db) { if (!db) {
setupTracking() setupTracking()
setupAnalytics() setupAnalytics()