@@ -5,11 +5,10 @@ import {
55 useTheme ,
66 useCometChatTranslation ,
77 useLocalizedDate ,
8- localizedDateHelperInstance ,
98 LocalizedDateHelper
109} from '@cometchat/chat-uikit-react-native' ;
1110import React , { JSX , useCallback , useEffect , useMemo , useRef , useState } from 'react' ;
12- import { FlatList , Text , View } from 'react-native' ;
11+ import { ActivityIndicator , FlatList , Text , View } from 'react-native' ;
1312import { CallDetailHelper } from './CallDetailHelper' ;
1413import { Icon } from '@cometchat/chat-uikit-react-native' ;
1514
@@ -23,6 +22,8 @@ export const CallHistory = (props: { user?: any; group?: any }) => {
2322 const { formatDate } = useLocalizedDate ( ) ;
2423
2524 const [ list , setList ] = useState < any [ ] > ( [ ] ) ;
25+ const [ loading , setLoading ] = useState < boolean > ( true ) ;
26+ const [ isFetchingMore , setIsFetchingMore ] = useState < boolean > ( false ) ;
2627
2728 const loggedInUser = useRef < CometChat . User | any > ( null ) ;
2829 const callRequestBuilderRef = useRef < any > ( null ) ;
@@ -42,16 +43,23 @@ export const CallHistory = (props: { user?: any; group?: any }) => {
4243 }
4344
4445 const fetchCallLogHistory = ( ) => {
46+ if ( ! callRequestBuilderRef . current || isFetchingMore ) {
47+ return ;
48+ }
49+ setIsFetchingMore ( true ) ;
4550 callRequestBuilderRef . current
4651 . fetchNext ( )
4752 . then ( ( CallLogHistory : any ) => {
48- console . log ( CallLogHistory . length ) ;
4953 if ( CallLogHistory . length > 0 ) {
50- setList ( [ ...list , ...CallLogHistory ] ) ;
54+ setList ( prev => [ ...prev , ...CallLogHistory ] ) ;
5155 }
5256 } )
5357 . catch ( ( err : any ) => {
54- //onError && onError(err);
58+ // onError && onError(err);
59+ } )
60+ . finally ( ( ) => {
61+ setLoading ( false ) ;
62+ setIsFetchingMore ( false ) ;
5563 } ) ;
5664 } ;
5765
@@ -63,7 +71,8 @@ export const CallHistory = (props: { user?: any; group?: any }) => {
6371 fetchCallLogHistory ( ) ;
6472 } )
6573 . catch ( ( e : any ) => {
66- //onError && onError(e);
74+ // onError && onError(e);
75+ setLoading ( false ) ;
6776 } ) ;
6877 } , [ ] ) ;
6978
@@ -224,6 +233,21 @@ export const CallHistory = (props: { user?: any; group?: any }) => {
224233 keyExtractor = { ( item , index ) => item . sessionId + '_' + index }
225234 renderItem = { _render }
226235 onEndReached = { fetchCallLogHistory }
236+ onEndReachedThreshold = { 0.5 }
237+ ListEmptyComponent = {
238+ loading ? (
239+ < View
240+ style = { {
241+ flex : 1 ,
242+ height : 300 ,
243+ justifyContent : 'center' ,
244+ alignItems : 'center' ,
245+ } }
246+ >
247+ < ActivityIndicator size = "large" color = { theme . color . primary } />
248+ </ View >
249+ ) : null
250+ }
227251 />
228252 ) ;
229253} ;
0 commit comments