diff --git a/src/state/queries/handle.ts b/src/state/queries/handle.ts new file mode 100644 index 0000000000..f4d7382df9 --- /dev/null +++ b/src/state/queries/handle.ts @@ -0,0 +1,34 @@ +import React from 'react' +import {useMutation} from '@tanstack/react-query' + +import {useSession} from '#/state/session' + +export function useGetHandle() { + const {agent} = useSession() + + return React.useCallback( + async (handleOrDid: string) => { + if (handleOrDid.startsWith('did:')) { + const res = await agent.getProfile({actor: handleOrDid}) + return res.data.handle + } + return handleOrDid + }, + [agent], + ) +} + +export function useGetHandleMutation() { + const {agent} = useSession() + + return useMutation({ + mutationFn: async (handleOrDid: string) => { + if (handleOrDid.startsWith('did:')) { + // TODO would be nice to do this without all the other fetched data + const res = await agent.getProfile({actor: handleOrDid}) + return res.data.handle + } + return handleOrDid + }, + }) +} diff --git a/src/view/shell/desktop/LeftNav.tsx b/src/view/shell/desktop/LeftNav.tsx index 90cf144d26..36739ea87d 100644 --- a/src/view/shell/desktop/LeftNav.tsx +++ b/src/view/shell/desktop/LeftNav.tsx @@ -45,6 +45,7 @@ import {useProfileQuery} from '#/state/queries/profile' import {useSession} from '#/state/session' import {useUnreadNotifications} from '#/state/queries/notifications/unread' import {useComposerControls} from '#/state/shell/composer' +import {useGetHandleMutation} from '#/state/queries/handle' const ProfileCard = observer(function ProfileCardImpl() { const {currentAccount} = useSession() @@ -124,6 +125,7 @@ const NavItem = observer(function NavItemImpl({ label, }: NavItemProps) { const pal = usePalette('default') + const {currentAccount} = useSession() const store = useStores() const {isDesktop, isTablet} = useWebMediaQueries() const [pathName] = React.useMemo(() => router.matchPath(href), [href]) @@ -137,7 +139,7 @@ const NavItem = observer(function NavItemImpl({ currentRouteInfo.name === 'Profile' ? isTab(currentRouteInfo.name, pathName) && (currentRouteInfo.params as CommonNavigatorParams['Profile']).name === - store.me.handle + currentAccount?.handle : isTab(currentRouteInfo.name, pathName) const {onPress} = useLinkProps({to: href}) const onPressWrapped = React.useCallback( @@ -194,11 +196,13 @@ const NavItem = observer(function NavItemImpl({ }) function ComposeBtn() { - const store = useStores() + const {currentAccount} = useSession() const {getState} = useNavigation() const {openComposer} = useComposerControls() const {_} = useLingui() const {isTablet} = useWebMediaQueries() + const {mutateAsync: getHandle, isPending: isGetHandlePending} = + useGetHandleMutation() const getProfileHandle = async () => { const {routes} = getState() @@ -210,13 +214,18 @@ function ComposeBtn() { ).name if (handle.startsWith('did:')) { - const cached = await store.profiles.cache.get(handle) - const profile = cached ? cached.data : undefined - // if we can't resolve handle, set to undefined - handle = profile?.handle || undefined + try { + handle = await getHandle(handle) + } catch (e) { + handle = undefined + } } - if (!handle || handle === store.me.handle || handle === 'handle.invalid') + if ( + !handle || + handle === currentAccount?.handle || + handle === 'handle.invalid' + ) return undefined return handle @@ -233,6 +242,7 @@ function ComposeBtn() { } return (