ndk profilepage
This commit is contained in:
parent
ff3502d626
commit
85169ebe0c
@ -1,17 +1,18 @@
|
||||
import "./DisplayName.css";
|
||||
import { useMemo } from "react";
|
||||
import { HexKey, UserMetadata } from "@snort/system";
|
||||
import { HexKey } from "@snort/system";
|
||||
import { getDisplayNameOrPlaceHolder } from "@/SnortUtils";
|
||||
import { useUserProfile } from "@snort/system-react";
|
||||
import classNames from "classnames";
|
||||
import useProfile from "@/Hooks/useProfile";
|
||||
import {NDKUserProfile} from "@nostr-dev-kit/ndk";
|
||||
|
||||
interface DisplayNameProps {
|
||||
pubkey: HexKey;
|
||||
user?: UserMetadata | undefined;
|
||||
user?: NDKUserProfile | undefined;
|
||||
}
|
||||
|
||||
const DisplayName = ({ pubkey }: DisplayNameProps) => {
|
||||
const profile = useUserProfile(pubkey);
|
||||
const profile = useProfile(pubkey);
|
||||
const [name, isPlaceHolder] = useMemo(() => getDisplayNameOrPlaceHolder(profile, pubkey), [profile, pubkey]);
|
||||
|
||||
return <span className={classNames({ placeholder: isPlaceHolder })}>{name}</span>;
|
||||
|
@ -2,7 +2,7 @@ import { NDKUserProfile } from "@nostr-dev-kit/ndk";
|
||||
import { useEffect, useState } from "react";
|
||||
import ndk from "@/ndk";
|
||||
|
||||
export default function useProfile(pubkey: string) {
|
||||
export default function useProfile(pubkey: string | undefined) {
|
||||
const [profile, setProfile] = useState(null as NDKUserProfile | null);
|
||||
useEffect(() => {
|
||||
if (pubkey) {
|
||||
|
@ -5,14 +5,12 @@ import { Link, useLocation, useNavigate, useParams } from "react-router-dom";
|
||||
import {
|
||||
encodeTLVEntries,
|
||||
EventKind,
|
||||
MetadataCache,
|
||||
NostrLink,
|
||||
NostrPrefix,
|
||||
TLVEntryType,
|
||||
tryParseNostrLink,
|
||||
} from "@snort/system";
|
||||
import { fetchNip05Pubkey, LNURL } from "@snort/shared";
|
||||
import { useUserProfile } from "@snort/system-react";
|
||||
|
||||
import { findTag, getLinkReactions, hexToBech32, parseId, unwrap } from "@/SnortUtils";
|
||||
import Note from "@/Element/Event/Note";
|
||||
@ -56,20 +54,22 @@ import DisplayName from "@/Element/User/DisplayName";
|
||||
import { UserWebsiteLink } from "@/Element/User/UserWebsiteLink";
|
||||
import { useMuteList, usePinList } from "@/Hooks/useLists";
|
||||
import FollowedBy from "@/Element/User/FollowedBy";
|
||||
import useProfile from "@/Hooks/useProfile";
|
||||
import {NDKUserProfile} from "@nostr-dev-kit/ndk";
|
||||
|
||||
interface ProfilePageProps {
|
||||
id?: string;
|
||||
state?: MetadataCache;
|
||||
state?: NDKUserProfile;
|
||||
}
|
||||
|
||||
export default function ProfilePage({ id: propId, state }: ProfilePageProps) {
|
||||
const params = useParams();
|
||||
const location = useLocation();
|
||||
const profileState = (location.state as MetadataCache | undefined) || state;
|
||||
const profileState = (location.state as NDKUserProfile | undefined) || state;
|
||||
const navigate = useNavigate();
|
||||
const [id, setId] = useState<string | undefined>(profileState?.pubkey);
|
||||
const [relays, setRelays] = useState<Array<string>>();
|
||||
const user = useUserProfile(profileState ? undefined : id) || profileState;
|
||||
const user = useProfile(id);
|
||||
const login = useLogin();
|
||||
const loginPubKey = login.publicKey;
|
||||
const isMe = loginPubKey === id;
|
||||
@ -163,10 +163,10 @@ export default function ProfilePage({ id: propId, state }: ProfilePageProps) {
|
||||
<>
|
||||
<div className="flex flex-col g4">
|
||||
<h2 className="flex items-center g4">
|
||||
<DisplayName user={user} pubkey={user?.pubkey ?? ""} />
|
||||
<FollowsYou followsMe={user?.pubkey !== loginPubKey && follows.includes(loginPubKey ?? "")} />
|
||||
<DisplayName user={user} pubkey={id ?? ""} />
|
||||
<FollowsYou followsMe={id !== loginPubKey && follows.includes(loginPubKey ?? "")} />
|
||||
</h2>
|
||||
{user?.nip05 && <Nip05 nip05={user.nip05} pubkey={user.pubkey} />}
|
||||
{user?.nip05 && <Nip05 nip05={user.nip05} pubkey={id} />}
|
||||
</div>
|
||||
{showBadges && <BadgeList badges={badges} />}
|
||||
{showStatus && <>{musicStatus()}</>}
|
||||
@ -293,7 +293,7 @@ export default function ProfilePage({ id: propId, state }: ProfilePageProps) {
|
||||
function avatar() {
|
||||
return (
|
||||
<div className="avatar-wrapper w-max">
|
||||
<Avatar pubkey={id ?? ""} user={user} onClick={() => setModalImage(user?.picture || "")} className="pointer" />
|
||||
<Avatar pubkey={id ?? ""} user={user} onClick={() => setModalImage(user?.image || "")} className="pointer" />
|
||||
<div className="profile-actions">
|
||||
{renderIcons()}
|
||||
{!isMe && id && <FollowButton pubkey={id} />}
|
||||
@ -363,7 +363,7 @@ export default function ProfilePage({ id: propId, state }: ProfilePageProps) {
|
||||
<div className="details-wrapper w-max">
|
||||
{username()}
|
||||
{bio()}
|
||||
{user?.pubkey && loginPubKey && <FollowedBy pubkey={user.pubkey} />}
|
||||
{id && loginPubKey && <FollowedBy pubkey={id} />}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -21,6 +21,7 @@ import {
|
||||
import { isHex, isOffline } from "@snort/shared";
|
||||
import { Birthday, Day } from "@/Const";
|
||||
import AnimalName from "@/Element/User/AnimalName";
|
||||
import {NDKUser, NDKUserProfile} from "@nostr-dev-kit/ndk";
|
||||
|
||||
export const sha256 = (str: string | Uint8Array): u256 => {
|
||||
return utils.bytesToHex(hash(str));
|
||||
@ -498,11 +499,11 @@ export const isBirthday = () => {
|
||||
return CONFIG.appName === "Snort" && IsTheSeason(event, 1);
|
||||
};
|
||||
|
||||
export function getDisplayName(user: UserMetadata | undefined, pubkey: HexKey): string {
|
||||
export function getDisplayName(user: NDKUserProfile | undefined, pubkey: HexKey): string {
|
||||
return getDisplayNameOrPlaceHolder(user, pubkey)[0];
|
||||
}
|
||||
|
||||
export function getDisplayNameOrPlaceHolder(user: UserMetadata | undefined, pubkey: HexKey): [string, boolean] {
|
||||
export function getDisplayNameOrPlaceHolder(user: NDKUserProfile | undefined, pubkey: HexKey): [string, boolean] {
|
||||
let name = hexToBech32(NostrPrefix.PublicKey, pubkey).substring(0, 12);
|
||||
let isPlaceHolder = false;
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user