diff --git a/example/src/MessageListExample.tsx b/example/src/MessageListExample.tsx index 4fb5cfc..099bfee 100644 --- a/example/src/MessageListExample.tsx +++ b/example/src/MessageListExample.tsx @@ -1,5 +1,11 @@ -import React, { useEffect, useState } from 'react'; -import { SafeAreaView, StyleSheet, Text, View } from 'react-native'; +import React, { useEffect, useRef, useState } from 'react'; +import { + SafeAreaView, + StyleSheet, + Text, + View, + FlatList as FlatListType, +} from 'react-native'; import { FlatList } from 'react-native-bidirectional-infinite-scroll'; import { MessageBubble } from './MessageBubble'; @@ -7,6 +13,8 @@ import { Message, queryMoreMessages } from './utils'; const App = () => { const [messages, setMessages] = useState>([]); + const listRef = useRef(null); + useEffect(() => { const initChat = async () => { const initialMessages = await queryMoreMessages(50); @@ -42,6 +50,7 @@ const App = () => { Chat between two users = Omit< ListHeaderComponent?: React.ComponentType; /** Custom UI component for footer indicator of FlatList. Only used when `showDefaultLoadingIndicators` is false */ ListFooterComponent?: React.ComponentType; + ref?: + | ((instance: FlatListType | null) => void) + | MutableRefObject | null> + | null; }; /** * Note: