feat: nip19/21 links

packages/app/src/Pages/EventPage.tsx

@@ -1,12 +1,17 @@
 import { useParams } from "react-router-dom";
+
 import Thread from "Element/Thread";
 import useThreadFeed from "Feed/ThreadFeed";
-import { parseId } from "Util";
+import { parseNostrLink, unwrap } from "Util";
 
 export default function EventPage() {
   const params = useParams();
-  const id = parseId(params.id ?? "");
-  const thread = useThreadFeed(id);
+  const link = parseNostrLink(params.id ?? "");
+  const thread = useThreadFeed(unwrap(link));
 
-  return <Thread key={id} notes={thread.notes} />;
+  if (link) {
+    return <Thread key={link.id} notes={thread.notes} selected={link.id} />;
+  } else {
+    return <b>{params.id}</b>;
+  }
 }

packages/app/src/Pages/Login.tsx

@@ -10,7 +10,8 @@ import { HexKey } from "@snort/nostr";
 import { RootState } from "State/Store";
 import { setPrivateKey, setPublicKey, setRelays, setGeneratedPrivateKey } from "State/Login";
 import { DefaultRelays, EmailRegex, MnemonicRegex } from "Const";
-import { bech32ToHex, generateBip39Entropy, entropyToDerivedKey, unwrap } from "Util";
+import { bech32ToHex, unwrap } from "Util";
+import { generateBip39Entropy, entropyToDerivedKey } from "nip6";
 import ZapButton from "Element/ZapButton";
 import useImgProxy from "Hooks/useImgProxy";
 

packages/app/src/Pages/NostrLinkHandler.tsx

@@ -1,9 +1,10 @@
-import { decodeTLV, NostrPrefix, TLVEntryType } from "@snort/nostr";
+import { NostrPrefix } from "@snort/nostr";
 import { useEffect } from "react";
 import { useDispatch } from "react-redux";
 import { useNavigate, useParams } from "react-router-dom";
+
 import { setRelays } from "State/Login";
