FileAttachment
Renders file attachments inside MessageList.
Best Practices
- Keep file rows compact and readable.
- Validate file size/type before rendering heavy previews.
- Use consistent icons and sizes across your app.
- Customize via
WithComponentsinstead of editing internals.
Basic Usage
Replace the default UI via WithComponents.
Example: change the file attachment icon size.
import { WithComponents, FileAttachment } from "stream-chat-react-native";
<WithComponents
overrides={{
FileAttachment: () => <FileAttachment attachmentIconSize="lg" />,
}}
>
<Channel channel={channel}>
<MessageList />
<MessageComposer />
</Channel>
</WithComponents>;Props
| Prop | Description | Type |
|---|---|---|
attachment |
Attachment object for a file type attachment. |
object |
attachmentIconSize |
Size of the file icon, forwarded to FilePreview/FileIcon. Defaults to 'md'. |
'sm' | 'md' | 'lg' |
additionalPressableProps |
Extra props passed to the underlying Pressable used in message components like MessageContent. |
object |
onLongPress |
Default long press handler for message UI. | function |
onPress |
Default press handler for message UI. | function |
onPressIn |
Default pressIn handler for message UI. |
function |
preventPress |
Disable press interactions for the file row. | boolean |
styles |
Style overrides for the file row (container, details, size, title). |
object |
UI Component Props
| Prop | Description | Type |
|---|---|---|
FilePreview |
Renders the file row content and receives the upload progress indicator while a local attachment is pending. Defaults to FilePreview. |
ComponentType |