# ChannelFileAttachmentListContext

`ChannelFileAttachmentListContext` is provided by `ChannelFileAttachmentListProvider`. Mount the provider around your file-attachment-list UI to access the search source used to query and paginate its file attachments. If you are not familiar with the React Context API, see the [React docs](https://reactjs.org/docs/context.html).

`ChannelFileAttachmentListProvider` takes the `channel` it operates on as a prop. In the channel-details flow, the [`FileAttachmentList`](/chat/docs/sdk/react-native/ui-components/file-attachment-list/) component renders the provider and reads that `channel` from [`ChannelDetailsContext`](/chat/docs/sdk/react-native/contexts/channel-details-context/), so nested components don't need it via props.

## Best Practices

- Render `ChannelFileAttachmentListProvider` with the `channel` whose file attachments you want to list — inside the channel-details flow this comes from [`ChannelDetailsContext`](/chat/docs/sdk/react-native/contexts/channel-details-context/).
- Use `searchSource` for querying and paginating attachments; it is pre-configured to return `file` and `audio` attachments, newest first.
- Pass a custom `searchSource` only when you need different filtering, sorting, or page size — otherwise rely on the default the provider creates.
- Calling `useChannelFileAttachmentListContext` outside the provider throws — render your file-attachment-list UI as a child of `ChannelFileAttachmentListProvider`.

## Basic Usage

Wrap your file-attachment-list UI in `ChannelFileAttachmentListProvider`:

```tsx
import { ChannelFileAttachmentListProvider } from "stream-chat-react-native";

<ChannelFileAttachmentListProvider channel={channel}>
  {/* file attachment list UI */}
</ChannelFileAttachmentListProvider>;
```

Consume `ChannelFileAttachmentListContext` in any child of the provider:

```tsx
import { useContext } from "react";
import { ChannelFileAttachmentListContext } from "stream-chat-react-native";

const { searchSource } = useContext(ChannelFileAttachmentListContext);
```

Alternatively, use the `useChannelFileAttachmentListContext` hook to consume `ChannelFileAttachmentListContext`.

```tsx
import { useChannelFileAttachmentListContext } from "stream-chat-react-native";

const { searchSource } = useChannelFileAttachmentListContext();
```

## Values

| Value             | Description                                                                                                                                                                                                                                                        | Type                                                                                                      |
| ----------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------- |
| `searchSource` \* | A [`MessageSearchSource`](https://github.com/GetStream/stream-chat-js/blob/master/src/search_controller.ts) used to query and paginate the channel's file attachments. Pre-configured to return `file` and `audio` attachments, sorted by `created_at` descending. | [`MessageSearchSource`](https://github.com/GetStream/stream-chat-js/blob/master/src/search_controller.ts) |


---

This page was last updated at 2026-06-30T12:00:28.249Z.

For the most recent version of this documentation, visit [https://getstream.io/chat/docs/sdk/react-native/contexts/channel-file-attachment-list-context/](https://getstream.io/chat/docs/sdk/react-native/contexts/channel-file-attachment-list-context/).