-import { eventLink, profileLink } from "Util";
+import { parseNostrLink, unixNowMs, unwrap } from "Util";
 
 export default function NostrLinkHandler() {
   const params = useParams();
@@ -13,29 +14,21 @@ export default function NostrLinkHandler() {
 
   useEffect(() => {
     if (link.length > 0) {
-      const entity = link.startsWith("web+nostr:") ? link.split(":")[1] : link;
-      if (entity.startsWith(NostrPrefix.PublicKey)) {
-        navigate(`/p/${entity}`);
-      } else if (entity.startsWith(NostrPrefix.Note)) {
-        navigate(`/e/${entity}`);
-      } else if (entity.startsWith(NostrPrefix.Profile) || entity.startsWith(NostrPrefix.Event)) {
-        const decoded = decodeTLV(entity);
-        console.debug(decoded);
-
-        const id = decoded.find(a => a.type === TLVEntryType.Special)?.value as string;
-        const relays = decoded.filter(a => a.type === TLVEntryType.Relay);
-        if (relays.length > 0) {
-          const relayObj = {
-            relays: Object.fromEntries(relays.map(a => [a.value, { read: true, write: false }])),
-            createdAt: new Date().getTime(),
-          };
-          dispatch(setRelays(relayObj));
+      const nav = parseNostrLink(link);
+      if (nav) {
+        if ((nav.relays?.length ?? 0) > 0) {
+          // todo: add as ephemerial connection
+          dispatch(
+            setRelays({
+              relays: Object.fromEntries(unwrap(nav.relays).map(a => [a, { read: true, write: false }])),
+              createdAt: unixNowMs(),
+            })
+          );
         }
-
-        if (entity.startsWith(NostrPrefix.Profile)) {
-          navigate(profileLink(id));
-        } else if (entity.startsWith(NostrPrefix.Event)) {
-          navigate(eventLink(id));
+        if (nav.type === NostrPrefix.Event || nav.type === NostrPrefix.Note || nav.type === NostrPrefix.Address) {
+          navigate(`/e/${nav.encode()}`);
+        } else if (nav.type === NostrPrefix.PublicKey || nav.type === NostrPrefix.Profile) {
+          navigate(`/p/${nav.encode()}`);
         }
       }
     }

packages/app/src/Pages/ProfilePage.tsx

@@ -3,9 +3,9 @@ import { useEffect, useState } from "react";
 import { useIntl, FormattedMessage } from "react-intl";
 import { useSelector } from "react-redux";
 import { useNavigate, useParams } from "react-router-dom";
-import { NostrPrefix } from "@snort/nostr";
+import { encodeTLV, NostrPrefix } from "@snort/nostr";
 
-import { unwrap } from "Util";
+import { parseNostrLink, unwrap } from "Util";
 import { formatShort } from "Number";
 import Note from "Element/Note";
 import Bookmarks from "Element/Bookmarks";
@@ -73,7 +73,7 @@ export default function ProfilePage() {
     tags: [],
     creator: "",
   });
-  const npub = !id?.startsWith("npub") ? hexToBech32("npub", id || undefined) : id;
+  const npub = !id?.startsWith(NostrPrefix.PublicKey) ? hexToBech32(NostrPrefix.PublicKey, id || undefined) : id;
 
   const lnurl = extractLnAddress(user?.lud16 || user?.lud06 || "");
   const website_url =
@@ -116,7 +116,13 @@ export default function ProfilePage() {
         setId(a);
       });
     } else {
-      setId(parseId(params.id ?? ""));
+      const nav = parseNostrLink(params.id ?? "");
+      if (nav?.type === NostrPrefix.PublicKey || nav?.type === NostrPrefix.Profile) {
+        // todo: use relays if any for nprofile
+        setId(nav.id);
+      } else {
+        setId(parseId(params.id ?? ""));
+      }
     }
     setTab(ProfileTab.Notes);
   }, [params]);
@@ -252,6 +258,10 @@ export default function ProfilePage() {
   }
 
   function renderIcons() {
+    if (!id) return;
+
+    const firstRelay = relays.find(a => a.settings.write)?.url;
+    const link = encodeTLV(id, NostrPrefix.Profile, firstRelay ? [firstRelay] : undefined);
     return (
       <div className="icon-actions">
         <IconButton onClick={() => setShowProfileQr(true)}>
@@ -259,13 +269,9 @@ export default function ProfilePage() {
         </IconButton>
         {showProfileQr && (
           <Modal className="qr-modal" onClose={() => setShowProfileQr(false)}>
-            <ProfileImage pubkey={id ?? ""} />
-
-            <QrCode
-              data={`nostr:${hexToBech32(NostrPrefix.PublicKey, id)}`}
-              link={undefined}
-              className=" m10 align-center"
-            />
+            <ProfileImage pubkey={id} />
+            <QrCode data={link} className="m10 align-center" />
+            <Copy text={link} className="align-center" />
           </Modal>
         )}
         {isMe ? (
@@ -295,12 +301,13 @@ export default function ProfilePage() {
   }
 
   function userDetails() {
+    if (!id) return;
     return (
       <div className="details-wrapper">
         {username()}
         <div className="profile-actions">
           {renderIcons()}
-          {!isMe && <FollowButton pubkey={id ?? ""} />}
+          {!isMe && <FollowButton pubkey={id} />}
         </div>
         {bio()}
       </div>

packages/app/src/Pages/new/NewUserFlow.tsx

@@ -6,7 +6,8 @@ import Logo from "Element/Logo";
 import { CollapsedSection } from "Element/Collapsed";
 import Copy from "Element/Copy";
 import { RootState } from "State/Store";
-import { hexToBech32, hexToMnemonic } from "Util";
+import { hexToBech32 } from "Util";
+import { hexToMnemonic } from "nip6";
 
 import messages from "./messages";