diff --git a/src/components/ProfileSection.tsx b/src/components/ProfileSection.tsx index 323d5a6..aa1b956 100644 --- a/src/components/ProfileSection.tsx +++ b/src/components/ProfileSection.tsx @@ -14,7 +14,7 @@ import { appRoutes, getProfilePageRoute } from '../routes' import '../styles/author.css' import '../styles/innerPage.css' import '../styles/socialPosts.css' -import { UserProfile, UserRelaysType } from '../types' +import { UserRelaysType } from '../types' import { copyTextToClipboard, hexToNpub, @@ -27,37 +27,18 @@ import { LoadingSpinner } from './LoadingSpinner' import { ZapPopUp } from './Zap' import placeholder from '../assets/img/DEGMods Placeholder Img.png' import { NDKEvent } from '@nostr-dev-kit/ndk' +import { useProfile } from 'hooks/useProfile' type Props = { pubkey: string } export const ProfileSection = ({ pubkey }: Props) => { - const { findMetadata } = useNDKContext() - const [profile, setProfile] = useState() - - useDidMount(() => { - findMetadata(pubkey).then((res) => { - setProfile(res) - }) - }) - - const displayName = - profile?.displayName || profile?.name || '[name not set up]' - const about = profile?.bio || profile?.about || '[bio not set up]' - return (
- +
@@ -109,21 +90,18 @@ export const ProfileSection = ({ pubkey }: Props) => { type ProfileProps = { pubkey: string - displayName: string - about: string - image?: string - nip05?: string - lud16?: string } -export const Profile = ({ - pubkey, - displayName, - about, - image, - nip05, - lud16 -}: ProfileProps) => { +export const Profile = ({ pubkey }: ProfileProps) => { + const profile = useProfile(pubkey) + + const displayName = + profile?.displayName || profile?.name || '[name not set up]' + const about = profile?.bio || profile?.about || '[bio not set up]' + const image = profile?.image || FALLBACK_PROFILE_IMAGE + const nip05 = profile?.nip05 + const lud16 = profile?.lud16 + const npub = hexToNpub(pubkey) const handleCopy = async () => { @@ -162,9 +140,7 @@ export const Profile = ({
diff --git a/src/hooks/useProfile.tsx b/src/hooks/useProfile.tsx new file mode 100644 index 0000000..15f00ff --- /dev/null +++ b/src/hooks/useProfile.tsx @@ -0,0 +1,18 @@ +import { useNDKContext } from 'hooks' +import { useState, useEffect } from 'react' +import { UserProfile } from 'types' + +export const useProfile = (pubkey?: string) => { + const { findMetadata } = useNDKContext() + const [profile, setProfile] = useState() + + useEffect(() => { + if (pubkey) { + findMetadata(pubkey).then((res) => { + setProfile(res) + }) + } + }, [findMetadata, pubkey]) + + return profile +} diff --git a/src/pages/profile.tsx b/src/pages/profile.tsx index ca3d17d..a36c602 100644 --- a/src/pages/profile.tsx +++ b/src/pages/profile.tsx @@ -8,7 +8,6 @@ import { Tabs } from 'components/Tabs' import { MOD_FILTER_LIMIT } from '../constants' import { useAppSelector, - useDidMount, useFilteredMods, useMuteLists, useNDKContext, @@ -25,7 +24,6 @@ import { ModeratedFilter, NSFWFilter, SortBy, - UserProfile, UserRelaysType } from 'types' import { @@ -37,6 +35,7 @@ import { signAndPublish } from 'utils' import { CheckboxField } from 'components/Inputs' +import { useProfile } from 'hooks/useProfile' export const ProfilePage = () => { // Try to decode nprofile parameter @@ -53,22 +52,14 @@ export const ProfilePage = () => { } const scrollTargetRef = useRef(null) - const { ndk, publish, findMetadata, fetchEventFromUserRelays, fetchMods } = - useNDKContext() - const [profile, setProfile] = useState() + const { ndk, publish, fetchEventFromUserRelays, fetchMods } = useNDKContext() const userState = useAppSelector((state) => state.user) const isOwnProfile = userState.auth && userState.user?.pubkey === profilePubkey const [isLoading, setIsLoading] = useState(false) const [loadingSpinnerDesc, setLoadingSpinnerDesc] = useState('') - useDidMount(() => { - if (profilePubkey) { - findMetadata(profilePubkey).then((res) => { - setProfile(res) - }) - } - }) + const profile = useProfile(profilePubkey) const displayName = profile?.displayName || profile?.name || '[name not set up]' diff --git a/src/pages/search.tsx b/src/pages/search.tsx index 2feb08d..9fe49d8 100644 --- a/src/pages/search.tsx +++ b/src/pages/search.tsx @@ -455,20 +455,9 @@ const UsersResult = ({
{filteredProfiles.map((profile) => { if (profile.pubkey) { - const displayName = - profile?.displayName || profile?.name || '[name not set up]' - const about = profile?.bio || profile?.about || '[bio not set up]' - return ( - + ) }