movius-chats 1.6.0 → 1.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +28 -0
- package/lib/commonjs/index.js +4 -4
- package/lib/commonjs/index.js.map +1 -1
- package/lib/module/index.js +4 -4
- package/lib/module/index.js.map +1 -1
- package/lib/typescript/index.d.ts +1 -1
- package/lib/typescript/types/index.d.ts +11 -0
- package/package.json +1 -1
- package/src/index.tsx +51 -12
- package/src/types/index.ts +12 -9
package/README.md
CHANGED
|
@@ -399,6 +399,15 @@ interface ChatScreenProps {
|
|
|
399
399
|
onMessageLongPress?: (message: Message) => void;
|
|
400
400
|
onTypingStart?: () => void;
|
|
401
401
|
onTypingEnd?: () => void;
|
|
402
|
+
onEndReached?: (info: { distanceFromEnd: number }) => void;
|
|
403
|
+
onEndReachedThreshold?: number; // Default: 0.5
|
|
404
|
+
isLoadingMoreMessages?: boolean;
|
|
405
|
+
renderLoadingMoreIndicator?: () => React.ReactNode;
|
|
406
|
+
loadingMoreIndicatorContainerStyle?: ViewStyle;
|
|
407
|
+
loadingMoreIndicatorText?: string;
|
|
408
|
+
loadingMoreIndicatorTextStyle?: TextStyle;
|
|
409
|
+
loadingMoreIndicatorColor?: string;
|
|
410
|
+
loadingMoreIndicatorSize?: number | 'small' | 'large';
|
|
402
411
|
|
|
403
412
|
// UI Options
|
|
404
413
|
showAvatars?: boolean; // Default: true
|
|
@@ -434,6 +443,25 @@ interface ChatScreenProps {
|
|
|
434
443
|
|
|
435
444
|
See [Message Data Model](#message-data-model) section above for full details.
|
|
436
445
|
|
|
446
|
+
### Loading More Messages
|
|
447
|
+
|
|
448
|
+
When the user reaches the top of the message list while older messages are being fetched, the component can show a loading indicator. This is controlled by the pagination props above.
|
|
449
|
+
|
|
450
|
+
```tsx
|
|
451
|
+
<ChatScreen
|
|
452
|
+
messages={messages}
|
|
453
|
+
currentUserId={currentUserId}
|
|
454
|
+
onSendMessage={handleSend}
|
|
455
|
+
onEndReached={() => fetchOlderMessages()}
|
|
456
|
+
onEndReachedThreshold={0.5}
|
|
457
|
+
isLoadingMoreMessages={isFetchingOlderMessages}
|
|
458
|
+
loadingMoreIndicatorText="Loading older messages"
|
|
459
|
+
loadingMoreIndicatorColor="#4F46E5"
|
|
460
|
+
loadingMoreIndicatorSize="small"
|
|
461
|
+
renderLoadingMoreIndicator={() => <YourCustomLoader />}
|
|
462
|
+
/>
|
|
463
|
+
```
|
|
464
|
+
|
|
437
465
|
### Theme Configuration
|
|
438
466
|
|
|
439
467
|
```tsx
|