Added Reaction support, (#1303)

* Fixed responsiveness in mobile for UIWeb:Chat * fixes text alignment on frames preview link to come on right * scroll bar fixes * fixed reaction picker position, tweaked group type text, removed add button from define conditions in gated group * removed unnecessary console.debug * removed unnecessary console.debug * Resolved comments, fixed curved edges go away, fixed correct time placement in ChatBubble * Resolved comments
push-protocol · May 23, 2024 · c52e517 · c52e517
1 parent 1cfec21
commit c52e517
Show file tree

Hide file tree

Showing 34 changed files with 1,219 additions and 477 deletions.
diff --git a/packages/examples/boilerplate/index.js b/packages/examples/boilerplate/index.js
@@ -8,7 +8,7 @@ const signerAlice = ethers.Wallet.createRandom();
 const userAlice = await PushAPI.initialize(signerAlice, {
   env: CONSTANTS.ENV.PROD,
 });
-const userBobAddress = '0x60cD05eb31cc16cC37163D514bEF162406d482e1';
+const userBobAddress = '0x0149C2723496fEF62e6e7fa79A31E5ea22bA70C7';
 
 const generateRandomWordsWithTimestamp = () => {
   return `${Math.random()
@@ -17,7 +17,13 @@ const generateRandomWordsWithTimestamp = () => {
 };
 
 userAlice.chat.send(userBobAddress, {
-  content: "Gm gm! It's a me... Alice! - " + generateRandomWordsWithTimestamp(),
+  type: 'Reaction',
+  content: '👍',
+  reference: 'bafyreia2okco5ocdxmoxon72erviypaht74u3dqunf3vydu237ybju4kw4',
 });
 
 console.log('Message sent from Alice to ', userBobAddress);
+// const groupPermissions = await userAlice.chat.group.info(
+//   'a7d0581affdaea7b80be836ea5f8a982c0dfd56fb30ee2b01c64980afb152af7'
+// );
+// console.log('info', groupPermissions);
diff --git a/packages/uiweb/.babelrc b/packages/uiweb/.babelrc
@@ -15,7 +15,8 @@
       {
         "root": ["./src"],
         "alias": {
-          "components": "./src/lib/components"
+          "@components": "./src/lib/components",
+          "@icons": "./src/lib/icons"
           // Add more aliases as needed
         }
       }

diff --git a/packages/uiweb/package.json b/packages/uiweb/package.json
@@ -37,7 +37,7 @@
     "uuid": "^9.0.1"
   },
   "peerDependencies": {
-    "@pushprotocol/restapi": "1.7.17",
+    "@pushprotocol/restapi": "1.7.19",
     "@pushprotocol/socket": "^0.5.0",
     "react": ">=16.8.0",
     "styled-components": "^6.0.8"

diff --git a/packages/uiweb/src/lib/components/chat/ChatPreviewList/ChatPreviewList.tsx b/packages/uiweb/src/lib/components/chat/ChatPreviewList/ChatPreviewList.tsx
@@ -174,7 +174,9 @@ export const ChatPreviewList: React.FC<IChatPreviewListProps> = (options: IChatP
         overrideAccount,
       });
 
-      console.debug('UIWeb::ChatPreviewList::loadMoreChats:: Fetched', type, nextpage, currentNonce, chatList);
+      console.debug(
+        `UIWeb::ChatPreviewList::loadMoreChats:: Fetched type - ${type} - nextpage - ${nextpage} - currentNonce - ${currentNonce} - chatList - ${chatList}`
+      );
 
       if (chatList) {
         // get and transform chats
@@ -489,12 +491,25 @@ export const ChatPreviewList: React.FC<IChatPreviewListProps> = (options: IChatP
 
   useEffect(() => {
     if (
+      chatPreviewList.page !== 0 &&
       listInnerRef &&
       listInnerRef?.current &&
       listInnerRef?.current?.parentElement &&
-      !chatPreviewList.loading &&
-      !chatPreviewList.loaded
+      !chatPreviewList.loading
     ) {
+      console.debug(
+        'UIWeb::ChatPreviewList::useEffect[chatPreviewList.items]::Checking if we need to load more chats::',
+        chatPreviewList,
+        listInnerRef.current.clientHeight,
+        SCROLL_LIMIT,
+        listInnerRef.current.parentElement.clientHeight,
+        listInnerRef.current.clientHeight + SCROLL_LIMIT < listInnerRef.current.parentElement.clientHeight
+      );
+
+      if (chatPreviewList.loaded) {
+        return;
+      }
+
       if (listInnerRef.current.clientHeight + SCROLL_LIMIT < listInnerRef.current.parentElement.clientHeight) {
         // set loading to true
         setChatPreviewList((prev) => ({
@@ -504,7 +519,7 @@ export const ChatPreviewList: React.FC<IChatPreviewListProps> = (options: IChatP
         }));
       }
     }
-  }, [chatPreviewList.page]);
+  }, [chatPreviewList.items]);
 
   // If badges count change
   useEffect(() => {
@@ -610,7 +625,7 @@ export const ChatPreviewList: React.FC<IChatPreviewListProps> = (options: IChatP
               message: 'Invalid search',
             };
           }
-          console.debug(error);
+
           if (!error) {
             const chatInfo = await fetchChat({ chatId: formattedChatId });
             if (chatInfo && chatInfo?.meta?.group)

diff --git a/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfile.tsx b/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfile.tsx
@@ -355,7 +355,6 @@ export const ChatProfile: React.FC<IChatProfile> = ({
 const Container = styled(Section)`
   width: auto;
   max-width: 100%;
-  overflow: hidden;
   background: ${(props) => props.theme.backgroundColor.chatProfileBackground};
   border: ${(props) => props.theme.border?.chatProfile};
   border-radius: ${(props) => props.theme.borderRadius?.chatProfile};