diff --git a/src/element/Nip05.js b/src/element/Nip05.js
index 11691615..2267f015 100644
--- a/src/element/Nip05.js
+++ b/src/element/Nip05.js
@@ -36,16 +36,20 @@ export function useIsVerified(nip05, pubkey) {
)
const isVerified = isSuccess && data === pubkey
const cantVerify = isSuccess && data !== pubkey
- return { name, domain: domain?.toLowerCase(), isVerified, couldNotVerify: isError || cantVerify }
+ return { isVerified, couldNotVerify: isError || cantVerify }
}
-const Nip05 = ({ name, domain, isVerified, couldNotVerify }) => {
+const Nip05 = ({ nip05, pubkey, defaultUsername = '' }) => {
+ const [name, domain] = nip05 ? nip05.split('@') : []
const isDefaultUser = name === '_'
+ const { isVerified, couldNotVerify } = useIsVerified(nip05, pubkey)
return (
ev.stopPropagation()}>
- {!isDefaultUser &&
{name}
}
-
+
+ {isDefaultUser ? defaultUsername : name}
+
+
{domain}
diff --git a/src/element/Note.js b/src/element/Note.js
index 7745ae2e..6a5c27e3 100644
--- a/src/element/Note.js
+++ b/src/element/Note.js
@@ -9,6 +9,7 @@ import Text from "./Text";
import { eventLink, hexToBech32 } from "../Util";
import NoteFooter from "./NoteFooter";
import NoteTime from "./NoteTime";
+import Nip05 from "./Nip05";
export default function Note(props) {
const navigate = useNavigate();
diff --git a/src/element/ProfileImage.css b/src/element/ProfileImage.css
index f75504f4..f527152d 100644
--- a/src/element/ProfileImage.css
+++ b/src/element/ProfileImage.css
@@ -18,3 +18,13 @@
.pfp a:hover {
text-decoration: underline;
}
+
+.pfp .nip05 {
+ font-size: 14px;
+ margin: 0;
+}
+
+.pfp .profile-name {
+ display: flex;
+ flex-direction: row;
+}
diff --git a/src/element/ProfileImage.js b/src/element/ProfileImage.js
index 828c583c..b86f796c 100644
--- a/src/element/ProfileImage.js
+++ b/src/element/ProfileImage.js
@@ -6,6 +6,7 @@ import { Link, useNavigate } from "react-router-dom";
import useProfile from "../feed/ProfileFeed";
import { hexToBech32, profileLink } from "../Util";
import LazyImage from "./LazyImage";
+import Nip05 from "./Nip05";
export default function ProfileImage({ pubkey, subHeader, showUsername = true, className, link }) {
const navigate = useNavigate();
@@ -26,10 +27,20 @@ export default function ProfileImage({ pubkey, subHeader, showUsername = true, c
navigate(link ?? profileLink(pubkey))} />
{showUsername && (
-
{name}
+
+
+ {user?.nip05 ? (
+
+ ): name}
+
+
{subHeader ? <>{subHeader}> : null}
)}
)
-}
\ No newline at end of file
+}
diff --git a/src/element/Textarea.tsx b/src/element/Textarea.tsx
index 94738a9d..35a75d1a 100644
--- a/src/element/Textarea.tsx
+++ b/src/element/Textarea.tsx
@@ -4,7 +4,7 @@ import { useLiveQuery } from "dexie-react-hooks";
import ReactTextareaAutocomplete from "@webscopeio/react-textarea-autocomplete";
// @ts-expect-error
-import Nip05, { useIsVerified } from "./Nip05";
+import Nip05 from "./Nip05";
import "@webscopeio/react-textarea-autocomplete/style.css";
import "./Textarea.css";
// @ts-expect-error
@@ -25,7 +25,6 @@ function searchUsers(query: string, users: User[]) {
}
const UserItem = ({ pubkey, display_name, picture, nip05, ...rest }: User) => {
- const { isVerified, couldNotVerify, name, domain } = useIsVerified(nip05, pubkey)
return (
@@ -33,7 +32,7 @@ const UserItem = ({ pubkey, display_name, picture, nip05, ...rest }: User) => {
{display_name || rest.name}
-
+
)
diff --git a/src/pages/ProfilePage.js b/src/pages/ProfilePage.js
index 3e801bf5..a1ca626b 100644
--- a/src/pages/ProfilePage.js
+++ b/src/pages/ProfilePage.js
@@ -13,7 +13,7 @@ import { extractLnAddress, parseId, hexToBech32 } from "../Util";
import Timeline from "../element/Timeline";
import Text from '../element/Text'
import LNURLTip from "../element/LNURLTip";
-import Nip05, { useIsVerified } from "../element/Nip05";
+import Nip05 from "../element/Nip05";
import Copy from "../element/Copy";
import ProfilePreview from "../element/ProfilePreview";
import FollowersList from "../element/FollowersList";
@@ -37,9 +37,9 @@ export default function ProfilePage() {
const [showLnQr, setShowLnQr] = useState(false);
const [tab, setTab] = useState(ProfileTab.Notes);
const about = Text({ content: user?.about })
- const { name, domain, isVerified, couldNotVerify } = useIsVerified(user?.nip05, user?.pubkey)
const avatarUrl = (user?.picture?.length ?? 0) === 0 ? Nostrich : user?.picture
const backgroundImage = `url(${avatarUrl})`
+ const domain = user?.nip05 && user.nip05.split('@')[1]
useEffect(() => {
setTab(ProfileTab.Notes);
@@ -50,7 +50,7 @@ export default function ProfilePage() {
{user?.display_name || user?.name || 'Nostrich'}
- {user?.nip05 && }
+ {user?.nip05 && }
)
}
@@ -103,7 +103,7 @@ export default function ProfilePage() {
function avatar() {
return (