v4.3.15

cometchat · Jul 18, 2024 · ad58e05 · ad58e05
1 parent 93ae716
commit ad58e05
Show file tree

Hide file tree

Showing 16 changed files with 271 additions and 136 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@cometchat/chat-uikit-react-native",
-  "version": "4.3.14",
+  "version": "4.3.15",
   "description": "Ready-to-use Chat UI Components for React Native",
   "main": "src/index",
   "module": "src/index",

diff --git a/src/CometChatDetails/CometChatDetails.tsx b/src/CometChatDetails/CometChatDetails.tsx
@@ -5,6 +5,8 @@ import {
   Image,
   FlatList,
   BackHandler,
+  StyleProp,
+  ViewStyle,
 } from 'react-native';
 import React, { useContext, useEffect, useState } from 'react';
 import Header from './Header';
@@ -13,10 +15,10 @@ import { ICONS } from './resources';
 import { localize, ImageType } from '../shared';
 import {
   UserStatusConstants,
-  GroupMemberOptionConstants,
   ComponentIds,
   PASSWORD_GROUP_COLOR,
   PRIVATE_GROUP_COLOR,
+  GroupOptionConstants,
 } from '../shared/constants/UIKitConstants';
 //@ts-ignore
 import { CometChat } from '@cometchat/chat-sdk-react-native';
@@ -375,7 +377,7 @@ export const CometChatDetails = (props: CometChatDetailsInterface) => {
     (data && data({ user, group })) ?? []
   );
   const [loggedInUser, setLoggedInUser] = useState<CometChat.User>();
