feat add keep replies fonctionnality

example-expo/data/messages.js

@@ -76,10 +76,11 @@ export default [
   // },
   {
     _id: 1,
-    text: 'This is a quick reply. Do you love Gifted Chat? (radio)',
+    text: 'This is a quick reply. Do you love Gifted Chat? (radio) KEEP IT',
     createdAt: new Date(),
     quickReplies: {
       type: 'radio', // or 'checkbox',
+      keepIt: true,
       values: [
         {
           title: '😋 Yes',

src/Bubble.tsx

@@ -281,15 +281,12 @@ export default class Bubble extends React.Component<BubbleProps> {
 
   renderQuickReplies() {
     const { currentMessage, onQuickReply, nextMessage } = this.props
-    if (nextMessage && nextMessage._id) {
-      return null
-    }
     if (currentMessage && currentMessage.quickReplies) {
       const { containerStyle, wrapperStyle, ...quickReplyProps } = this.props
       if (this.props.renderQuickReplies) {
         return this.props.renderQuickReplies(quickReplyProps)
       }
-      return <QuickReplies {...{ currentMessage, onQuickReply }} />
+      return <QuickReplies {...{ currentMessage, onQuickReply, nextMessage }} />
     }
     return null
   }

src/GiftedChat.tsx

@@ -31,6 +31,7 @@ import {
   DATE_FORMAT,
 } from './Constant'
 import { IMessage, User, Reply } from './types'
+import QuickReplies from './QuickReplies'
 
 const GiftedActionSheet = ActionSheet as any
 
@@ -147,6 +148,7 @@ export interface GiftedChatProps<TMessage extends IMessage = IMessage> {
   /* Custom parse patterns for react-native-parsed-text used to linking message content (like URLs and phone numbers) */
   parsePatterns?(): React.ReactNode
   onQuickReply?(replies: Reply[]): void
+  renderQuickReplies?(quickReplies: QuickReplies['props']): React.ReactNode
 }
 
 interface GiftedChatState {

src/QuickReplies.tsx

@@ -31,6 +31,7 @@ const styles = StyleSheet.create({
 })
 
 interface QuickRepliesProps {
+  nextMessage?: IMessage
   currentMessage?: IMessage
   color?: string
   sendText?: string
@@ -58,6 +59,7 @@ export default class QuickReplies extends Component<
     onQuickReply: () => {},
     color: Color.peterRiver,
     sendText: 'Send',
+    keepReplies: false,
   }
 
   static propTypes = {
@@ -101,18 +103,41 @@ export default class QuickReplies extends Component<
   }
 
   handleSend = (replies: Reply[]) => () => {
+    const { currentMessage } = this.props
     if (this.props.onQuickReply) {
-      this.props.onQuickReply(replies)
+      this.props.onQuickReply(
+        replies.map((reply: Reply) => ({
+          ...reply,
+          messageId: currentMessage!._id,
+        })),
+      )
     }
   }
 
+  shouldComponentDisplay = () => {
+    const { currentMessage, nextMessage } = this.props
+    const hasReplies = !!currentMessage && !!currentMessage!.quickReplies
+    const hasNext = !!nextMessage && !!nextMessage!._id
+
+    if (hasReplies && !hasNext) {
+      return true
+    }
+    if (hasReplies && hasNext && currentMessage!.quickReplies!.keepIt) {
+      return true
+    }
+    return false
+  }
+
   render() {
     const { currentMessage, color, sendText } = this.props
     const { replies } = this.state
-    if (!currentMessage && !currentMessage!.quickReplies) {
+
+    if (!this.shouldComponentDisplay()) {
       return null
     }
+
     const { type } = currentMessage!.quickReplies!
+
     return (
       <View style={styles.container}>
         {currentMessage!.quickReplies!.values.map((reply: Reply) => {

src/types.ts

@@ -16,11 +16,13 @@ export interface User {
 export interface Reply {
   title: string
   value: string
+  messageId?: string
 }
 
 export interface QuickReplies {
   type: 'radio' | 'checkbox'
   values: Reply[]
+  keepIt?: boolean
 }
 
 export interface IMessage {