diff --git a/packages/uiweb/src/lib/components/chat/ChatPreviewList/ChatPreviewList.tsx b/packages/uiweb/src/lib/components/chat/ChatPreviewList/ChatPreviewList.tsx index 5d16295de..a31fe7d39 100644 --- a/packages/uiweb/src/lib/components/chat/ChatPreviewList/ChatPreviewList.tsx +++ b/packages/uiweb/src/lib/components/chat/ChatPreviewList/ChatPreviewList.tsx @@ -7,7 +7,14 @@ import { CONSTANTS, IFeeds, IUser } from '@pushprotocol/restapi'; import styled from 'styled-components'; // Internal Compoonents -import { getAddress, getNewChatUser, pCAIP10ToWallet, traceStackCalls, walletToPCAIP10 } from '../../../helpers'; +import { + getAddress, + getDomainIfExists, + getNewChatUser, + pCAIP10ToWallet, + traceStackCalls, + walletToPCAIP10, +} from '../../../helpers'; import { useChatData, usePushChatStream } from '../../../hooks'; import useFetchChat from '../../../hooks/chat/useFetchChat'; import useFetchMessageUtilities from '../../../hooks/chat/useFetchMessageUtilities'; @@ -609,7 +616,7 @@ export const ChatPreviewList: React.FC = (options: IChatP let userProfile: IUser | undefined = undefined; let groupProfile: Group; - if (formattedChatId.includes('.')) { + if (getDomainIfExists(formattedChatId)) { const address = await getAddress(formattedChatId, user ? user.env : CONSTANTS.ENV.PROD); if (address) formattedChatId = pCAIP10ToWallet(address); else { diff --git a/packages/uiweb/src/lib/components/chat/ChatPreviewSearchList/ChatPreviewSearchList.tsx b/packages/uiweb/src/lib/components/chat/ChatPreviewSearchList/ChatPreviewSearchList.tsx index b5a980193..3369166a0 100644 --- a/packages/uiweb/src/lib/components/chat/ChatPreviewSearchList/ChatPreviewSearchList.tsx +++ b/packages/uiweb/src/lib/components/chat/ChatPreviewSearchList/ChatPreviewSearchList.tsx @@ -1,33 +1,17 @@ // React + Web3 Essentials -import { ethers } from 'ethers'; import React, { useContext, useEffect, useRef, useState } from 'react'; // External Packages -import { CONSTANTS, IFeeds, IUser } from '@pushprotocol/restapi'; import styled from 'styled-components'; // Internal Compoonents -import { - deriveChatId, - getAddress, - getNewChatUser, - pCAIP10ToWallet, - traceStackCalls, - walletToPCAIP10, -} from '../../../helpers'; -import { useChatData, usePushChatStream } from '../../../hooks'; +import { deriveChatId, getDomainIfExists, pCAIP10ToWallet } from '../../../helpers'; +import { useChatData } from '../../../hooks'; import useFetchChat from '../../../hooks/chat/useFetchChat'; -import useFetchMessageUtilities from '../../../hooks/chat/useFetchMessageUtilities'; import useGetGroupByIDnew from '../../../hooks/chat/useGetGroupByIDnew'; -import usePushUser from '../../../hooks/usePushUser'; import { Button, Section, Span, Spinner } from '../../reusables'; import { ChatPreview } from '../ChatPreview'; -import { - displayDefaultUser, - generateRandomNonce, - transformChatItems, - transformStreamToIChatPreviewPayload, -} from '../helpers'; +import { generateRandomNonce, getChatParticipantDisplayName, transformStreamToIChatPreviewPayload } from '../helpers'; // Internal Configs import { ThemeContext } from '../theme/ThemeProvider'; @@ -37,7 +21,6 @@ import { ThemeContext } from '../theme/ThemeProvider'; // Interfaces & Types import { ChatPreviewSearchListErrorCodes, - Group, IChatPreviewSearchListError, IChatPreviewSearchListProps, IChatPreviewPayload, @@ -73,7 +56,6 @@ interface IChatPreviewListMeta { } // Constants -const CHAT_PAGE_LIMIT = 10; const SCROLL_LIMIT = 25; // Exported Interfaces & Types @@ -82,9 +64,7 @@ const SCROLL_LIMIT = 25; export const ChatPreviewSearchList: React.FC = (options: IChatPreviewSearchListProps) => { // get hooks const { user } = useChatData(); - const { fetchUserProfile } = usePushUser(); const { getGroupByIDnew } = useGetGroupByIDnew(); - const { fetchLatestMessage, fetchChatList } = useFetchMessageUtilities(); // set chat preview list const [chatPreviewList, setChatPreviewList] = useState({ @@ -192,7 +172,7 @@ export const ChatPreviewSearchList: React.FC = (opt let derivedChatId = formattedChatId; // Check if the chatId is ENS / Web3 Name - if (formattedChatId.includes('.')) { + if (getDomainIfExists(formattedChatId)) { // resolve web3 name derivedChatId = await deriveChatId(formattedChatId, user); } @@ -211,7 +191,6 @@ export const ChatPreviewSearchList: React.FC = (opt const groupInfo = await getGroupByIDnew({ groupId: derivedChatId, }); - if (groupInfo) { searchedChat = { ...searchedChat, @@ -230,11 +209,10 @@ export const ChatPreviewSearchList: React.FC = (opt } else { const userProfile = await user?.info({ overrideAccount: chatInfo.recipient }); console.debug('UIWeb::components::ChatPreviewSearchList::loadMoreChats::userProfile', userProfile); - searchedChat = { ...searchedChat, chatId: derivedChatId, - chatParticipant: derivedChatId, + chatParticipant: getChatParticipantDisplayName(derivedChatId, formattedChatId), chatGroup: false, chatPic: userProfile?.profile?.picture || null, chatMsg: { @@ -242,7 +220,6 @@ export const ChatPreviewSearchList: React.FC = (opt messageContent: chatInfo?.list === 'CHATS' ? 'Resume Chat!' : 'Start Chat!', }, }; - resolved = true; } } else { @@ -349,22 +326,6 @@ export const ChatPreviewSearchList: React.FC = (opt }); }; - //Transform group creation stream - const transformGroupCreationStream: (item: any) => void = async (item: any) => { - const transformedItem: IChatPreviewPayload = { - chatId: item?.chatId, - chatPic: item?.meta.image, - chatParticipant: item?.meta.name, - chatGroup: true, - chatTimestamp: undefined, - chatMsg: { - messageType: '', - messageContent: '', - }, - }; - addChatItems([transformedItem], false); - }; - // Transform stream message const transformStreamMessage: (item: any) => void = async (item: any) => { if (!user) { diff --git a/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfile.tsx b/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfile.tsx index 25375b0ce..4237895d1 100644 --- a/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfile.tsx +++ b/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfile.tsx @@ -12,6 +12,7 @@ import styled from 'styled-components'; import { deriveChatId, getAddress, + getDomainIfExists, pCAIP10ToWallet, resolveWeb3Name, shortenText, @@ -166,6 +167,7 @@ export const ChatProfile: React.FC = ({ profile.abbrRecipient = getAbbreiatedRecipient(recipient); profile.desc = profileInfo.profile?.desc; profile.isGroup = false; + profile.web3Name = getDomainIfExists(chatId); } else { throw new Error( 'UIWeb::ChatProfile::user.profile.info fetch error, possible push user does not exist.' @@ -180,13 +182,14 @@ export const ChatProfile: React.FC = ({ profile.icon = null; profile.chatId = derivedChatId; profile.recipient = recipient; + profile.web3Name = getDomainIfExists(chatId); profile.abbrRecipient = getAbbreiatedRecipient(recipient); profile.desc = ''; profile.isGroup = false; } // get and set web3 name asynchrounously - if (profile.recipient) { + if (profile.recipient && !profile.web3Name) { setupWeb3Name(profile.recipient); } } diff --git a/packages/uiweb/src/lib/components/chat/MessageInput/MessageInput.tsx b/packages/uiweb/src/lib/components/chat/MessageInput/MessageInput.tsx index 2c6a75eb6..104d6f28a 100644 --- a/packages/uiweb/src/lib/components/chat/MessageInput/MessageInput.tsx +++ b/packages/uiweb/src/lib/components/chat/MessageInput/MessageInput.tsx @@ -6,7 +6,7 @@ import { createPortal } from 'react-dom'; import { MdCheckCircle, MdError } from 'react-icons/md'; import styled from 'styled-components'; -import { deriveChatId, pCAIP10ToWallet, setAccessControl, walletToPCAIP10 } from '../../../helpers'; +import { deriveChatId, getDomainIfExists, pCAIP10ToWallet, setAccessControl, walletToPCAIP10 } from '../../../helpers'; import { useChatData, useClickAway, useDeviceWidthCheck, usePushChatStream } from '../../../hooks'; import useFetchChat from '../../../hooks/chat/useFetchChat'; import useGetGroupByIDnew from '../../../hooks/chat/useGetGroupByIDnew'; @@ -163,7 +163,7 @@ export const MessageInput: React.FC = ({ if (!user) return; if (chatId) { let derivedChatId = chatId; - if (derivedChatId.includes('.')) { + if (getDomainIfExists(derivedChatId)) { derivedChatId = (await deriveChatId(chatId, user))!; } diff --git a/packages/uiweb/src/lib/components/chat/helpers/helper.ts b/packages/uiweb/src/lib/components/chat/helpers/helper.ts index f5e7460ce..d03f7e3ac 100644 --- a/packages/uiweb/src/lib/components/chat/helpers/helper.ts +++ b/packages/uiweb/src/lib/components/chat/helpers/helper.ts @@ -2,7 +2,7 @@ import { Env, IFeeds, IMessageIPFSWithCID, IUser, ParticipantStatus } from '@pus import { ethers } from 'ethers'; import moment from 'moment'; import { ProfilePicture } from '../../../config'; -import { getAddress, walletToPCAIP10 } from '../../../helpers'; +import { getAddress, getDomainIfExists, walletToPCAIP10 } from '../../../helpers'; import { Group, IChatPreviewPayload, IMessagePayload, User } from '../exportedTypes'; export const profilePicture = `data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAvklEQVR4AcXBsW2FMBiF0Y8r3GQb6jeBxRauYRpo4yGQkMd4A7kg7Z/GUfSKe8703fKDkTATZsJsrr0RlZSJ9r4RLayMvLmJjnQS1d6IhJkwE2bT13U/DBzp5BN73xgRZsJMmM1HOolqb/yWiWpvjJSUiRZWopIykTATZsJs5g+1N6KSMiO1N/5DmAkzYTa9Lh6MhJkwE2ZzSZlo7xvRwson3txERzqJhJkwE2bT6+JhoKTMJ2pvjAgzYSbMfgDlXixqjH6gRgAAAABJRU5ErkJggg==`; @@ -108,8 +108,6 @@ export const formatAddress = async (chatPreviewPayload: IChatPreviewPayload, env // check and remove eip155: if (formattedAddress.includes('eip155:')) { formattedAddress = formattedAddress.replace('eip155:', ''); - } else if (formattedAddress.includes('.')) { - formattedAddress = (await getAddress(formattedAddress, env))!; } } @@ -228,3 +226,7 @@ export const transformStreamToIMessageIPFSWithCID: (item: any) => IMessageIPFSWi }; return transformedItem; }; + +export const getChatParticipantDisplayName = (derivedChatId: string, chatId: string) => { + return derivedChatId ? getDomainIfExists(chatId) ?? derivedChatId : derivedChatId; +}; diff --git a/packages/uiweb/src/lib/helpers/chat/search.ts b/packages/uiweb/src/lib/helpers/chat/search.ts index 36b73ac7c..f9eab5b15 100644 --- a/packages/uiweb/src/lib/helpers/chat/search.ts +++ b/packages/uiweb/src/lib/helpers/chat/search.ts @@ -5,6 +5,7 @@ import { pCAIP10ToWallet, walletToPCAIP10 } from '../address'; import { getUdResolverClient } from '../udResolver'; import { displayDefaultUser } from './user'; import { createWeb3Name } from '@web3-name-sdk/core'; +import { getDomainIfExists } from '../utils'; export const getObjectsWithMatchingKeys = ( obj: ChatFeedsType, @@ -61,7 +62,7 @@ export const getAddress = async (searchText: string, env: Env) => { const udResolverClient = getUdResolverClient(env); const web3NameClient = createWeb3Name(); let address: string | null = null; - if (searchText.includes('.')) { + if (getDomainIfExists(searchText)) { try { address = await web3NameClient.getAddress(searchText); if (!address) { diff --git a/packages/uiweb/src/lib/helpers/utils.ts b/packages/uiweb/src/lib/helpers/utils.ts index 8cd145e13..f865e5567 100644 --- a/packages/uiweb/src/lib/helpers/utils.ts +++ b/packages/uiweb/src/lib/helpers/utils.ts @@ -28,7 +28,7 @@ export const deriveChatId = async (chatId: string, user: PushAPI | undefined): P } else if (chatId.includes('eip155:')) { // remove eip155: chatId = chatId.replace('eip155:', ''); - } else if (chatId.includes('.')) { + } else if (getDomainIfExists(chatId)) { chatId = (await getAddress(chatId, user ? user.env : CONSTANTS.ENV.PROD))!; } @@ -40,3 +40,5 @@ export const isMessageEncrypted = (message: string) => { return message.startsWith('U2FsdGVkX1'); }; + +export const getDomainIfExists = (chatId: string) => (chatId.includes('.') ? chatId : null);