example: fixed - now it works

example/example-expo/CustomActions.tsx

@@ -1,4 +1,3 @@
-import PropTypes from 'prop-types'
 import React, { useCallback } from 'react'
 import {
   StyleProp,
@@ -61,7 +60,7 @@ const CustomActions = ({
         }
       }
     )
-  }, [showActionSheetWithOptions])
+  }, [showActionSheetWithOptions, onSend])
 
   const renderIconComponent = useCallback(() => {
     if (renderIcon)
@@ -72,7 +71,7 @@ const CustomActions = ({
         <Text style={[styles.iconText, iconTextStyle]}>+</Text>
       </View>
     )
-  }, [renderIcon])
+  }, [renderIcon, wrapperStyle, iconTextStyle])
 
   return (
     <TouchableOpacity
@@ -110,7 +109,3 @@ const styles = StyleSheet.create({
     textAlign: 'center',
   },
 })
-
-CustomActions.contextTypes = {
-  actionSheet: PropTypes.func,
-}

example/example-expo/mediaUtils.ts

@@ -32,41 +32,51 @@ export default async function getPermissionAsync (
 export async function getLocationAsync (
   onSend: (locations: { location: Location.LocationObjectCoords }[]) => void
 ) {
-  if (await Location.requestForegroundPermissionsAsync()) {
-    const location = await Location.getCurrentPositionAsync({})
-    if (location)
-      onSend([{ location: location.coords }])
-  }
+  const response = await Location.requestForegroundPermissionsAsync()
+  if (!response.granted)
+    return
+
+  const location = await Location.getCurrentPositionAsync()
+  if (!location)
+    return
+
+  onSend([{ location: location.coords }])
 }
 
 export async function pickImageAsync (
   onSend: (images: { image: string }[]) => void
 ) {
-  if (await ImagePicker.requestMediaLibraryPermissionsAsync()) {
-    const result = await ImagePicker.launchImageLibraryAsync({
-      allowsEditing: true,
-      aspect: [4, 3],
-    })
+  const response = await ImagePicker.requestMediaLibraryPermissionsAsync()
+  if (!response.granted)
+    return
 
-    if (!result.cancelled) {
-      onSend([{ image: result.uri }])
-      return result.uri
-    }
-  }
+  const result = await ImagePicker.launchImageLibraryAsync({
+    allowsEditing: true,
+    aspect: [4, 3],
+  })
+
+  if (result.canceled)
+    return
+
+  const images = result.assets.map(({ uri: image }) => ({ image }))
+  onSend(images)
 }
 
 export async function takePictureAsync (
   onSend: (images: { image: string }[]) => void
 ) {
-  if (await ImagePicker.requestCameraPermissionsAsync()) {
-    const result = await ImagePicker.launchCameraAsync({
-      allowsEditing: true,
-      aspect: [4, 3],
-    })
+  const response = await ImagePicker.requestCameraPermissionsAsync()
+  if (!response.granted)
+    return
 
-    if (!result.cancelled) {
-      onSend([{ image: result.uri }])
-      return result.uri
-    }
-  }
+  const result = await ImagePicker.launchCameraAsync({
+    allowsEditing: true,
+    aspect: [4, 3],
+  })
+
+  if (result.canceled)
+    return
+
+  const images = result.assets.map(({ uri: image }) => ({ image }))
+  onSend(images)
 }

example/example-slack-message/src/SlackBubble.tsx

@@ -1,5 +1,4 @@
 import React, { useCallback, useMemo } from 'react'
-import PropTypes from 'prop-types'
 import {
   Text,
   StyleSheet,
@@ -17,23 +16,23 @@ import {
   utils,
   useChatContext,
 } from 'react-native-gifted-chat'
-import Clipboard from '@react-native-clipboard/clipboard'
+import * as Clipboard from 'expo-clipboard'
 
 const { isSameUser, isSameDay } = utils
 
 interface Props {
-  touchableProps: any
-  onLongPress?: (context: any, currentMessage: any) => void
+  touchableProps: object
+  onLongPress?: (context: unknown, currentMessage: object) => void
   renderMessageImage?: (props: Props) => React.ReactNode
   renderMessageText?: (props: Props) => React.ReactNode
   renderCustomView?: (props: Props) => React.ReactNode
   renderUsername?: (props: Props) => React.ReactNode
   renderTime?: (props: Props) => React.ReactNode
-  renderTicks?: (currentMessage: any) => React.ReactNode
-  currentMessage: any
-  nextMessage: any
-  previousMessage: any
-  user: any
+  renderTicks?: (currentMessage: object) => React.ReactNode
+  currentMessage: object
+  nextMessage: object
+  previousMessage: object
+  user: object
   containerStyle: {
     left: StyleProp<ViewStyle>
     right: StyleProp<ViewStyle>
@@ -94,7 +93,7 @@ const Bubble = (props: Props) => {
       (buttonIndex: number) => {
         switch (buttonIndex) {
           case 0:
-            Clipboard.setString(currentMessage.text)
+            Clipboard.setStringAsync(currentMessage.text)
             break
         }
       }
@@ -311,7 +310,3 @@ const styles = StyleSheet.create({
 })
 
 export default Bubble
-
-Bubble.contextTypes = {
-  actionSheet: PropTypes.func,
-}

example/metro.config.js

@@ -27,9 +27,6 @@ config.resolver = {
         if (name === 'react-native-gifted-chat')
           return path.join(process.cwd(), '../src')
 
-        if (name === 'lodash.isequal')
-          return path.join(process.cwd(), `../node_modules/${name}`)
-
         return path.join(process.cwd(), `node_modules/${name}`)
       },
     }

example/package.json

@@ -14,7 +14,6 @@
   },
   "dependencies": {
     "@expo/react-native-action-sheet": "4.1.0",
-    "@react-native-clipboard/clipboard": "^1.14.1",
     "@react-navigation/native": "6.1.18",
     "expo": "~51.0.29",
     "expo-app-loading": "~2.1.1",
@@ -30,7 +29,7 @@
     "react-native-lightbox-v2": "0.9.0",
     "react-native-maps": "1.18.0",
     "react-native-parsed-text": "0.0.22",
-    "react-native-reanimated": "~3.15.0",
+    "react-native-reanimated": "~3.10.1",
     "react-native-safe-area-context": "4.10.9",
     "react-native-screens": "~3.34.0",
     "react-native-typing-animation": "0.1.7",

example/yarn.lock

@@ -1662,11 +1662,6 @@
   resolved "https://registry.yarnpkg.com/@pkgjs/parseargs/-/parseargs-0.11.0.tgz#a77ea742fab25775145434eb1d2328cf5013ac33"
   integrity sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==
 
-"@react-native-clipboard/clipboard@^1.14.1":
-  version "1.14.1"
-  resolved "https://registry.yarnpkg.com/@react-native-clipboard/clipboard/-/clipboard-1.14.1.tgz#835f82fc86881a0808a8405f2576617bb5383554"
-  integrity sha512-SM3el0A28SwoeJljVNhF217o0nI4E7RfalLmuRQcT1/7tGcxUjgFa3jyrEndYUct8/uxxK5EUNGUu1YEDqzxqw==
-
 "@react-native-community/cli-clean@14.0.0":
   version "14.0.0"
   resolved "https://registry.yarnpkg.com/@react-native-community/cli-clean/-/cli-clean-14.0.0.tgz#37b53762e5f3d02f452a44fc32a7f88a7419ccad"
@@ -3768,6 +3763,11 @@ expo-asset@~10.0.10:
     invariant "^2.2.4"
     md5-file "^3.2.3"
 
+expo-clipboard@^6.0.3:
+  version "6.0.3"
+  resolved "https://registry.yarnpkg.com/expo-clipboard/-/expo-clipboard-6.0.3.tgz#dfea74d4a004dce59ecefd063d6fb9f1c356a03f"
+  integrity sha512-RIKDsuHkYfaspifbFpVC8sBVFKR05L7Pj7mU2/XkbrW9m01OBNvdpGraXEMsTFCx97xMGsZpEw9pPquL4j4xVg==
+
 expo-constants@~16.0.0:
   version "16.0.2"
   resolved "https://registry.yarnpkg.com/expo-constants/-/expo-constants-16.0.2.tgz#eb5a1bddb7308fd8cadac8fc44decaf4784cac5e"
@@ -6647,9 +6647,9 @@ react-native-gifted-chat@./..:
   version "2.4.1"
   dependencies:
     "@expo/react-native-action-sheet" "4.1.0"
-    "@react-native-clipboard/clipboard" "^1.14.1"
     "@types/lodash.isequal" "^4.5.8"
     dayjs "1.11.13"
+    expo-clipboard "^6.0.3"
     lodash.isequal "^4.5.0"
     prop-types "15.8.1"
     react-native-communications "2.2.1"
@@ -6687,7 +6687,7 @@ react-native-parsed-text@0.0.22:
   dependencies:
     prop-types "^15.7.x"
 
-react-native-reanimated@^3.15.0, react-native-reanimated@~3.15.0:
+react-native-reanimated@^3.15.0:
   version "3.15.0"
   resolved "https://registry.yarnpkg.com/react-native-reanimated/-/react-native-reanimated-3.15.0.tgz#8814af7c78bbdf4c92bbd583f2266febf962e66a"
   integrity sha512-yGxOyYAAu/5CyjonM2SgsM5sviiiK8HiHL9jT1bKfRxMLnNX9cFP8/UXRkbMT7ZXIfOlCvNFR0AqnphpuXIPVA==
@@ -6704,6 +6704,20 @@ react-native-reanimated@^3.15.0, react-native-reanimated@~3.15.0:
     convert-source-map "^2.0.0"
     invariant "^2.2.4"
 
+react-native-reanimated@~3.10.1:
+  version "3.10.1"
+  resolved "https://registry.yarnpkg.com/react-native-reanimated/-/react-native-reanimated-3.10.1.tgz#3c37d1100bbba0065df39c96aab0c1ff1b50c0fa"
+  integrity sha512-sfxg6vYphrDc/g4jf/7iJ7NRi+26z2+BszPmvmk0Vnrz6FL7HYljJqTf531F1x6tFmsf+FEAmuCtTUIXFLVo9w==
+  dependencies:
+    "@babel/plugin-transform-arrow-functions" "^7.0.0-0"
+    "@babel/plugin-transform-nullish-coalescing-operator" "^7.0.0-0"
+    "@babel/plugin-transform-optional-chaining" "^7.0.0-0"
+    "@babel/plugin-transform-shorthand-properties" "^7.0.0-0"
+    "@babel/plugin-transform-template-literals" "^7.0.0-0"
+    "@babel/preset-typescript" "^7.16.7"
+    convert-source-map "^2.0.0"
+    invariant "^2.2.4"
+
 react-native-safe-area-context@4.10.9, react-native-safe-area-context@^4.10.9:
   version "4.10.9"
   resolved "https://registry.yarnpkg.com/react-native-safe-area-context/-/react-native-safe-area-context-4.10.9.tgz#6ab82dc866ab499b101b033cb0f5b40125a4d410"

package.json

@@ -52,9 +52,9 @@
   },
   "dependencies": {
     "@expo/react-native-action-sheet": "4.1.0",
-    "@react-native-clipboard/clipboard": "^1.14.1",
     "@types/lodash.isequal": "^4.5.8",
     "dayjs": "1.11.13",
+    "expo-clipboard": "^6.0.3",
     "lodash.isequal": "^4.5.0",
     "prop-types": "15.8.1",
     "react-native-communications": "2.2.1",

src/Bubble.tsx

@@ -9,7 +9,7 @@ import {
   ViewStyle,
   TextStyle,
 } from 'react-native'
-import Clipboard from '@react-native-clipboard/clipboard'
+import * as Clipboard from 'expo-clipboard'
 
 import { GiftedChatContext } from './GiftedChatContext'
 import { QuickReplies, QuickRepliesProps } from './QuickReplies'
@@ -269,7 +269,7 @@ export default class Bubble<
     } else if (currentMessage && currentMessage.text) {
       const { optionTitles } = this.props
       const options =
-        optionTitles && optionTitles.length > 0
+        optionTitles?.length
           ? optionTitles.slice(0, 2)
           : DEFAULT_OPTION_TITLES
       const cancelButtonIndex = options.length - 1
@@ -283,7 +283,7 @@ export default class Bubble<
         (buttonIndex: number) => {
           switch (buttonIndex) {
             case 0:
-              Clipboard.setString(currentMessage.text)
+              Clipboard.setStringAsync(currentMessage.text)
               break
             default:
               break

src/GiftedChat.tsx

@@ -490,12 +490,10 @@ function GiftedChat<TMessage extends IMessage = IMessage> (
   const inputToolbarFragment = useMemo(() => {
     if (!isInitialized)
       return null
-    if (!text)
-      return null
 
     const inputToolbarProps = {
       ...props,
-      text: getTextFromProp(text),
+      text: getTextFromProp(text!),
       composerHeight: Math.max(minComposerHeight!, composerHeight),
       onSend: _onSend,
       onInputSizeChanged,

src/Message.tsx

@@ -33,7 +33,6 @@ const styles = {
 }
 
 export interface MessageProps<TMessage extends IMessage> {
-  key: string
   showUserAvatar?: boolean
   position: 'left' | 'right'
   currentMessage: TMessage

src/MessageContainer.tsx

@@ -233,7 +233,6 @@ export default class MessageContainer<
       const messageProps: Message['props'] = {
         ...restProps,
         user,
-        key: item._id.toString(),
         currentMessage: item,
         previousMessage,
         inverted,
@@ -244,7 +243,7 @@ export default class MessageContainer<
       if (this.props.renderMessage)
         return this.props.renderMessage(messageProps)
 
-      return <Message {...messageProps} />
+      return <Message key={item._id.toString()} {...messageProps} />
     }
     return null
   }

yarn.lock

@@ -1407,11 +1407,6 @@
     "@nodelib/fs.scandir" "2.1.5"
     fastq "^1.6.0"
 
-"@react-native-clipboard/clipboard@^1.14.1":
-  version "1.14.1"
-  resolved "https://registry.yarnpkg.com/@react-native-clipboard/clipboard/-/clipboard-1.14.1.tgz#835f82fc86881a0808a8405f2576617bb5383554"
-  integrity sha512-SM3el0A28SwoeJljVNhF217o0nI4E7RfalLmuRQcT1/7tGcxUjgFa3jyrEndYUct8/uxxK5EUNGUu1YEDqzxqw==
-
 "@react-native-community/cli-clean@14.0.0":
   version "14.0.0"
   resolved "https://registry.yarnpkg.com/@react-native-community/cli-clean/-/cli-clean-14.0.0.tgz#37b53762e5f3d02f452a44fc32a7f88a7419ccad"
@@ -3933,6 +3928,11 @@ expect@^29.0.0, expect@^29.7.0:
     jest-message-util "^29.7.0"
     jest-util "^29.7.0"
 
+expo-clipboard@^6.0.3:
+  version "6.0.3"
+  resolved "https://registry.yarnpkg.com/expo-clipboard/-/expo-clipboard-6.0.3.tgz#dfea74d4a004dce59ecefd063d6fb9f1c356a03f"
+  integrity sha512-RIKDsuHkYfaspifbFpVC8sBVFKR05L7Pj7mU2/XkbrW9m01OBNvdpGraXEMsTFCx97xMGsZpEw9pPquL4j4xVg==
+
 fast-base64-decode@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/fast-base64-decode/-/fast-base64-decode-1.0.0.tgz#b434a0dd7d92b12b43f26819300d2dafb83ee418"