diff --git a/pkg/interface/src/views/components/Invite/index.tsx b/pkg/interface/src/views/components/Invite/index.tsx index 9763e794cf..1cae0d38f4 100644 --- a/pkg/interface/src/views/components/Invite/index.tsx +++ b/pkg/interface/src/views/components/Invite/index.tsx @@ -11,7 +11,7 @@ import { import { Invite } from '@urbit/api/invite'; import { Text, Icon, Row } from '@tlon/indigo-react'; -import { cite } from '~/logic/lib/util'; +import { cite, useShowNickname } from '~/logic/lib/util'; import GlobalApi from '~/logic/api/global'; import { resourceFromPath } from '~/logic/lib/group'; import { GroupInvite } from './Group'; @@ -19,6 +19,7 @@ import { InviteSkeleton } from './InviteSkeleton'; import { JoinSkeleton } from './JoinSkeleton'; import { useWaitForProps } from '~/logic/lib/useWaitForProps'; import useGroupState from '~/logic/state/group'; +import useContactState from '~/logic/state/contact'; import useMetadataState from '~/logic/state/metadata'; interface InviteItemProps { @@ -37,7 +38,10 @@ export function InviteItem(props: InviteItemProps) { const status = pendingJoin[resource]; const groups = useGroupState(state => state.groups); const associations = useMetadataState(state => state.associations); - const waiter = useWaitForProps({ associations, groups, pendingJoin}, 50000); + const contacts = useContactState(state => state.contacts); + const contact = contacts?.[`~${invite?.ship}`] ?? {}; + const showNickname = useShowNickname(contact); + const waiter = useWaitForProps({ associations, groups, pendingJoin }, 50000); const history = useHistory(); const inviteAccept = useCallback(async () => { @@ -114,8 +118,10 @@ export function InviteItem(props: InviteItemProps) { > - - {cite(`~${invite!.ship}`)} + + {showNickname ? contact?.nickname : cite(`~${invite!.ship}`)} invited you to a DM @@ -140,8 +146,10 @@ export function InviteItem(props: InviteItemProps) { > - - {cite(`~${invite!.ship}`)} + + {showNickname ? contact?.nickname : cite(`~${invite!.ship}`)} invited you to ~{invite.resource.ship}/{invite.resource.name}