From 9b0a9247ae20a68ba7bbcc74220a745afbba40f2 Mon Sep 17 00:00:00 2001 From: Pritipriya Singh Date: Wed, 15 Nov 2023 03:01:56 +0530 Subject: [PATCH 1/8] fix: changes-suppport chat --- .../src/lib/components/supportChat/Chat.tsx | 8 ++- .../src/lib/components/supportChat/Modal.tsx | 35 +++++++++--- packages/uiweb/src/lib/helpers/chat/chat.ts | 55 ++++++------------- packages/uiweb/src/lib/hooks/useSDKSocket.ts | 4 +- packages/uiweb/src/lib/types/index.ts | 4 +- packages/uiweb/yarn.lock | 23 ++++++++ 6 files changed, 79 insertions(+), 50 deletions(-) diff --git a/packages/uiweb/src/lib/components/supportChat/Chat.tsx b/packages/uiweb/src/lib/components/supportChat/Chat.tsx index b2e2b2a04..aa1e00386 100644 --- a/packages/uiweb/src/lib/components/supportChat/Chat.tsx +++ b/packages/uiweb/src/lib/components/supportChat/Chat.tsx @@ -1,4 +1,5 @@ import React, { useEffect, useState } from 'react'; +import { PushAPI } from '@pushprotocol/restapi'; import { ChatIcon } from '../../icons/ChatIcon'; import { Modal } from './Modal'; import styled from 'styled-components'; @@ -47,6 +48,7 @@ export type ButtonStyleProps = { const [toastType, setToastType] = useState<'error' | 'success'>(); const [chats, setChats] = useState([]); const [accountadd, setAccount] = useState(account) + const [userAlice, setUserAlice] = useState(null); const setChatsSorted = (chats: IMessageIPFS[]) => { const uniqueChats = [ ...new Map(chats.map((item) => [item['timestamp'], item])).values(), @@ -58,14 +60,16 @@ export type ButtonStyleProps = { setChats(uniqueChats); }; const socketData = useSDKSocket({ - account: account, + account: accountadd, env, apiKey, + userAlice }); const chatPropsData = { account : accountadd, signer, + userAlice, supportAddress, greetingMsg, modalTitle, @@ -77,6 +81,8 @@ 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); diff --git a/packages/uiweb/src/lib/components/supportChat/Modal.tsx b/packages/uiweb/src/lib/components/supportChat/Modal.tsx index 6abed42d8..19ed9a3cd 100644 --- a/packages/uiweb/src/lib/components/supportChat/Modal.tsx +++ b/packages/uiweb/src/lib/components/supportChat/Modal.tsx @@ -29,7 +29,7 @@ export const Modal: React.FC = () => { string | null >(null); const [wasLastListPresent, setWasLastListPresent] = useState(false); - const { supportAddress, env, account, signer, greetingMsg, theme } = + const { supportAddress, userAlice, env, account, signer, greetingMsg, theme } = useContext(SupportChatPropsContext); const { chats, @@ -42,7 +42,7 @@ export const Modal: React.FC = () => { setToastType, socketData } = useContext(SupportChatMainStateContext); - const listInnerRef = useChatScroll(chats.length); + const listInnerRef = useChatScroll(0); const greetingMsgObject = { fromDID: walletToPCAIP10(supportAddress), @@ -63,12 +63,26 @@ export const Modal: React.FC = () => { if (listInnerRef.current) { const { scrollTop } = listInnerRef.current; if (scrollTop === 0) { - // This will be triggered after hitting the first element. - // pagination + const content = listInnerRef.current; + const curScrollPos = content.scrollTop; + const oldScroll = content.scrollHeight - content.clientHeight; + getChatCall(); + + const newScroll = content.scrollHeight - content.clientHeight; + content.scrollTop = curScrollPos + (newScroll - oldScroll); } } }; + const scrollToBottom = () => { + setTimeout(()=>{ + if (listInnerRef.current) { + listInnerRef.current.scrollTop = listInnerRef.current.scrollHeight +100; + + } + },0) + + }; const getChatCall = async () => { if (!connectedUser) return; @@ -76,6 +90,7 @@ export const Modal: React.FC = () => { setLoading(true); const { chatsResponse, lastThreadHash, lastListPresent } = await getChats({ account, + userAlice, pgpPrivateKey: connectedUser.privateKey, supportAddress, threadHash: lastThreadHashFetched!, @@ -94,7 +109,7 @@ export const Modal: React.FC = () => { if (!socketData.epnsSDKSocket?.connected) { socketData.epnsSDKSocket?.connect(); } - const user = await createUserIfNecessary({ account, signer, env }); + const user = await createUserIfNecessary({ account, signer, env, userAlice }); setConnectedUser(user); setLoading(false); } catch (err:any) { @@ -106,9 +121,9 @@ export const Modal: React.FC = () => { const getUpdatedChats = async (message:IMessageIPFS) =>{ if (message && (supportAddress === pCAIP10ToWallet(message?.fromCAIP10))) { - const chat = await decryptChat({ message, connectedUser, env }); + // const chat = await decryptChat({ message, connectedUser, env }); socketData.messagesSinceLastConnection.decrypted = true; - setChatsSorted([...chats, chat]); + setChatsSorted([...chats, message]); } } @@ -120,7 +135,11 @@ export const Modal: React.FC = () => { useEffect(() => { getChatCall(); - }, [connectedUser]); + }, [connectedUser, env, account,signer, supportAddress ]); + + 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 81c4ade7d..c7b3b08c4 100644 --- a/packages/uiweb/src/lib/helpers/chat/chat.ts +++ b/packages/uiweb/src/lib/helpers/chat/chat.ts @@ -1,4 +1,4 @@ -import * as PushAPI from '@pushprotocol/restapi'; +// import * as PushAPI from '@pushprotocol/restapi'; import type { ENV } from '../../config'; import { Constants } from '../../config'; import type { @@ -12,15 +12,16 @@ import type { Env, IConnectedUser, IFeeds, IUser } from '@pushprotocol/restapi'; import { isPCAIP, pCAIP10ToWallet, walletToPCAIP10 } from '../address'; import { getData } from './localStorage'; import { ethers } from 'ethers'; - +import { PushAPI } from '@pushprotocol/restapi'; type HandleOnChatIconClickProps = { isModalOpen: boolean; setIsModalOpen: (isModalOpen: boolean) => void; }; type GetChatsType = { - pgpPrivateKey: string; + pgpPrivateKey?: string; supportAddress: string; + userAlice: PushAPI; limit: number; threadHash?: string; env?: Env; @@ -37,22 +38,12 @@ export const handleOnChatIconClick = ({ export const createUserIfNecessary = async ( options: AccountEnvOptionsType ): Promise => { - const { account, signer, env = Constants.ENV.PROD } = options || {}; - let connectedUser = await PushAPI.user.get({ account: account, env }); - if (!connectedUser?.encryptedPrivateKey) { - connectedUser = await PushAPI.user.create({ - account: account, - signer: signer, - env, - }); - } - const decryptedPrivateKey = await PushAPI.chat.decryptPGPKey({ - encryptedPGPPrivateKey: connectedUser.encryptedPrivateKey, - account, - signer, - env, - }); - return { ...connectedUser, privateKey: decryptedPrivateKey }; + const { account, signer, env = Constants.ENV.PROD, userAlice } = options || {}; + const connectedUser = await userAlice.info(); + + + + return { ...connectedUser, privateKey: connectedUser.encryptedPrivateKey }; }; type GetChatsResponseType = { @@ -68,35 +59,21 @@ export const getChats = async ( account, pgpPrivateKey, supportAddress, + userAlice, threadHash = null, limit = 40, env = Constants.ENV.PROD, } = options || {}; - let threadhash: any = threadHash; - if (!threadhash) { - threadhash = await PushAPI.chat.conversationHash({ - account: account, - conversationId: supportAddress, - env, - }); - threadhash = threadhash.threadHash; - } + - if (threadhash) { - const chats = await PushAPI.chat.history({ - account: account, - pgpPrivateKey: pgpPrivateKey, - threadhash: threadhash, - toDecrypt: true, - limit: limit, - env, - }); + const chats = await userAlice?.chat.history( + supportAddress + ); const lastThreadHash = chats[chats.length - 1]?.link; const lastListPresent = chats.length > 0 ? true : false; return { chatsResponse: chats, lastThreadHash, lastListPresent }; - } - return { chatsResponse: [], lastThreadHash: null, lastListPresent: false }; + }; type DecrypteChatType = { diff --git a/packages/uiweb/src/lib/hooks/useSDKSocket.ts b/packages/uiweb/src/lib/hooks/useSDKSocket.ts index bfee3ed8c..2cef5d2c3 100644 --- a/packages/uiweb/src/lib/hooks/useSDKSocket.ts +++ b/packages/uiweb/src/lib/hooks/useSDKSocket.ts @@ -4,6 +4,7 @@ import { EVENTS } from '@pushprotocol/socket'; import { ENV } from '../config'; +import { PushAPI } from '@pushprotocol/restapi'; export type SDKSocketHookOptions = { @@ -11,9 +12,10 @@ export type SDKSocketHookOptions = { env?: ENV, socketType?: 'chat' | 'notification', apiKey: string, + userAlice: PushAPI }; -export const useSDKSocket = ({ account, env = ENV.PROD, socketType = 'chat',apiKey }: SDKSocketHookOptions) => { +export const useSDKSocket = ({ account, env = ENV.PROD, socketType = 'chat',apiKey, userAlice }: SDKSocketHookOptions) => { const [epnsSDKSocket, setEpnsSDKSocket] = useState(null); const [messagesSinceLastConnection, setMessagesSinceLastConnection] = useState(''); diff --git a/packages/uiweb/src/lib/types/index.ts b/packages/uiweb/src/lib/types/index.ts index 8337566b4..da1c10f56 100644 --- a/packages/uiweb/src/lib/types/index.ts +++ b/packages/uiweb/src/lib/types/index.ts @@ -1,9 +1,10 @@ import type { ReactElement } from 'react'; import type { ENV } from '../config'; -import type { ParsedResponseType, IFeeds, Rules, } from '@pushprotocol/restapi'; +import type { ParsedResponseType, IFeeds, Rules, PushAPI, } from '@pushprotocol/restapi'; import { Bytes, TypedDataDomain, TypedDataField, providers } from 'ethers'; export interface IMessageIPFS { + cid? : string; fromCAIP10: string; toCAIP10: string; fromDID: string; @@ -23,6 +24,7 @@ export interface AccountEnvOptionsType { env?: ENV; account: string; signer: SignerType; + userAlice: PushAPI; } export interface ITheme { diff --git a/packages/uiweb/yarn.lock b/packages/uiweb/yarn.lock index d714d5fff..4d3ac82a3 100644 --- a/packages/uiweb/yarn.lock +++ b/packages/uiweb/yarn.lock @@ -3618,6 +3618,11 @@ node-gyp-build@^4.2.0, node-gyp-build@^4.3.0: resolved "https://registry.yarnpkg.com/node-gyp-build/-/node-gyp-build-4.6.1.tgz#24b6d075e5e391b8d5539d98c7fc5c210cac8a3e" integrity sha512-24vnklJmyRS8ViBNI8KbtK/r/DmXQMRiOMXTNz2nrTnAYUwjmEEbnnpB/+kt+yWRv73bPsSPRFddrcIbAxSiMQ== +normalize-wheel@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/normalize-wheel/-/normalize-wheel-1.0.1.tgz#aec886affdb045070d856447df62ecf86146ec45" + integrity sha512-1OnlAPZ3zgrk8B91HyRj+eVv+kS5u+Z0SCsak6Xil/kmgEia50ga7zfkumayonZrImffAxPU/5WcyGhzetHNPA== + object-inspect@^1.9.0: version "1.12.3" resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.12.3.tgz#ba62dffd67ee256c8c086dfae69e016cd1f198b9" @@ -3816,11 +3821,24 @@ randombytes@^2.1.0: dependencies: safe-buffer "^5.1.0" +react-easy-crop@^4.1.4: + version "4.7.5" + resolved "https://registry.yarnpkg.com/react-easy-crop/-/react-easy-crop-4.7.5.tgz#1526827fc83e38b079372310f983bc0517ba6442" + integrity sha512-qKfI4PuhaH1jOLC3DQfQB0cE0z+3N7bfyPkPejQmylXNb8nstfPMH+oHj3gKgpBHLFUiQp/C1rY7sVCVgtjn3Q== + dependencies: + normalize-wheel "^1.0.1" + tslib "2.0.1" + react-icons@^4.10.1: version "4.10.1" resolved "https://registry.yarnpkg.com/react-icons/-/react-icons-4.10.1.tgz#3f3b5eec1f63c1796f6a26174a1091ca6437a500" integrity sha512-/ngzDP/77tlCfqthiiGNZeYFACw85fUjZtLbedmJ5DTlNDIwETxhwBzdOJ21zj4iJdvc0J3y7yOsX3PpxAJzrw== +react-image-file-resizer@^0.4.7: + version "0.4.8" + resolved "https://registry.yarnpkg.com/react-image-file-resizer/-/react-image-file-resizer-0.4.8.tgz#85f4ae4469fd2867d961568af660ef403d7a79af" + integrity sha512-Ue7CfKnSlsfJ//SKzxNMz8avDgDSpWQDOnTKOp/GNRFJv4dO9L5YGHNEnj40peWkXXAK2OK0eRIoXhOYpUzUTQ== + react-property@2.0.0: version "2.0.0" resolved "https://registry.npmjs.org/react-property/-/react-property-2.0.0.tgz" @@ -4214,6 +4232,11 @@ tslib@1.14.1, tslib@^1.9.0: resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00" integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg== +tslib@2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.0.1.tgz#410eb0d113e5b6356490eec749603725b021b43e" + integrity sha512-SgIkNheinmEBgx1IUNirK0TUD4X9yjjBRTqqjggWCU3pUEqIk3/Uwl3yRixYKT6WjQuGiwDv4NomL3wqRCj+CQ== + tslib@^2.0.0, tslib@^2.1.0, tslib@^2.3.0: version "2.5.0" resolved "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz" From e2a9a06a469889800fa96b48068a4ac6d9dbb983 Mon Sep 17 00:00:00 2001 From: Pritipriya Singh Date: Wed, 15 Nov 2023 16:08:32 +0530 Subject: [PATCH 2/8] fix: new stream added --- .../examples/sdk-frontend-react/src/app/ChatSupportTest.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx b/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx index a589565a6..e845b3faf 100644 --- a/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx +++ b/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx @@ -35,7 +35,7 @@ export const ChatSupportTest = () => { Date: Wed, 15 Nov 2023 16:21:49 +0530 Subject: [PATCH 3/8] fix: removed unn consolelogs --- .../components/supportChat/AddressInfo.tsx | 5 +- .../src/lib/components/supportChat/Chat.tsx | 1 + .../lib/components/supportChat/ChatInput.tsx | 18 +++-- .../src/lib/components/supportChat/Chats.tsx | 42 ++++++++--- .../src/lib/components/supportChat/Modal.tsx | 11 +-- packages/uiweb/src/lib/hooks/useSDKSocket.ts | 71 ++++++++++--------- packages/uiweb/src/lib/types/index.ts | 13 ++++ 7 files changed, 101 insertions(+), 60 deletions(-) diff --git a/packages/uiweb/src/lib/components/supportChat/AddressInfo.tsx b/packages/uiweb/src/lib/components/supportChat/AddressInfo.tsx index c9e6c79a4..48db2ea0e 100644 --- a/packages/uiweb/src/lib/components/supportChat/AddressInfo.tsx +++ b/packages/uiweb/src/lib/components/supportChat/AddressInfo.tsx @@ -1,13 +1,12 @@ import React, { useContext, useEffect, useState } from 'react'; import styled from 'styled-components'; import { SupportChatPropsContext } from '../../context'; -import * as PushAPI from '@pushprotocol/restapi'; import { Constants } from '../../config'; import { copyToClipboard, pCAIP10ToWallet } from '../../helpers'; import { CopySvg } from '../../icons/CopySvg'; export const AddressInfo: React.FC = () => { - const { supportAddress, env, theme } = useContext(SupportChatPropsContext); + const { supportAddress, env, theme, userAlice } = useContext(SupportChatPropsContext); const [ensName, setEnsName] = useState(''); const [user, setUser] = useState({}); const [isCopied, setIsCopied] = useState(false); @@ -15,7 +14,7 @@ export const AddressInfo: React.FC = () => { useEffect(() => { const getUser = async () => { - const user = await PushAPI.user.get({ account: walletAddress, env }); + const user = await userAlice.info(); setUser(user); }; getUser(); diff --git a/packages/uiweb/src/lib/components/supportChat/Chat.tsx b/packages/uiweb/src/lib/components/supportChat/Chat.tsx index aa1e00386..01107593f 100644 --- a/packages/uiweb/src/lib/components/supportChat/Chat.tsx +++ b/packages/uiweb/src/lib/components/supportChat/Chat.tsx @@ -66,6 +66,7 @@ export type ButtonStyleProps = { userAlice }); + console.log("chanecing", socketData) const chatPropsData = { account : accountadd, signer, diff --git a/packages/uiweb/src/lib/components/supportChat/ChatInput.tsx b/packages/uiweb/src/lib/components/supportChat/ChatInput.tsx index 35fd9fac1..049cbaf7e 100644 --- a/packages/uiweb/src/lib/components/supportChat/ChatInput.tsx +++ b/packages/uiweb/src/lib/components/supportChat/ChatInput.tsx @@ -4,7 +4,6 @@ import { SendIconSvg } from '../../icons/SendIconSvg'; import SmileyIcon from '../../icons/smiley.svg'; import AttachmentIcon from '../../icons/attachment.svg'; import styled from 'styled-components'; -import * as PushAPI from '@pushprotocol/restapi'; import { SupportChatMainStateContext, SupportChatPropsContext } from '../../context'; import { Spinner } from './spinner/Spinner'; // import Picker from 'emoji-picker-react'; @@ -14,7 +13,7 @@ export const ChatInput: React.FC = () => { const fileInputRef = useRef(null); const [filesUploading, setFileUploading] = useState(false); const [loading, setLoading] = useState(false); - const { account, env, supportAddress, apiKey, theme } = + const { account, env, supportAddress, apiKey, theme, userAlice } = useContext(SupportChatPropsContext); const { @@ -40,15 +39,14 @@ export const ChatInput: React.FC = () => { e.preventDefault(); setLoading(true); if (message.trim() !== '' && connectedUser) { - const sendResponse = await PushAPI.chat.send({ - messageContent: message, - messageType: 'Text', - receiverAddress: supportAddress, - account: account, - pgpPrivateKey: connectedUser?.privateKey, - apiKey, - env, + + const sendResponse = await userAlice.chat.send(supportAddress ,{ + + type: 'Text', + content: message, + }); + console.log(sendResponse); if (typeof sendResponse !== 'string') { sendResponse.messageContent = message; diff --git a/packages/uiweb/src/lib/components/supportChat/Chats.tsx b/packages/uiweb/src/lib/components/supportChat/Chats.tsx index a6f7604d4..1b2cb441e 100644 --- a/packages/uiweb/src/lib/components/supportChat/Chats.tsx +++ b/packages/uiweb/src/lib/components/supportChat/Chats.tsx @@ -1,3 +1,4 @@ + import React, { useContext, useState } from 'react'; import styled from 'styled-components'; import { SupportChatMainStateContext, SupportChatPropsContext } from '../../context'; @@ -30,29 +31,48 @@ export const Chats: React.FC = ({ const { connectedUser } = useContext(SupportChatMainStateContext); const [showImageModal, setShowImageModal] = useState(false); const [imageUrl, setImageUrl] = useState(''); - const time: Date = new Date(msg.timestamp!); + +let date; +let timestamp; + +if (typeof msg.timestamp === "string") { + timestamp = parseInt(msg.timestamp); +}else{ + timestamp = msg.timestamp +} + const time = new Date(timestamp!); + + if (!isNaN(time.getTime())){ + const time1 = time.toLocaleTimeString('en-US'); - const date = time1.slice(0, -6) + time1.slice(-2); + + date = time1.slice(0, -6) + time1.slice(-2); + } + + return ( <> - {msg.messageType === 'Text' ? ( + {msg.messageType === 'Text' || msg.message?.type ? ( <> - {msg.fromCAIP10 === caip10 ? ( + {(msg.fromCAIP10 === caip10 || msg.from === caip10 ) ? ( - {msg.messageContent} + {console.log("woiiii" , msg.messageContent)} + {msg.messageContent || msg.message?.content} {msg.timestamp !== undefined && {date}} ) : ( - - {msg?.icon && msg.icon} - {msg.messageContent} - {msg.timestamp !== undefined && {date}} - - + + {msg?.icon && msg.icon} + {console.log("insideee",msg.message?.content)} + { msg.message?.content || msg.messageContent} + {msg.timestamp !== undefined && {date}} + + + )} ) : // : msg.messageType === 'Image' ? ( diff --git a/packages/uiweb/src/lib/components/supportChat/Modal.tsx b/packages/uiweb/src/lib/components/supportChat/Modal.tsx index 19ed9a3cd..4bfccad36 100644 --- a/packages/uiweb/src/lib/components/supportChat/Modal.tsx +++ b/packages/uiweb/src/lib/components/supportChat/Modal.tsx @@ -120,15 +120,18 @@ export const Modal: React.FC = () => { }; const getUpdatedChats = async (message:IMessageIPFS) =>{ - if (message && (supportAddress === pCAIP10ToWallet(message?.fromCAIP10))) { + + if (message && (supportAddress === pCAIP10ToWallet(message?.from))) { // const chat = await decryptChat({ message, connectedUser, env }); - socketData.messagesSinceLastConnection.decrypted = true; + // socketData.messagesSinceLastConnection.decrypted = true; + setChatsSorted([...chats, message]); } } - + useEffect(() => { - if(socketData.messagesSinceLastConnection && !socketData.messagesSinceLastConnection.decrypted){ + + if(socketData.messagesSinceLastConnection){ getUpdatedChats(socketData.messagesSinceLastConnection); } }, [socketData.messagesSinceLastConnection]); diff --git a/packages/uiweb/src/lib/hooks/useSDKSocket.ts b/packages/uiweb/src/lib/hooks/useSDKSocket.ts index 2cef5d2c3..0659091c8 100644 --- a/packages/uiweb/src/lib/hooks/useSDKSocket.ts +++ b/packages/uiweb/src/lib/hooks/useSDKSocket.ts @@ -4,7 +4,7 @@ import { EVENTS } from '@pushprotocol/socket'; import { ENV } from '../config'; -import { PushAPI } from '@pushprotocol/restapi'; +import { CONSTANTS, PushAPI } from '@pushprotocol/restapi'; export type SDKSocketHookOptions = { @@ -12,58 +12,65 @@ export type SDKSocketHookOptions = { env?: ENV, socketType?: 'chat' | 'notification', apiKey: string, - userAlice: PushAPI + userAlice: PushAPI | null }; -export const useSDKSocket = ({ account, env = ENV.PROD, socketType = 'chat',apiKey, userAlice }: SDKSocketHookOptions) => { +export const useSDKSocket =({ account, env = ENV.PROD, socketType = 'chat',apiKey, userAlice }: SDKSocketHookOptions) => { - const [epnsSDKSocket, setEpnsSDKSocket] = useState(null); + // const [epnsSDKSocket, setEpnsSDKSocket] = useState(null); const [messagesSinceLastConnection, setMessagesSinceLastConnection] = useState(''); - const [isSDKSocketConnected, setIsSDKSocketConnected] = useState(epnsSDKSocket?.connected); - - const addSocketEvents = () => { - console.warn('\n--> addSocketEvents'); - epnsSDKSocket?.on(EVENTS.CONNECT, () => { + const [isSDKSocketConnected, setIsSDKSocketConnected] = useState(false); + const [stream, setStream] = useState(null); + + const addSocketEvents = async () => { + console.warn('\n--> addChatSocketEvents'); + stream.on(CONSTANTS.STREAM.CONNECT, (a) => { console.log('CONNECTED: '); setIsSDKSocketConnected(true); }); + await stream.connect(); - epnsSDKSocket?.on(EVENTS.DISCONNECT, (err:any) => { + stream.on(CONSTANTS.STREAM.DISCONNECT, (err:any) => { console.log('DIS-CONNECTED: ',err); setIsSDKSocketConnected(false); }); + + + console.log('\t-->will attach eachMessage event now'); - epnsSDKSocket?.on(EVENTS.CHAT_RECEIVED_MESSAGE, (chat: any) => { + stream.on(CONSTANTS.STREAM.CHAT, (message: any) => { + console.log('Encrypted Message Received'); /** * We receive a 1 message. */ - console.log("\n\n\n\neachMessage event: ", chat); + console.log("\n\n\n\neachMessage event: ", message); // do stuff with data setMessagesSinceLastConnection((chats: any) => { - return {...chat,decrypted:false}; + return {...message,decrypted:false}; }); + // stream.disconnect(); }); }; + console.log(messagesSinceLastConnection) + const removeSocketEvents = () => { - console.warn('\n--> removeSocketEvents'); - epnsSDKSocket?.off(EVENTS.CONNECT); - epnsSDKSocket?.off(EVENTS.DISCONNECT); + stream.disconnect(); }; useEffect(() => { - if (epnsSDKSocket) { + if (stream) { addSocketEvents(); } return () => { - if (epnsSDKSocket) { + if (stream) { removeSocketEvents(); } } // eslint-disable-next-line react-hooks/exhaustive-deps - }, [epnsSDKSocket]); + }, [stream]); /** @@ -73,21 +80,21 @@ export const useSDKSocket = ({ account, env = ENV.PROD, socketType = 'chat',apiK */ useEffect(() => { if (account) { - if (epnsSDKSocket) { + if (stream) { // console.log('=================>>> disconnection in the hook'); - epnsSDKSocket?.disconnect(); + stream?.disconnect(); } const main = async () => { - const connectionObject = createSocketConnection({ - user: account, - env, - apiKey, - socketType, - socketOptions: { autoConnect: true , reconnectionAttempts: 3} - }); - console.warn('new connection object: ', connectionObject); - - setEpnsSDKSocket(connectionObject); + const stream = await userAlice.initStream( + [ + CONSTANTS.STREAM.CHAT, + ], + {} + ); + + console.warn('new connection object: ', stream); + setStream(stream); + // setEpnsSDKSocket(connectionObject); }; main().catch((err) => console.error(err)); } @@ -96,7 +103,7 @@ export const useSDKSocket = ({ account, env = ENV.PROD, socketType = 'chat',apiK }, [account, env]); return { - epnsSDKSocket, + stream, isSDKSocketConnected, messagesSinceLastConnection } diff --git a/packages/uiweb/src/lib/types/index.ts b/packages/uiweb/src/lib/types/index.ts index da1c10f56..87e44121d 100644 --- a/packages/uiweb/src/lib/types/index.ts +++ b/packages/uiweb/src/lib/types/index.ts @@ -5,6 +5,14 @@ import { Bytes, TypedDataDomain, TypedDataField, providers } from 'ethers'; export interface IMessageIPFS { cid? : string; + chatId? :string; + event? :string; + from?:string; + message?: IMessage; + meta?: any; + origin?:string; + reference? :string; + to?: string[]; fromCAIP10: string; toCAIP10: string; fromDID: string; @@ -20,6 +28,11 @@ export interface IMessageIPFS { icon?: ReactElement; } +interface IMessage { + content: string | undefined; + type: string | undefined; +} + export interface AccountEnvOptionsType { env?: ENV; account: string; From fcd8614331324d60803e5d9b8f29e68a768dbd96 Mon Sep 17 00:00:00 2001 From: Pritipriya Singh Date: Wed, 15 Nov 2023 20:14:58 +0530 Subject: [PATCH 4/8] fix: requested changed --- .../components/supportChat/AddressInfo.tsx | 7 ++-- .../src/lib/components/supportChat/Chat.tsx | 29 +++++++++++----- .../lib/components/supportChat/ChatInput.tsx | 13 ++++++-- .../src/lib/components/supportChat/Chats.tsx | 4 +-- .../src/lib/components/supportChat/Modal.tsx | 26 +++++++++------ packages/uiweb/src/lib/helpers/chat/chat.ts | 12 ++++--- packages/uiweb/src/lib/hooks/useSDKSocket.ts | 33 +++++++++---------- 7 files changed, 77 insertions(+), 47 deletions(-) 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, From e33870fce0f290ea637077f2200b52779860cae6 Mon Sep 17 00:00:00 2001 From: Monalisha Mishra Date: Wed, 15 Nov 2023 17:57:58 +0300 Subject: [PATCH 5/8] fix: fixed minor issues --- .../examples/sdk-frontend-react/src/app/ChatSupportTest.tsx | 2 +- packages/uiweb/src/lib/components/supportChat/Chat.tsx | 2 +- packages/uiweb/src/lib/hooks/useSDKSocket.ts | 4 ++-- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx b/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx index e845b3faf..636b42fe6 100644 --- a/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx +++ b/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx @@ -35,7 +35,7 @@ export const ChatSupportTest = () => { { From 697ab6a80898286a7a8e74e72e21033fe78b3966 Mon Sep 17 00:00:00 2001 From: Pritipriya Singh Date: Wed, 15 Nov 2023 21:53:41 +0530 Subject: [PATCH 6/8] fix: socket connection --- .../src/app/ChatSupportTest.tsx | 2 +- .../src/lib/components/supportChat/Chat.tsx | 21 ++++++++++++++----- 2 files changed, 17 insertions(+), 6 deletions(-) diff --git a/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx b/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx index 636b42fe6..3c5b30933 100644 --- a/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx +++ b/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx @@ -35,7 +35,7 @@ export const ChatSupportTest = () => { { (async () => { if(signer) { if (!account) { const address = await getAddressFromSigner(signer); setAccountadd(address); - const userAlice = await PushAPI.initialize(signer, {env: env , account:address}); - setUserAlice(userAlice) + } else{ setAccountadd(account); - const userAlice = await PushAPI.initialize(signer, {env: env , account:account}); - setUserAlice(userAlice) + } } })(); },[signer]) - + useEffect(() => { + ( + async() =>{ + if(Object.keys(signer || {}).length && accountadd){ + const userAlice = await PushAPI.initialize(signer!, {env: env , account:accountadd!}); + setUserAlice(userAlice) + } + } + )() + + },[signer, accountadd]) useEffect(() => { setChats([]); From f6a36076cfd874a249f084663d94950bdafc8617 Mon Sep 17 00:00:00 2001 From: Pritipriya Singh Date: Wed, 15 Nov 2023 23:33:55 +0530 Subject: [PATCH 7/8] fix: timestamp helper created, removed extra code --- .../src/app/ChatSupportTest.tsx | 2 +- .../lib/components/supportChat/ChatInput.tsx | 2 +- .../src/lib/components/supportChat/Chats.tsx | 16 ++-------------- .../src/lib/components/supportChat/Modal.tsx | 11 ----------- packages/uiweb/src/lib/helpers/chat/chat.ts | 2 +- packages/uiweb/src/lib/helpers/timestamp.ts | 19 +++++++++++++++++++ 6 files changed, 24 insertions(+), 28 deletions(-) create mode 100644 packages/uiweb/src/lib/helpers/timestamp.ts diff --git a/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx b/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx index 3c5b30933..e845b3faf 100644 --- a/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx +++ b/packages/examples/sdk-frontend-react/src/app/ChatSupportTest.tsx @@ -35,7 +35,7 @@ export const ChatSupportTest = () => { { content: message, }); - console.log(sendResponse); + if (!sendResponse) { setToastMessage(sendResponse); setToastType('error'); diff --git a/packages/uiweb/src/lib/components/supportChat/Chats.tsx b/packages/uiweb/src/lib/components/supportChat/Chats.tsx index 4dbc815e3..dc64d02fa 100644 --- a/packages/uiweb/src/lib/components/supportChat/Chats.tsx +++ b/packages/uiweb/src/lib/components/supportChat/Chats.tsx @@ -3,6 +3,7 @@ import React, { useContext, useState } from 'react'; import styled from 'styled-components'; import { SupportChatMainStateContext, SupportChatPropsContext } from '../../context'; import type { IMessageIPFS } from '../../types'; +import { formatTime } from '../../helpers/timestamp'; type ChatsPropType = { msg: IMessageIPFS; @@ -32,22 +33,9 @@ export const Chats: React.FC = ({ const [showImageModal, setShowImageModal] = useState(false); const [imageUrl, setImageUrl] = useState(''); -let date; -let timestamp; -if (typeof msg.timestamp === "string") { - timestamp = parseInt(msg.timestamp); -}else{ - timestamp = msg.timestamp -} - const time = new Date(timestamp!); +const date = formatTime(msg.timestamp) - if (!isNaN(time.getTime())){ - - const time1 = time.toLocaleTimeString('en-US'); - - date = time1.slice(0, -6) + time1.slice(-2); - } return ( diff --git a/packages/uiweb/src/lib/components/supportChat/Modal.tsx b/packages/uiweb/src/lib/components/supportChat/Modal.tsx index 82d889788..d898aadc1 100644 --- a/packages/uiweb/src/lib/components/supportChat/Modal.tsx +++ b/packages/uiweb/src/lib/components/supportChat/Modal.tsx @@ -119,17 +119,6 @@ export const Modal: React.FC = () => { } }; - // 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]); - // } - // } - - useEffect(() => { diff --git a/packages/uiweb/src/lib/helpers/chat/chat.ts b/packages/uiweb/src/lib/helpers/chat/chat.ts index d6e319876..63610f47d 100644 --- a/packages/uiweb/src/lib/helpers/chat/chat.ts +++ b/packages/uiweb/src/lib/helpers/chat/chat.ts @@ -47,7 +47,7 @@ export const createUserIfNecessary = async ( connectedUser = await userAlice.info(); } - return { ...connectedUser, privateKey: connectedUser.encryptedPrivateKey }; + return { ...connectedUser, privateKey: connectedUser!.encryptedPrivateKey }; }; type GetChatsResponseType = { diff --git a/packages/uiweb/src/lib/helpers/timestamp.ts b/packages/uiweb/src/lib/helpers/timestamp.ts new file mode 100644 index 000000000..361996ec2 --- /dev/null +++ b/packages/uiweb/src/lib/helpers/timestamp.ts @@ -0,0 +1,19 @@ +export const formatTime = (timestamp : any) => { + let date; +let timestamp1; + if (typeof timestamp === "string") { + timestamp1 = parseInt(timestamp ); + }else{ + timestamp1 = timestamp + } + const time = new Date(timestamp1!); + + if (!isNaN(time.getTime())){ + + const time1 = time.toLocaleTimeString('en-US'); + + date = time1.slice(0, -6) + time1.slice(-2); + } + + return date; +} \ No newline at end of file From fdb5eb6a6ea0c15ee46f71385ecff2542b5c69c9 Mon Sep 17 00:00:00 2001 From: Pritipriya Singh Date: Thu, 16 Nov 2023 16:04:00 +0530 Subject: [PATCH 8/8] fix: changed userAlice to pushUser --- .../src/lib/components/supportChat/AddressInfo.tsx | 8 ++++---- .../uiweb/src/lib/components/supportChat/Chat.tsx | 10 +++++----- .../src/lib/components/supportChat/ChatInput.tsx | 4 ++-- .../uiweb/src/lib/components/supportChat/Modal.tsx | 8 ++++---- packages/uiweb/src/lib/helpers/chat/chat.ts | 12 ++++++------ packages/uiweb/src/lib/hooks/useSDKSocket.ts | 8 ++++---- packages/uiweb/src/lib/types/index.ts | 2 +- 7 files changed, 26 insertions(+), 26 deletions(-) diff --git a/packages/uiweb/src/lib/components/supportChat/AddressInfo.tsx b/packages/uiweb/src/lib/components/supportChat/AddressInfo.tsx index 300586c4f..353719d24 100644 --- a/packages/uiweb/src/lib/components/supportChat/AddressInfo.tsx +++ b/packages/uiweb/src/lib/components/supportChat/AddressInfo.tsx @@ -6,7 +6,7 @@ import { copyToClipboard, pCAIP10ToWallet } from '../../helpers'; import { CopySvg } from '../../icons/CopySvg'; export const AddressInfo: React.FC = () => { - const { supportAddress, env, theme, userAlice } = useContext(SupportChatPropsContext); + const { supportAddress, env, theme, pushUser } = useContext(SupportChatPropsContext); const [ensName, setEnsName] = useState(''); const [user, setUser] = useState({}); const [isCopied, setIsCopied] = useState(false); @@ -14,14 +14,14 @@ export const AddressInfo: React.FC = () => { useEffect(() => { const getUser = async () => { -if(userAlice){ - const user = await userAlice.info(); +if(pushUser){ + const user = await pushUser.info(); setUser(user); } }; getUser(); - }, [supportAddress, userAlice]); + }, [supportAddress, pushUser]); return ( diff --git a/packages/uiweb/src/lib/components/supportChat/Chat.tsx b/packages/uiweb/src/lib/components/supportChat/Chat.tsx index f8f012efc..c1caa964c 100644 --- a/packages/uiweb/src/lib/components/supportChat/Chat.tsx +++ b/packages/uiweb/src/lib/components/supportChat/Chat.tsx @@ -49,7 +49,7 @@ export type ButtonStyleProps = { const [toastType, setToastType] = useState<'error' | 'success'>(); const [chats, setChats] = useState([]); const [accountadd, setAccountadd] = useState(account) - const [userAlice, setUserAlice] = useState(null); + const [pushUser, setPushUser] = useState(null); const setChatsSorted = (chats: IMessageIPFS[]) => { const chatsWithNumericTimestamps = chats.map(item => ({ @@ -71,7 +71,7 @@ export type ButtonStyleProps = { account: accountadd, env, apiKey, - userAlice: userAlice!, + pushUser: pushUser!, supportAddress, signer }); @@ -80,7 +80,7 @@ export type ButtonStyleProps = { const chatPropsData = { account : accountadd, signer, - userAlice, + pushUser, supportAddress, greetingMsg, modalTitle, @@ -112,8 +112,8 @@ export type ButtonStyleProps = { ( async() =>{ if(Object.keys(signer || {}).length && accountadd){ - const userAlice = await PushAPI.initialize(signer!, {env: env , account:accountadd!}); - setUserAlice(userAlice) + const pushUser = await PushAPI.initialize(signer!, {env: env , account:accountadd!}); + setPushUser(pushUser) } } )() diff --git a/packages/uiweb/src/lib/components/supportChat/ChatInput.tsx b/packages/uiweb/src/lib/components/supportChat/ChatInput.tsx index df5c9fd2a..451a47ed4 100644 --- a/packages/uiweb/src/lib/components/supportChat/ChatInput.tsx +++ b/packages/uiweb/src/lib/components/supportChat/ChatInput.tsx @@ -13,7 +13,7 @@ export const ChatInput: React.FC = () => { const fileInputRef = useRef(null); const [filesUploading, setFileUploading] = useState(false); const [loading, setLoading] = useState(false); - const { account, env, supportAddress, apiKey, theme, userAlice } = + const { account, env, supportAddress, apiKey, theme, pushUser } = useContext(SupportChatPropsContext); const { @@ -40,7 +40,7 @@ export const ChatInput: React.FC = () => { setLoading(true); if (message.trim() !== '' && connectedUser) { - const sendResponse = await userAlice.chat.send(supportAddress ,{ + const sendResponse = await pushUser.chat.send(supportAddress ,{ type: 'Text', content: message, diff --git a/packages/uiweb/src/lib/components/supportChat/Modal.tsx b/packages/uiweb/src/lib/components/supportChat/Modal.tsx index d898aadc1..dbca82c0d 100644 --- a/packages/uiweb/src/lib/components/supportChat/Modal.tsx +++ b/packages/uiweb/src/lib/components/supportChat/Modal.tsx @@ -29,7 +29,7 @@ export const Modal: React.FC = () => { string | null >(null); const [wasLastListPresent, setWasLastListPresent] = useState(false); - const { supportAddress, userAlice, env, account, signer, greetingMsg, theme } = + const { supportAddress, pushUser, env, account, signer, greetingMsg, theme } = useContext(SupportChatPropsContext); const { chats, @@ -90,7 +90,7 @@ export const Modal: React.FC = () => { setLoading(true); const { chatsResponse, lastThreadHash, lastListPresent } = await getChats({ account, - userAlice, + pushUser, // pgpPrivateKey: connectedUser.privateKey, supportAddress, threadHash: lastThreadHashFetched!, @@ -109,7 +109,7 @@ export const Modal: React.FC = () => { if (!socketData.epnsSDKSocket?.connected) { socketData.epnsSDKSocket?.connect(); } - const user = await createUserIfNecessary({ account, signer, env, userAlice }); + const user = await createUserIfNecessary({ account, signer, env, pushUser }); setConnectedUser(user); setLoading(false); } catch (err:any) { @@ -132,7 +132,7 @@ export const Modal: React.FC = () => { useEffect(() => { getChatCall(); - }, [connectedUser, env, account,signer, supportAddress, userAlice]); + }, [connectedUser, env, account,signer, supportAddress, pushUser]); useEffect(() => { scrollToBottom(); diff --git a/packages/uiweb/src/lib/helpers/chat/chat.ts b/packages/uiweb/src/lib/helpers/chat/chat.ts index 63610f47d..aaf99d5d4 100644 --- a/packages/uiweb/src/lib/helpers/chat/chat.ts +++ b/packages/uiweb/src/lib/helpers/chat/chat.ts @@ -24,7 +24,7 @@ type HandleOnChatIconClickProps = { type GetChatsType = { pgpPrivateKey?: string; supportAddress: string; - userAlice: PushAPI; + pushUser: PushAPI; limit: number; threadHash?: string; env?: Env; @@ -41,10 +41,10 @@ export const handleOnChatIconClick = ({ export const createUserIfNecessary = async ( options: AccountEnvOptionsType ): Promise => { - const { account, signer, env = Constants.ENV.PROD, userAlice } = options || {}; + const { account, signer, env = Constants.ENV.PROD, pushUser } = options || {}; let connectedUser; - if(userAlice){ - connectedUser = await userAlice.info(); + if(pushUser){ + connectedUser = await pushUser.info(); } return { ...connectedUser, privateKey: connectedUser!.encryptedPrivateKey }; @@ -63,14 +63,14 @@ export const getChats = async ( account, pgpPrivateKey, supportAddress, - userAlice, + pushUser, threadHash = null, limit = 40, env = Constants.ENV.PROD, } = options || {}; - const chats = await userAlice?.chat.history( + const chats = await pushUser?.chat.history( supportAddress ); diff --git a/packages/uiweb/src/lib/hooks/useSDKSocket.ts b/packages/uiweb/src/lib/hooks/useSDKSocket.ts index 37e843b24..6545a7844 100644 --- a/packages/uiweb/src/lib/hooks/useSDKSocket.ts +++ b/packages/uiweb/src/lib/hooks/useSDKSocket.ts @@ -12,12 +12,12 @@ export type SDKSocketHookOptions = { env?: ENV, socketType?: 'chat' | 'notification', apiKey: string, - userAlice: PushAPI , + pushUser: PushAPI , supportAddress: string | null, signer: SignerType | null }; -export const useSDKSocket =({ account, env = ENV.PROD, socketType = 'chat',apiKey, userAlice, supportAddress, signer }: SDKSocketHookOptions) => { +export const useSDKSocket =({ account, env = ENV.PROD, socketType = 'chat',apiKey, pushUser, supportAddress, signer }: SDKSocketHookOptions) => { // const [epnsSDKSocket, setEpnsSDKSocket] = useState(null); const [messagesSinceLastConnection, setMessagesSinceLastConnection] = useState(''); @@ -82,7 +82,7 @@ export const useSDKSocket =({ account, env = ENV.PROD, socketType = 'chat',apiKe stream?.disconnect(); } const main = async () => { - const newstream = await userAlice.initStream( + const newstream = await pushUser.initStream( [ CONSTANTS.STREAM.CHAT, ], @@ -97,7 +97,7 @@ export const useSDKSocket =({ account, env = ENV.PROD, socketType = 'chat',apiKe } // eslint-disable-next-line react-hooks/exhaustive-deps - }, [account, env, userAlice, supportAddress, signer, isSDKSocketConnected]); + }, [account, env, pushUser, supportAddress, signer, isSDKSocketConnected]); return { stream, diff --git a/packages/uiweb/src/lib/types/index.ts b/packages/uiweb/src/lib/types/index.ts index 87e44121d..f345c9f2b 100644 --- a/packages/uiweb/src/lib/types/index.ts +++ b/packages/uiweb/src/lib/types/index.ts @@ -37,7 +37,7 @@ export interface AccountEnvOptionsType { env?: ENV; account: string; signer: SignerType; - userAlice: PushAPI; + pushUser: PushAPI; } export interface ITheme {