fix: fixed the issues

moved the funcs to helpers and also removed the commented code

Author: abhishek-01k

packages/uiweb/src/lib/components/chat/ChatViewBubbleCore/ChatViewBubbleCore.tsx

@@ -8,7 +8,7 @@ import styled from 'styled-components';
 import { useChatData } from '../../../hooks';
 import { ThemeContext } from '../theme/ThemeProvider';
 
-import { isMessageEncrypted, pCAIP10ToWallet } from '../../../helpers';
+import { deepCopy, isMessageEncrypted, pCAIP10ToWallet } from '../../../helpers';
 import { IMessagePayload, TwitterFeedReturnType } from '../exportedTypes';
 
 import { Section } from '../../reusables';
@@ -25,34 +25,6 @@ interface ChatViewBubbleCoreProps extends React.ComponentProps<typeof Section> {
   previewMode?: boolean;
 }
 
-// Main Logic
-// Deep Copy Helper Function
-function deepCopy<T>(obj: T): T {
-  if (obj === null || typeof obj !== 'object') {
-    return obj;
-  }
-
-  if (obj instanceof Date) {
-    return new Date(obj.getTime()) as any;
-  }
-
-  if (obj instanceof Array) {
-    return obj.reduce((arr, item, i) => {
-      arr[i] = deepCopy(item);
-      return arr;
-    }, [] as any[]) as any;
-  }
-
-  if (obj instanceof Object) {
-    return Object.keys(obj).reduce((newObj, key) => {
-      newObj[key as keyof T] = deepCopy((obj as any)[key]);
-      return newObj;
-    }, {} as T);
-  }
-
-  throw new Error(`Unable to copy obj! Its type isn't supported.`);
-}
-
 // Exported Default Component
 export const ChatViewBubbleCore = ({
   chat,

packages/uiweb/src/lib/components/chat/ChatViewBubbleCore/cards/image/ImageCard.tsx

@@ -8,6 +8,9 @@ import { Image, Section, Span } from '../../../../reusables';
 import { ThemeContext } from '../../../theme/ThemeProvider';
 import { Tag } from '../../tag/Tag';
 
+// Helper functions
+import { getParsedMessage } from '../../../helpers';
+
 // Internal Configs
 
 // Assets
@@ -19,15 +22,6 @@ import { IMessagePayload } from '../../../exportedTypes';
 
 // Exported Interfaces & Types
 
-// Exported Functions
-const getParsedMessage = (message: string) => {
-  try {
-    return JSON.parse(message);
-  } catch (error) {
-    console.error('UIWeb::components::ChatViewBubble::ImageCard::error while parsing image', error);
-    return null;
-  }
-};
 
 const getImageContent = (message: string) => getParsedMessage(message)?.content ?? '';
 

packages/uiweb/src/lib/components/chat/ChatViewBubbleCore/cards/message/MessageCard.tsx

@@ -211,7 +211,7 @@ export const MessageCard = ({
     <MessageCardSection
       className={initialized.additionalClasses}
       justifyContent="stretch"
-      width={'fill-available'}
+      width="fill-available"
     >
       {/* Preview Renderer - Start with assuming preview is there, callback handles no preview */}
       <MessagePreviewSection

packages/uiweb/src/lib/components/chat/ChatViewList/ChatViewList.tsx

@@ -216,15 +216,6 @@ export const ChatViewList: React.FC<IChatViewListProps> = (options: IChatViewLis
         scrollLocked = true;
       }
 
-      // Turning it off as it overfills debug
-      // console.debug(
-      //   `UIWeb::ChatViewList::onScroll::scrollLocked ${new Date().toISOString()}`,
-      //   scrollRef.current.scrollTop,
-      //   scrollRef.current.clientHeight,
-      //   scrollRef.current.scrollHeight,
-      //   scrollLocked
-      // );
-
       // update scroll-locked attribute
       scrollRef.current.setAttribute('data-scroll-locked', scrollLocked.toString());
 
@@ -248,15 +239,6 @@ export const ChatViewList: React.FC<IChatViewListProps> = (options: IChatViewLis
         if (scrollRef.current && height !== 0) {
           const scrollLocked = scrollRef.current.getAttribute('data-scroll-locked') === 'true' ? true : false;
 
-          // Turning it off as it overfills debug
-          // console.debug(
-          //   `UIWeb::ChatViewList::onScroll::scrollLocked Observer ${new Date().toISOString()}`,
-          //   scrollRef.current.scrollTop,
-          //   scrollRef.current.clientHeight,
-          //   scrollRef.current.scrollHeight,
-          //   scrollLocked
-          // );
-
           if (height !== 0 && scrollLocked) {
             // update programmable-scroll attribute
             scrollRef.current.setAttribute('data-programmable-scroll', 'true');
@@ -589,7 +571,7 @@ export const ChatViewList: React.FC<IChatViewListProps> = (options: IChatViewLis
 };
 
 //styles
-const ChatViewListCard = styled(Section)<IThemeProps>`
+const ChatViewListCard = styled(Section) <IThemeProps>`
   &::-webkit-scrollbar-thumb {
     background: ${(props) => props.theme.scrollbarColor};
     border-radius: 10px;
@@ -602,6 +584,6 @@ const ChatViewListCard = styled(Section)<IThemeProps>`
   overscroll-behavior: contain;
 `;
 
-const ChatViewListCardInner = styled(Section)<IThemeProps>`
+const ChatViewListCardInner = styled(Section) <IThemeProps>`
   filter: ${(props) => (props.blur ? 'blur(12px)' : 'none')};
 `;

packages/uiweb/src/lib/components/chat/helpers/helper.ts

@@ -268,6 +268,15 @@ export const transformStreamToIMessageIPFSWithCID: (item: any) => IMessageIPFSWi
   return transformedItem;
 };
 
+export const getParsedMessage = (message: string) => {
+  try {
+    return JSON.parse(message);
+  } catch (error) {
+    console.error('UIWeb::components::ChatViewBubble::ImageCard::error while parsing image', error);
+    return null;
+  }
+};
+
 export const getChatParticipantDisplayName = (derivedChatId: string, chatId: string) => {
   return derivedChatId ? getDomainIfExists(chatId) ?? derivedChatId : derivedChatId;
 };

packages/uiweb/src/lib/helpers/utils.ts

@@ -35,6 +35,34 @@ export const deriveChatId = async (chatId: string, user: PushAPI | undefined): P
   return chatId;
 };
 
+// Main Logic
+// Deep Copy Helper Function
+export function deepCopy<T>(obj: T): T {
+  if (obj === null || typeof obj !== 'object') {
+    return obj;
+  }
+
+  if (obj instanceof Date) {
+    return new Date(obj.getTime()) as any;
+  }
+
+  if (obj instanceof Array) {
+    return obj.reduce((arr, item, i) => {
+      arr[i] = deepCopy(item);
+      return arr;
+    }, [] as any[]) as any;
+  }
+
+  if (obj instanceof Object) {
+    return Object.keys(obj).reduce((newObj, key) => {
+      newObj[key as keyof T] = deepCopy((obj as any)[key]);
+      return newObj;
+    }, {} as T);
+  }
+
+  throw new Error(`Unable to copy obj! Its type isn't supported.`);
+}
+
 export const isMessageEncrypted = (message: string) => {
   if (!message) return false;