diff --git a/packages/uiweb/src/lib/components/supportChat/AddressInfo.tsx b/packages/uiweb/src/lib/components/supportChat/AddressInfo.tsx index 48db2ea0e..300586c4f 100644 --- a/packages/uiweb/src/lib/components/supportChat/AddressInfo.tsx +++ b/packages/uiweb/src/lib/components/supportChat/AddressInfo.tsx @@ -14,11 +14,14 @@ export const AddressInfo: React.FC = () => { useEffect(() => { const getUser = async () => { - const user = await userAlice.info(); +if(userAlice){ + const user = await userAlice.info(); setUser(user); +} + }; getUser(); - }, [supportAddress]); + }, [supportAddress, userAlice]); return ( diff --git a/packages/uiweb/src/lib/components/supportChat/Chat.tsx b/packages/uiweb/src/lib/components/supportChat/Chat.tsx index 01107593f..767d37b92 100644 --- a/packages/uiweb/src/lib/components/supportChat/Chat.tsx +++ b/packages/uiweb/src/lib/components/supportChat/Chat.tsx @@ -47,14 +47,21 @@ export type ButtonStyleProps = { const [toastMessage, setToastMessage] = useState(''); const [toastType, setToastType] = useState<'error' | 'success'>(); const [chats, setChats] = useState([]); - const [accountadd, setAccount] = useState(account) + const [accountadd, setAccountadd] = useState(account) const [userAlice, setUserAlice] = useState(null); const setChatsSorted = (chats: IMessageIPFS[]) => { + + const chatsWithNumericTimestamps = chats.map(item => ({ + ...item, + timestamp: typeof item.timestamp === 'string' ? parseInt(item.timestamp) : item.timestamp + })); + const uniqueChats = [ - ...new Map(chats.map((item) => [item['timestamp'], item])).values(), + ...new Map(chatsWithNumericTimestamps.map((item) => [item.timestamp, item])).values(), ]; uniqueChats.sort((a, b) => { + return a.timestamp! > b.timestamp! ? 1 : -1; }); setChats(uniqueChats); @@ -63,10 +70,12 @@ export type ButtonStyleProps = { account: accountadd, env, apiKey, - userAlice + userAlice, + supportAddress, + signer }); - console.log("chanecing", socketData) + const chatPropsData = { account : accountadd, signer, @@ -82,20 +91,24 @@ export type ButtonStyleProps = { useEffect(() => { (async () => { if(signer) { - const userAlice = await PushAPI.initialize(signer, {env: env}); - setUserAlice(userAlice) if (!account) { const address = await getAddressFromSigner(signer); - setAccount(address); + setAccountadd(address); + const userAlice = await PushAPI.initialize(signer, {env: env , account:address}); + setUserAlice(userAlice) } else{ - setAccount(account); + setAccountadd(account); + const userAlice = await PushAPI.initialize(signer, {env: env , account:account}); + setUserAlice(userAlice) } } })(); },[signer]) + + useEffect(() => { setChats([]); setConnectedUser(null); diff --git a/packages/uiweb/src/lib/components/supportChat/ChatInput.tsx b/packages/uiweb/src/lib/components/supportChat/ChatInput.tsx index 049cbaf7e..ef37b0609 100644 --- a/packages/uiweb/src/lib/components/supportChat/ChatInput.tsx +++ b/packages/uiweb/src/lib/components/supportChat/ChatInput.tsx @@ -47,13 +47,20 @@ export const ChatInput: React.FC = () => { }); console.log(sendResponse); + if (!sendResponse) { + setToastMessage(sendResponse); + setToastType('error'); + setLoading(false); + + } if (typeof sendResponse !== 'string') { - sendResponse.messageContent = message; - setChatsSorted([...chats, sendResponse]); + // sendResponse.messageContent = message; + // setChatsSorted([...chats, sendResponse]); setMessage(''); setLoading(false); - } else { + } + else { setToastMessage(sendResponse); setToastType('error'); setLoading(false); diff --git a/packages/uiweb/src/lib/components/supportChat/Chats.tsx b/packages/uiweb/src/lib/components/supportChat/Chats.tsx index 1b2cb441e..4dbc815e3 100644 --- a/packages/uiweb/src/lib/components/supportChat/Chats.tsx +++ b/packages/uiweb/src/lib/components/supportChat/Chats.tsx @@ -58,7 +58,7 @@ if (typeof msg.timestamp === "string") { {(msg.fromCAIP10 === caip10 || msg.from === caip10 ) ? ( - {console.log("woiiii" , msg.messageContent)} + {msg.messageContent || msg.message?.content} {msg.timestamp !== undefined && {date}} @@ -67,7 +67,7 @@ if (typeof msg.timestamp === "string") { {msg?.icon && msg.icon} - {console.log("insideee",msg.message?.content)} + { msg.message?.content || msg.messageContent} {msg.timestamp !== undefined && {date}} diff --git a/packages/uiweb/src/lib/components/supportChat/Modal.tsx b/packages/uiweb/src/lib/components/supportChat/Modal.tsx index 4bfccad36..82d889788 100644 --- a/packages/uiweb/src/lib/components/supportChat/Modal.tsx +++ b/packages/uiweb/src/lib/components/supportChat/Modal.tsx @@ -91,7 +91,7 @@ export const Modal: React.FC = () => { const { chatsResponse, lastThreadHash, lastListPresent } = await getChats({ account, userAlice, - pgpPrivateKey: connectedUser.privateKey, + // pgpPrivateKey: connectedUser.privateKey, supportAddress, threadHash: lastThreadHashFetched!, limit: chatsFetchedLimit, @@ -119,31 +119,37 @@ export const Modal: React.FC = () => { } }; - const getUpdatedChats = async (message:IMessageIPFS) =>{ - - if (message && (supportAddress === pCAIP10ToWallet(message?.from))) { + // const getUpdatedChats = (message:IMessageIPFS) =>{ + // console.log(message) + // if (message && (supportAddress === pCAIP10ToWallet(message?.from))) { // const chat = await decryptChat({ message, connectedUser, env }); // socketData.messagesSinceLastConnection.decrypted = true; - setChatsSorted([...chats, message]); - } - } + // setChatsSorted([...chats, message]); + // } + // } + + useEffect(() => { if(socketData.messagesSinceLastConnection){ - getUpdatedChats(socketData.messagesSinceLastConnection); - } + const message: IMessageIPFS = socketData.messagesSinceLastConnection + if (message ) { + setChatsSorted([...chats, message]); + }} }, [socketData.messagesSinceLastConnection]); useEffect(() => { + getChatCall(); - }, [connectedUser, env, account,signer, supportAddress ]); + }, [connectedUser, env, account,signer, supportAddress, userAlice]); useEffect(() => { scrollToBottom(); }, [connectedUser, env, account, socketData]); + return ( diff --git a/packages/uiweb/src/lib/helpers/chat/chat.ts b/packages/uiweb/src/lib/helpers/chat/chat.ts index c7b3b08c4..d6e319876 100644 --- a/packages/uiweb/src/lib/helpers/chat/chat.ts +++ b/packages/uiweb/src/lib/helpers/chat/chat.ts @@ -18,6 +18,9 @@ type HandleOnChatIconClickProps = { setIsModalOpen: (isModalOpen: boolean) => void; }; + + + type GetChatsType = { pgpPrivateKey?: string; supportAddress: string; @@ -39,9 +42,10 @@ export const createUserIfNecessary = async ( options: AccountEnvOptionsType ): Promise => { const { account, signer, env = Constants.ENV.PROD, userAlice } = options || {}; - const connectedUser = await userAlice.info(); - - + let connectedUser; + if(userAlice){ + connectedUser = await userAlice.info(); + } return { ...connectedUser, privateKey: connectedUser.encryptedPrivateKey }; }; @@ -247,7 +251,7 @@ export const checkIfSameChat = ( return true; } } - console.log(chatId); + return false; }; diff --git a/packages/uiweb/src/lib/hooks/useSDKSocket.ts b/packages/uiweb/src/lib/hooks/useSDKSocket.ts index 0659091c8..ec95a9f63 100644 --- a/packages/uiweb/src/lib/hooks/useSDKSocket.ts +++ b/packages/uiweb/src/lib/hooks/useSDKSocket.ts @@ -12,10 +12,12 @@ export type SDKSocketHookOptions = { env?: ENV, socketType?: 'chat' | 'notification', apiKey: string, - userAlice: PushAPI | null + userAlice: PushAPI , + supportAddress: string | null, + signer: string | null }; -export const useSDKSocket =({ account, env = ENV.PROD, socketType = 'chat',apiKey, userAlice }: SDKSocketHookOptions) => { +export const useSDKSocket =({ account, env = ENV.PROD, socketType = 'chat',apiKey, userAlice, supportAddress, signer }: SDKSocketHookOptions) => { // const [epnsSDKSocket, setEpnsSDKSocket] = useState(null); const [messagesSinceLastConnection, setMessagesSinceLastConnection] = useState(''); @@ -24,13 +26,13 @@ export const useSDKSocket =({ account, env = ENV.PROD, socketType = 'chat',apiKe const addSocketEvents = async () => { console.warn('\n--> addChatSocketEvents'); - stream.on(CONSTANTS.STREAM.CONNECT, (a) => { - console.log('CONNECTED: '); + stream.on(CONSTANTS.STREAM.CONNECT, (err:Error) => { + console.log('CONNECTED: ', err); setIsSDKSocketConnected(true); }); await stream.connect(); - stream.on(CONSTANTS.STREAM.DISCONNECT, (err:any) => { + stream.on(CONSTANTS.STREAM.DISCONNECT, (err:Error) => { console.log('DIS-CONNECTED: ',err); setIsSDKSocketConnected(false); }); @@ -39,24 +41,19 @@ export const useSDKSocket =({ account, env = ENV.PROD, socketType = 'chat',apiKe console.log('\t-->will attach eachMessage event now'); stream.on(CONSTANTS.STREAM.CHAT, (message: any) => { - console.log('Encrypted Message Received'); - /** - * We receive a 1 message. - */ - console.log("\n\n\n\neachMessage event: ", message); // do stuff with data setMessagesSinceLastConnection((chats: any) => { - return {...message,decrypted:false}; + return {...message}; }); // stream.disconnect(); }); }; - console.log(messagesSinceLastConnection) + const removeSocketEvents = () => { - stream.disconnect(); + stream?.disconnect(); }; useEffect(() => { @@ -80,27 +77,27 @@ export const useSDKSocket =({ account, env = ENV.PROD, socketType = 'chat',apiKe */ useEffect(() => { if (account) { - if (stream) { + if (!stream) { // console.log('=================>>> disconnection in the hook'); stream?.disconnect(); } const main = async () => { - const stream = await userAlice.initStream( + const newstream = await userAlice.initStream( [ CONSTANTS.STREAM.CHAT, ], {} ); - console.warn('new connection object: ', stream); - setStream(stream); + console.warn('new connection object: ', newstream); + setStream(newstream); // setEpnsSDKSocket(connectionObject); }; main().catch((err) => console.error(err)); } // eslint-disable-next-line react-hooks/exhaustive-deps - }, [account, env]); + }, [account, env, userAlice, supportAddress, signer, isSDKSocketConnected]); return { stream,