-  const [currentScreen, setCurrentScreen] = useState(null);
+  const [currentScreen, setCurrentScreen] = useState<string | null>(null);
   const [modalDetails, setModalDetails] = useState<ModalDetailsInterface>();
 
   const handleViewMembers = () => {
@@ -529,17 +531,15 @@ export const CometChatDetails = (props: CometChatDetailsInterface) => {
   };
   const handleOnClickFncDeclaration = (item?: any) => {
     switch (item.id) {
-      case GroupMemberOptionConstants.view:
+      case GroupOptionConstants.viewMembers:
         return handleViewMembers;
-      case GroupMemberOptionConstants.addMembers:
+      case GroupOptionConstants.addMembers:
         return handleAddMembers;
-      case GroupMemberOptionConstants.ban:
+      case GroupOptionConstants.bannedMembers:
         return handleBannedMembers;
-      case GroupMemberOptionConstants.unban:
-        return handleBannedMembers;
-      case GroupMemberOptionConstants.leave:
+      case GroupOptionConstants.leave:
         return handleLeaveGroup;
-      case GroupMemberOptionConstants.deleteGroup:
+      case GroupOptionConstants.delete:
         return handleDeleteGroup;
       case UserStatusConstants.blocked:
         return () => handleUserBlockUnblock(true);
@@ -707,13 +707,7 @@ export const CometChatDetails = (props: CometChatDetailsInterface) => {
 
   const getDefaultTemplate = (loggedUser, user?: any) => {
     if (userDetails || groupDetails) {
-      const template = getDefaultDetailsTemplate({
-        loggedInUser: loggedUser,
-        user: user ?? userDetails,
-        group: groupDetails,
-        theme,
-      });
-
+      const template = getDefaultDetailsTemplate(loggedUser, user ?? userDetails, groupDetails, theme);
       setDetailsList(template.filter((item) => item));
     }
   };
@@ -859,7 +853,7 @@ export const CometChatDetails = (props: CometChatDetailsInterface) => {
           backgroundColor:
             detailsStyle?.backgroundColor ?? theme.palette.getBackgroundColor(),
           borderRadius: detailsStyle?.borderRadius ?? 0,
-        },
+        } as StyleProp<ViewStyle>,
         detailsStyle?.border ? detailsStyle?.border : {},
       ]}
     >
@@ -931,11 +925,11 @@ export const CometChatDetails = (props: CometChatDetailsInterface) => {
                       : '',
                 borderRadius: 15,
                 ...(statusIndicatorStyle ? statusIndicatorStyle : {}),
-              }
+              } as StyleProp<ViewStyle>
               : {
                 end: 10,
                 ...(statusIndicatorStyle ? statusIndicatorStyle : {}),
-              }
+              } as StyleProp<ViewStyle>
           }
           avatarStyle={
             avatarStyle ? avatarStyle : { border: { borderWidth: 0 } }

diff --git a/src/CometChatMessageInformation/CometChatMessageInformation.tsx b/src/CometChatMessageInformation/CometChatMessageInformation.tsx
@@ -1,12 +1,11 @@
 import React, { useContext, useEffect, useState } from 'react'
-import { Dimensions, FlatList, Image, Text, TouchableOpacity, View, ScrollView } from 'react-native'
+import { Dimensions, FlatList, Image, Text, TouchableOpacity, View, ScrollView, ActivityIndicator } from 'react-native'
 import { CometChat } from '@cometchat/chat-sdk-react-native'
 import { AvatarStyleInterface, ChatConfigurator, CometChatContext, CometChatDate, CometChatListItem, CometChatMessageTemplate, CometChatUIEventHandler, ImageType, ListItemStyleInterface, StatusIndicatorStyleInterface, localize } from '../shared'
 import { MessageInformationStyleInterface } from './MessageInformationStyle'
 import { MessageUtils } from '../shared/utils/MessageUtils'
 import { Style } from "./styles";
 import { ICONS } from "../shared/assets/images";
-import { LoadingIcon } from './resources'
 
 const listenerId = "uiEvents_" + new Date().getTime();
 
@@ -38,6 +37,9 @@ export interface CometChatMessageInformationInterface {
     emptyStateText?: string,
     ErrorStateView?: () => JSX.Element,
     errorStateText?: string,
+    /**
+     * @deprecated
+     */
     loadingIcon?: ImageType,
     LoadingStateView?: () => JSX.Element,
 }
@@ -66,7 +68,6 @@ export const CometChatMessageInformation = (props: CometChatMessageInformationIn
         emptyStateText,
         ErrorStateView,
         errorStateText,
-        loadingIcon,
         LoadingStateView,
     } = props;
 
@@ -216,7 +217,7 @@ export const CometChatMessageInformation = (props: CometChatMessageInformationIn
         if (LoadingStateView)
             return <LoadingStateView />
         return <View style={[Style.viewContainer]}>
-            <Image source={loadingIcon || LoadingIcon} style={[Style.imageStyle, { tintColor: "black" }]} />
+            <ActivityIndicator size={"large"} color={theme.palette.getPrimary()} />
         </View>
     }
 

diff --git a/src/CometChatMessageList/CometChatMessageList.tsx b/src/CometChatMessageList/CometChatMessageList.tsx
@@ -1236,7 +1236,7 @@ export const CometChatMessageList = memo(forwardRef<
                     {Boolean(senderName) && <Text style={[Style.nameStyle, {
                         color: _messageListStyle.nameTextColor,
                         ..._messageListStyle.nameTextFont,
-                    }]}>{senderName}</Text>}
+                    }]} numberOfLines={1} ellipsizeMode={"tail"}>{senderName}</Text>}
                     {
                         timeStampAlignment == "bottom" || item['category'] == "action" ?
                             null :

diff --git a/src/calls/CometChatCallLogHistory/CometChatCallLogHistory.tsx b/src/calls/CometChatCallLogHistory/CometChatCallLogHistory.tsx
@@ -1,10 +1,10 @@
 import { CometChat } from '@cometchat/chat-sdk-react-native'
 import React, { useContext, useEffect, useRef, useState } from 'react'
-import { FlatList, Image, StyleProp, Text, TouchableOpacity, View, ViewStyle } from 'react-native'
+import { ActivityIndicator, FlatList, Image, StyleProp, Text, TouchableOpacity, View, ViewStyle } from 'react-native'
 import { DatePattern, ImageType } from '../../shared/base/Types'
 import { CometChatContext, CometChatDate, CometChatListItem, CometChatOptions, ListItemStyleInterface, localize } from '../../shared'
 import { CallLogHistoryStyle, CallLogHistoryStyleInterface } from './CallLogHistoryStyle'
-import { LoadingIcon, BackIcon } from "./resources";
+import { BackIcon } from "./resources";
 import { Style } from './style'
 import { CallingPackage } from '../CallingPackage'
 import { CallUtils } from '../CallUtils'
@@ -30,6 +30,9 @@ export interface CometChatCallLogHistoryInterface {
   emptyStateText?: string,
   ErrorStateView?: () => JSX.Element,
   errorStateText?: string,
+  /**
+   * @deprecated
+   */
   loadingIcon?: ImageType,
   LoadingStateView?: () => JSX.Element,
   hideError?: boolean,
@@ -63,7 +66,6 @@ export const CometChatCallLogHistory = (props: CometChatCallLogHistoryInterface)
     emptyStateText,
     ErrorStateView,
     errorStateText,
-    loadingIcon,
     LoadingStateView,
     hideError,
     onItemPress,
@@ -302,7 +304,7 @@ export const CometChatCallLogHistory = (props: CometChatCallLogHistoryInterface)
     if (LoadingStateView)
       return <LoadingStateView />
     return <View style={[Style.container]}>
-      <Image source={loadingIcon || LoadingIcon} style={[Style.imageStyle, { tintColor: loadingTint }]} />
+      <ActivityIndicator size={"large"} color={loadingTint} />
     </View>
   }
 

diff --git a/src/calls/CometChatCallLogs/CometChatCallLogs.tsx b/src/calls/CometChatCallLogs/CometChatCallLogs.tsx
@@ -1,11 +1,11 @@
 import { CometChat } from '@cometchat/chat-sdk-react-native'
 import React, { useContext, useEffect, useRef, useState } from 'react'
-import { FlatList, Image, Text, TouchableOpacity, View } from 'react-native'
+import { ActivityIndicator, FlatList, Image, Text, TouchableOpacity, View } from 'react-native'
 import { StyleProp, ViewStyle } from "react-native/types";
 import { AvatarStyleInterface, CometChatContext, CometChatDate, CometChatListItem, CometChatOptions, DatePattern, ImageType, ListItemStyleInterface, localize } from '../../shared'
 import { CallLogsStyle, CallLogsStyleInterface } from './CallLogsStyle'
 import { CometChatUIEventHandler } from '../../shared/events/CometChatUIEventHandler/CometChatUIEventHandler'
-import { LoadingIcon, DetailIcon, BackIcon, IncomingCallIcon, IncomingVideoIcon, MissedCallIcon, MissedVideoIcon, OutgoingCallIcon, OutgoingVideoIcon } from "./resources";
+import { DetailIcon, BackIcon, IncomingCallIcon, IncomingVideoIcon, MissedCallIcon, MissedVideoIcon, OutgoingCallIcon, OutgoingVideoIcon } from "./resources";
 import { CallTypeConstants } from '../../shared/constants/UIKitConstants'
 import { Style } from './style'
 import { CallingPackage } from '../CallingPackage'
@@ -33,6 +33,9 @@ export interface CometChatCallLogsConfigurationInterface {
   emptyStateText?: string,
   ErrorStateView?: () => JSX.Element,
   errorStateText?: string,
+  /**
+   * @deprecated
+   */
   loadingIcon?: ImageType,
   LoadingStateView?: () => JSX.Element,
   hideError?: boolean,
@@ -75,7 +78,6 @@ export const CometChatCallLogs = (props: CometChatCallLogsConfigurationInterface
     emptyStateText,
     ErrorStateView,
     errorStateText,
-    loadingIcon,
     LoadingStateView,
     hideError,
     onItemPress,
@@ -108,7 +110,7 @@ export const CometChatCallLogs = (props: CometChatCallLogsConfigurationInterface
     emptyTextFont: theme?.typography?.subtitle1,
     errorTextColor: theme?.palette?.getError(),
     errorTextFont: theme?.typography?.subtitle1,
-    loadingTint: theme?.palette.getAccent700(),
+    loadingTint: theme?.palette.getPrimary(),
     infoIconTint: theme.palette.getPrimary(),
     subtitleTextColor: theme.palette.getAccent(),
     subtitleTextFont: theme.typography.text2,
@@ -429,7 +431,7 @@ export const CometChatCallLogs = (props: CometChatCallLogsConfigurationInterface
     if (LoadingStateView)
       return <LoadingStateView />
     return <View style={[Style.container]}>
-      <Image source={loadingIcon || LoadingIcon} style={[Style.imageStyle, { tintColor: loadingTint }]} />
+      <ActivityIndicator size={"large"} color={loadingTint} />
     </View>
   }
 

diff --git a/src/extensions/ImageModeration/ImageModerationFilter.tsx b/src/extensions/ImageModeration/ImageModerationFilter.tsx
@@ -114,7 +114,6 @@ export const ImageModerationFilter = (
 
 const styles = StyleSheet.create({
   container: {
-    flex: 1,
     height: 200,
     width: 200,
   },

diff --git a/src/extensions/LinkPreview/LinkPreviewBubble.tsx b/src/extensions/LinkPreview/LinkPreviewBubble.tsx
@@ -30,6 +30,10 @@ export const LinkPreviewBubble = (props: LinkPreviewBubbleInterface) => {
 
     const [imageSource, setImageSource] = useState({ uri: image.startsWith("https:") ? image : `https:${image.split("http:")[1]}` });
 
+    const callCount = useRef(0);
+    const timerId = useRef(null);
+    const threshold = 10; 
+    const timeframe = 1000; 
 
     const pressTime = useRef(0);
 
@@ -47,11 +51,23 @@ export const LinkPreviewBubble = (props: LinkPreviewBubbleInterface) => {
     };
 
     const onTouchMove = () => {
-        if (Platform.OS === "ios") {
-            pressTime.current = null;
+        if (Platform.OS === 'ios') {
+            callCount.current += 1;
+
+            if (callCount.current >= threshold) {
+                callCount.current = 0; // Reset the count after reaching the threshold
+                pressTime.current = null;
+            }
+
+            if (timerId.current) {
+              clearTimeout(timerId.current);
+            }
+
+            timerId.current = setTimeout(() => {
+                callCount.current = 0;
+            }, timeframe);
         }
-    }
-
+    };
 
     return (
         <View>