align with v4

packages/stream_chat_v1/lib/channel_file_display_screen.dart

@@ -1,40 +1,29 @@
 import 'package:example/localizations.dart';
+import 'package:example/routes/routes.dart';
 import 'package:flutter/material.dart';
 import 'package:stream_chat_flutter/stream_chat_flutter.dart';
+import 'package:video_player/video_player.dart';
+
+import 'channel_page.dart';
 
 class ChannelFileDisplayScreen extends StatefulWidget {
-  /// The sorting used for the channels matching the filters.
+  final StreamMessageThemeData messageTheme;
-  /// Sorting is based on field and direction, multiple sorting options can be provided.
-  /// You can sort based on last_updated, last_message_at, updated_at, created_at or member_count.
-  /// Direction can be ascending or descending.
-  final List<SortOption>? sortOptions;
-
-  /// Pagination parameters
-  /// limit: the number of users to return (max is 30)
-  /// offset: the offset (max is 1000)
-  /// message_limit: how many messages should be included to each channel
-  final PaginationParams paginationParams;
-
-  /// The builder used when the file list is empty.
-  final WidgetBuilder? emptyBuilder;
 
   const ChannelFileDisplayScreen({
-    this.sortOptions,
+    Key? key,
-    this.paginationParams = const PaginationParams(limit: 20),
+    required this.messageTheme,
-    this.emptyBuilder,
+  }) : super(key: key);
-  });
 
   @override
-  _ChannelFileDisplayScreenState createState() =>
+  State<ChannelFileDisplayScreen> createState() =>
       _ChannelFileDisplayScreenState();
 }
 
 class _ChannelFileDisplayScreenState extends State<ChannelFileDisplayScreen> {
-  @override
+  final Map<String?, VideoPlayerController?> controllerCache = {};
-  void initState() {
+
-    super.initState();
+  late final controller = StreamMessageSearchListController(
-    final messageSearchBloc = MessageSearchBloc.of(context);
+    client: StreamChat.of(context).client,
-    messageSearchBloc.search(
     filter: Filter.in_(
       'cid',
       [StreamChannel.of(context).channel.cid!],
@@ -43,10 +32,14 @@ class _ChannelFileDisplayScreenState extends State<ChannelFileDisplayScreen> {
       'attachments.type',
       ['file'],
     ),
-      sort: widget.sortOptions,
+    sort: [
-      pagination: widget.paginationParams,
+      SortOption(
+        'created_at',
+        direction: SortOption.ASC,
+      ),
+    ],
+    limit: 20,
   );
-  }
 
   @override
   Widget build(BuildContext context) {
@@ -59,44 +52,22 @@ class _ChannelFileDisplayScreenState extends State<ChannelFileDisplayScreen> {
           AppLocalizations.of(context).files,
           style: TextStyle(
             color: StreamChatTheme.of(context).colorTheme.textHighEmphasis,
-              fontSize: 16.0),
+            fontSize: 16.0,
-        ),
-        leading: Center(
-          child: InkWell(
-            onTap: () {
-              Navigator.of(context).pop();
-            },
-            child: Container(
-              width: 24.0,
-              height: 24.0,
-              child: StreamSvgIcon.left(
-                color: StreamChatTheme.of(context).colorTheme.textHighEmphasis,
-                size: 24.0,
-              ),
-            ),
           ),
         ),
+        leading: StreamBackButton(),
         backgroundColor: StreamChatTheme.of(context).colorTheme.barsBg,
       ),
-      body: _buildMediaGrid(),
+      body: ValueListenableBuilder(
-    );
+        valueListenable: controller,
-  }
+        builder: (
-
+          BuildContext context,
-  Widget _buildMediaGrid() {
+          PagedValue<String, GetMessageResponse> value,
-    final messageSearchBloc = MessageSearchBloc.of(context);
+          Widget? child,
-
+        ) {
-    return StreamBuilder<List<GetMessageResponse>>(
+          return value.when(
-      builder: (context, snapshot) {
+            (items, nextPageKey, error) {
-        if (snapshot.data == null) {
+              if (items.isEmpty) {
-          return Center(
-            child: const CircularProgressIndicator(),
-          );
-        }
-
-        if (snapshot.data!.isEmpty) {
-          if (widget.emptyBuilder != null) {
-            return widget.emptyBuilder!(context);
-          }
                 return Center(
                   child: Column(
                     mainAxisAlignment: MainAxisAlignment.center,
@@ -110,8 +81,9 @@ class _ChannelFileDisplayScreenState extends State<ChannelFileDisplayScreen> {
                         AppLocalizations.of(context).noFiles,
                         style: TextStyle(
                           fontSize: 14.0,
-                    color:
+                          color: StreamChatTheme.of(context)
-                        StreamChatTheme.of(context).colorTheme.textHighEmphasis,
+                              .colorTheme
+                              .textHighEmphasis,
                         ),
                       ),
                       SizedBox(height: 8.0),
@@ -130,30 +102,22 @@ class _ChannelFileDisplayScreenState extends State<ChannelFileDisplayScreen> {
                   ),
                 );
               }
-
               final media = <Attachment, Message>{};
 
-        for (var item in snapshot.data!) {
+              for (var item in items) {
-          item.message.attachments.where((e) => e.type == 'file').forEach((e) {
+                item.message.attachments
+                    .where((e) => e.type == 'file')
+                    .forEach((e) {
                   media[e] = item.message;
                 });
               }
 
               return LazyLoadScrollView(
-          onEndOfPage: () => messageSearchBloc.search(
+                onEndOfPage: () async {
-            filter: Filter.in_(
+                  if (nextPageKey != null) {
-              'cid',
+                    controller.loadMore(nextPageKey);
-              [StreamChannel.of(context).channel.cid!],
+                  }
-            ),
+                },
-            messageFilter: Filter.in_(
-              'attachments.type',
-              ['file'],
-            ),
-            sort: widget.sortOptions,
-            pagination: widget.paginationParams.copyWith(
-              offset: messageSearchBloc.messageResponses?.length ?? 0,
-            ),
-          ),
                 child: ListView.builder(
                   itemBuilder: (context, position) {
                     return Padding(
@@ -171,7 +135,25 @@ class _ChannelFileDisplayScreenState extends State<ChannelFileDisplayScreen> {
                 ),
               );
             },
-      stream: messageSearchBloc.messagesStream,
+            loading: () => Center(
+              child: const CircularProgressIndicator(),
+            ),
+            error: (_) => Offstage(),
+          );
+        },
+      ),
     );
   }
+
+  @override
+  void dispose() {
+    controller.dispose();
+    super.dispose();
+  }
+
+  @override
+  void initState() {
+    controller.doInitialLoad();
+    super.initState();
+  }
 }

packages/stream_chat_v1/lib/channel_list.dart

@@ -278,12 +278,15 @@ class _ChannelList extends State<ChannelList> {
                       emptyBuilder: (_) {
                         return Center(
                           child: Padding(
-                            padding: EdgeInsets.all(8),
+                            padding: const EdgeInsets.all(8),
-                            child: Column(
+                            child: StreamScrollViewEmptyWidget(
-                              mainAxisAlignment: MainAxisAlignment.center,
+                              emptyIcon: StreamSvgIcon.message(
-                              children: [
+                                size: 148,
-                                Expanded(child: StreamChannelListEmptyWidget()),
+                                color: StreamChatTheme.of(context)
-                                TextButton(
+                                    .colorTheme
+                                    .disabled,
+                              ),
+                              emptyTitle: TextButton(
                                 onPressed: () {
                                   Navigator.pushNamed(
                                     context,
@@ -302,7 +305,6 @@ class _ChannelList extends State<ChannelList> {
                                       ),
                                 ),
                               ),
-                              ],
                             ),
                           ),
                         );

packages/stream_chat_v1/lib/channel_list_page.dart

@@ -100,9 +100,7 @@ class _ChannelListPageState extends State<ChannelListPage> {
       body: IndexedStack(
         index: _currentIndex,
         children: [
-          MessageSearchBloc(
+          ChannelList(),
-            child: ChannelList(),
-          ),
           UserMentionsPage(),
         ],
       ),

packages/stream_chat_v1/lib/channel_media_display_screen.dart

@@ -1,49 +1,29 @@
 import 'package:example/localizations.dart';
+import 'package:example/routes/routes.dart';
 import 'package:flutter/material.dart';
 import 'package:stream_chat_flutter/stream_chat_flutter.dart';
 import 'package:video_player/video_player.dart';
 
+import 'channel_page.dart';
+
 class ChannelMediaDisplayScreen extends StatefulWidget {
-  /// The sorting used for the channels matching the filters.
-  /// Sorting is based on field and direction, multiple sorting options can be provided.
-  /// You can sort based on last_updated, last_message_at, updated_at, created_at or member_count.
-  /// Direction can be ascending or descending.
-  final List<SortOption>? sortOptions;
-
-  /// Pagination parameters
-  /// limit: the number of users to return (max is 30)
-  /// offset: the offset (max is 1000)
-  /// message_limit: how many messages should be included to each channel
-  final PaginationParams paginationParams;
-
-  /// The builder used when the file list is empty.
-  final WidgetBuilder? emptyBuilder;
-
-  final ShowMessageCallback? onShowMessage;
-
   final StreamMessageThemeData messageTheme;
 
   const ChannelMediaDisplayScreen({
+    Key? key,
     required this.messageTheme,
-    this.sortOptions,
+  }) : super(key: key);
-    this.paginationParams = const PaginationParams(limit: 20),
-    this.emptyBuilder,
-    this.onShowMessage,
-  });
 
   @override
-  _ChannelMediaDisplayScreenState createState() =>
+  State<ChannelMediaDisplayScreen> createState() =>
       _ChannelMediaDisplayScreenState();
 }
 
 class _ChannelMediaDisplayScreenState extends State<ChannelMediaDisplayScreen> {
-  Map<String?, VideoPlayerController?> controllerCache = {};
+  final Map<String?, VideoPlayerController?> controllerCache = {};
 
-  @override
+  late final controller = StreamMessageSearchListController(
-  void initState() {
+    client: StreamChat.of(context).client,
-    super.initState();
-    final messageSearchBloc = MessageSearchBloc.of(context);
-    messageSearchBloc.search(
     filter: Filter.in_(
       'cid',
       [StreamChannel.of(context).channel.cid!],
@@ -52,10 +32,14 @@ class _ChannelMediaDisplayScreenState extends State<ChannelMediaDisplayScreen> {
       'attachments.type',
       ['image', 'video'],
     ),
-      sort: widget.sortOptions,
+    sort: [
-      pagination: widget.paginationParams,
+      SortOption(
+        'created_at',
+        direction: SortOption.ASC,
+      ),
+    ],
+    limit: 20,
   );
-  }
 
   @override
   Widget build(BuildContext context) {
@@ -74,25 +58,13 @@ class _ChannelMediaDisplayScreenState extends State<ChannelMediaDisplayScreen> {
         leading: StreamBackButton(),
         backgroundColor: StreamChatTheme.of(context).colorTheme.barsBg,
       ),
-      body: _buildMediaGrid(),
+      body: ValueListenableBuilder(
-    );
+        valueListenable: controller,
-  }
+        builder: (BuildContext context,
-
+            PagedValue<String, GetMessageResponse> value, Widget? child) {
-  Widget _buildMediaGrid() {
+          return value.when(
-    final messageSearchBloc = MessageSearchBloc.of(context);
+            (items, nextPageKey, error) {
-
+              if (items.isEmpty) {
-    return StreamBuilder<List<GetMessageResponse>>(
-      builder: (context, snapshot) {
-        if (snapshot.data == null) {
-          return Center(
-            child: const CircularProgressIndicator(),
-          );
-        }
-
-        if (snapshot.data!.isEmpty) {
-          if (widget.emptyBuilder != null) {
-            return widget.emptyBuilder!(context);
-          }
                 return Center(
                   child: Column(
                     mainAxisAlignment: MainAxisAlignment.center,
@@ -106,13 +78,15 @@ class _ChannelMediaDisplayScreenState extends State<ChannelMediaDisplayScreen> {
                         AppLocalizations.of(context).noMedia,
                         style: TextStyle(
                           fontSize: 14.0,
-                    color:
+                          color: StreamChatTheme.of(context)
-                        StreamChatTheme.of(context).colorTheme.textHighEmphasis,
+                              .colorTheme
+                              .textHighEmphasis,
                         ),
                       ),
                       SizedBox(height: 8.0),
                       Text(
-                  AppLocalizations.of(context).photosOrVideosWillAppearHere,
+                        AppLocalizations.of(context)
+                            .photosOrVideosWillAppearHere,
                         textAlign: TextAlign.center,
                         style: TextStyle(
                           fontSize: 14.0,
@@ -126,10 +100,9 @@ class _ChannelMediaDisplayScreenState extends State<ChannelMediaDisplayScreen> {
                   ),
                 );
               }
-
               final media = <_AssetPackage>[];
 
-        for (var item in snapshot.data!) {
+              for (var item in value.asSuccess.items) {
                 item.message.attachments
                     .where((e) =>
                         (e.type == 'image' || e.type == 'video') &&
@@ -152,23 +125,14 @@ class _ChannelMediaDisplayScreenState extends State<ChannelMediaDisplayScreen> {
               }
 
               return LazyLoadScrollView(
-          onEndOfPage: () => messageSearchBloc.search(
+                onEndOfPage: () async {
-            filter: Filter.in_(
+                  if (nextPageKey != null) {
-              'cid',
+                    controller.loadMore(nextPageKey);
-              [StreamChannel.of(context).channel.cid!],
+                  }
-            ),
+                },
-            messageFilter: Filter.in_(
-              'attachments.type',
-              ['image', 'video'],
-            ),
-            sort: widget.sortOptions,
-            pagination: widget.paginationParams.copyWith(
-              offset: messageSearchBloc.messageResponses?.length ?? 0,
-            ),
-          ),
                 child: GridView.builder(
-            gridDelegate:
+                  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
-                SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 3),
+                      crossAxisCount: 3),
                   itemBuilder: (context, position) {
                     var channel = StreamChannel.of(context).channel;
                     return Padding(
@@ -191,7 +155,26 @@ class _ChannelMediaDisplayScreenState extends State<ChannelMediaDisplayScreen> {
                                       .toList(),
                                   startIndex: position,
                                   userName: media[position].message.user!.name,
-                            onShowMessage: widget.onShowMessage,
+                                  onShowMessage: (m, c) async {
+                                    final client =
+                                        StreamChat.of(context).client;
+                                    final message = m;
+                                    final channel = client.channel(
+                                      c.type,
+                                      id: c.id,
+                                    );
+                                    if (channel.state == null) {
+                                      await channel.watch();
+                                    }
+                                    Navigator.pushNamed(
+                                      context,
+                                      Routes.CHANNEL_PAGE,
+                                      arguments: ChannelPageArgs(
+                                        channel: channel,
+                                        initialMessage: message,
+                                      ),
+                                    );
+                                  },
                                 ),
                               ),
                             ),
@@ -218,16 +201,26 @@ class _ChannelMediaDisplayScreenState extends State<ChannelMediaDisplayScreen> {
                 ),
               );
             },
-      stream: messageSearchBloc.messagesStream,
+            loading: () => Center(
+              child: const CircularProgressIndicator(),
+            ),
+            error: (_) => Offstage(),
+          );
+        },
+      ),
     );
   }
 
   @override
   void dispose() {
+    controller.dispose();
     super.dispose();
-    for (var c in controllerCache.values) {
-      c!.dispose();
   }
+
+  @override
+  void initState() {
+    controller.doInitialLoad();
+    super.initState();
   }
 }
 

packages/stream_chat_v1/lib/channel_page.dart

@@ -35,7 +35,7 @@ class ChannelPage extends StatefulWidget {
 
 class _ChannelPageState extends State<ChannelPage> {
   FocusNode? _focusNode;
-  MessageInputController _messageInputController = MessageInputController();
+  StreamMessageInputController _messageInputController = StreamMessageInputController();
 
   @override
   void initState() {

packages/stream_chat_v1/lib/chat_info_screen.dart

@@ -218,36 +218,7 @@ class _ChatInfoScreenState extends State<ChatInfoScreen> {
               MaterialPageRoute(
                 builder: (context) => StreamChannel(
                   channel: channel,
-                  child: MessageSearchBloc(
+                  child: PinnedMessagesScreen(),
-                    child: PinnedMessagesScreen(
-                      messageTheme: widget.messageTheme,
-                      sortOptions: [
-                        SortOption(
-                          'created_at',
-                          direction: SortOption.ASC,
-                        ),
-                      ],
-                      onShowMessage: (m, c) async {
-                        final client = StreamChat.of(context).client;
-                        final message = m;
-                        final channel = client.channel(
-                          c.type,
-                          id: c.id,
-                        );
-                        if (channel.state == null) {
-                          await channel.watch();
-                        }
-                        Navigator.pushNamed(
-                          context,
-                          Routes.CHANNEL_PAGE,
-                          arguments: ChannelPageArgs(
-                            channel: channel,
-                            initialMessage: message,
-                          ),
-                        );
-                      },
-                    ),
-                  ),
                 ),
               ),
             );
@@ -278,35 +249,8 @@ class _ChatInfoScreenState extends State<ChatInfoScreen> {
               MaterialPageRoute(
                 builder: (context) => StreamChannel(
                   channel: channel,
-                  child: MessageSearchBloc(
                   child: ChannelMediaDisplayScreen(
                     messageTheme: widget.messageTheme,
-                      sortOptions: [
-                        SortOption(
-                          'created_at',
-                          direction: SortOption.ASC,
-                        ),
-                      ],
-                      onShowMessage: (m, c) async {
-                        final client = StreamChat.of(context).client;
-                        final message = m;
-                        final channel = client.channel(
-                          c.type,
-                          id: c.id,
-                        );
-                        if (channel.state == null) {
-                          await channel.watch();
-                        }
-                        Navigator.pushNamed(
-                          context,
-                          Routes.CHANNEL_PAGE,
-                          arguments: ChannelPageArgs(
-                            channel: channel,
-                            initialMessage: message,
-                          ),
-                        );
-                      },
-                    ),
                   ),
                 ),
               ),
@@ -338,15 +282,8 @@ class _ChatInfoScreenState extends State<ChatInfoScreen> {
               MaterialPageRoute(
                 builder: (context) => StreamChannel(
                   channel: channel,
-                  child: MessageSearchBloc(
                   child: ChannelFileDisplayScreen(
-                      sortOptions: [
+                    messageTheme: widget.messageTheme,
-                        SortOption(
-                          'created_at',
-                          direction: SortOption.ASC,
-                        ),
-                      ],
-                    ),
                   ),
                 ),
               ),

packages/stream_chat_v1/lib/group_info_screen.dart

@@ -40,16 +40,52 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
 
   ValueNotifier<bool?> mutedBool = ValueNotifier(false);
 
+  late final channel = StreamChannel.of(context).channel;
+
+  late final userListController = StreamUserListController(
+    client: StreamChat.of(context).client,
+    limit: 25,
+    filter: Filter.and(
+      [
+        if (_searchController!.text.isNotEmpty)
+          Filter.autoComplete('name', _userNameQuery),
+        Filter.notIn('id', [
+          StreamChat.of(context).currentUser!.id,
+          ...channel.state!.members
+              .map<String?>(((e) => e.userId))
+              .whereType<String>(),
+        ]),
+      ],
+    ),
+    sort: [
+      SortOption(
+        'name',
+        direction: 1,
+      ),
+    ],
+  );
+
   void _userNameListener() {
     if (_searchController!.text == _userNameQuery) {
       return;
     }
     if (_debounce?.isActive ?? false) _debounce!.cancel();
     _debounce = Timer(const Duration(milliseconds: 350), () {
-      if (mounted && modalSetStateCallback != null) {
+      if (mounted) {
-        modalSetStateCallback!(() {
         _userNameQuery = _searchController!.text;
-        });
+        userListController.filter = Filter.and(
+          [
+            if (_searchController!.text.isNotEmpty)
+              Filter.autoComplete('name', _userNameQuery),
+            Filter.notIn('id', [
+              StreamChat.of(context).currentUser!.id,
+              ...channel.state!.members
+                  .map<String?>(((e) => e.userId))
+                  .whereType<String>(),
+            ]),
+          ],
+        );
+        userListController.doInitialLoad();
       }
     });
   }
@@ -57,25 +93,28 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
   @override
   void initState() {
     super.initState();
-    var channel = StreamChannel.of(context);
+
     _nameController = TextEditingController.fromValue(
-      TextEditingValue(
+      TextEditingValue(text: (channel.extraData['name'] as String?) ?? ''),
-          text: (channel.channel.extraData['name'] as String?) ?? ''),
     );
     _searchController = TextEditingController()..addListener(_userNameListener);
 
     _nameController!.addListener(() {
       setState(() {});
     });
-    mutedBool = ValueNotifier(StreamChannel.of(context).channel.isMuted);
+    mutedBool = ValueNotifier(channel.isMuted);
+  }
+
+  @override
+  void dispose() {
+    userListController.dispose();
+    super.dispose();
   }
 
   @override
   Widget build(BuildContext context) {
-    var channel = StreamChannel.of(context);
-
     return StreamBuilder<List<Member>>(
-        stream: channel.channel.state!.membersStream,
+        stream: channel.state!.membersStream,
         builder: (context, snapshot) {
           if (!snapshot.hasData) {
             return Container(
@@ -94,7 +133,7 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
               title: Column(
                 children: [
                   StreamBuilder<ChannelState>(
-                      stream: channel.channelStateStream,
+                      stream: channel.state?.channelStateStream,
                       builder: (context, state) {
                         if (!state.hasData) {
                           return Text(
@@ -131,7 +170,7 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
                     height: 3.0,
                   ),
                   Text(
-                    '${channel.channel.memberCount} ${AppLocalizations.of(context).members}, ${snapshot.data?.where((e) => e.user!.online).length ?? 0} ${AppLocalizations.of(context).online}',
+                    '${channel.memberCount} ${AppLocalizations.of(context).members}, ${snapshot.data?.where((e) => e.user!.online).length ?? 0} ${AppLocalizations.of(context).online}',
                     style: TextStyle(
                       color: StreamChatTheme.of(context)
                           .colorTheme
@@ -144,7 +183,7 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
               ),
               centerTitle: true,
               actions: [
-                if (channel.channel.ownCapabilities
+                if (channel.ownCapabilities
                     .contains(PermissionType.updateChannelMembers))
                   StreamNeumorphicButton(
                     child: InkWell(
@@ -169,7 +208,7 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
                   height: 8.0,
                   color: StreamChatTheme.of(context).colorTheme.disabled,
                 ),
-                if (channel.channel.ownCapabilities
+                if (channel.ownCapabilities
                     .contains(PermissionType.updateChannel))
                   _buildNameTile(),
                 _buildOptionListTiles(),
@@ -336,7 +375,6 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
   }
 
   Widget _buildNameTile() {
-    var channel = StreamChannel.of(context).channel;
     var channelName = (channel.extraData['name'] as String?) ?? '';
 
     return Material(
@@ -412,7 +450,7 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
                         size: 24.0,
                       ),
                       onTap: () {
-                        StreamChannel.of(context).channel.update({
+                        channel.update({
                           'name': _nameController!.text.trim(),
                         }).catchError((err) {
                           setState(() {
@@ -432,8 +470,6 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
   }
 
   Widget _buildOptionListTiles() {
-    var channel = StreamChannel.of(context);
-
     return Column(
       children: [
         // OptionListTile(
@@ -448,10 +484,9 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
         //   ),
         //   onTap: () {},
         // ),
-        if (channel.channel.ownCapabilities
+        if (channel.ownCapabilities.contains(PermissionType.muteChannel))
-            .contains(PermissionType.muteChannel))
           StreamBuilder<bool>(
-              stream: StreamChannel.of(context).channel.isMutedStream,
+              stream: channel.isMutedStream,
               builder: (context, snapshot) {
                 mutedBool.value = snapshot.data;
 
@@ -482,9 +517,9 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
                                 mutedBool.value = val;
 
                                 if (snapshot.data!) {
-                                  channel.channel.unmute();
+                                  channel.unmute();
                                 } else {
-                                  channel.channel.mute();
+                                  channel.mute();
                                 }
                               },
                             );
@@ -517,36 +552,7 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
               MaterialPageRoute(
                 builder: (context) => StreamChannel(
                   channel: channel,
-                  child: MessageSearchBloc(
+                  child: PinnedMessagesScreen(),
-                    child: PinnedMessagesScreen(
-                      messageTheme: widget.messageTheme,
-                      sortOptions: [
-                        SortOption(
-                          'created_at',
-                          direction: SortOption.ASC,
-                        ),
-                      ],
-                      onShowMessage: (m, c) async {
-                        final client = StreamChat.of(context).client;
-                        final message = m;
-                        final channel = client.channel(
-                          c.type,
-                          id: c.id,
-                        );
-                        if (channel.state == null) {
-                          await channel.watch();
-                        }
-                        Navigator.pushNamed(
-                          context,
-                          Routes.CHANNEL_PAGE,
-                          arguments: ChannelPageArgs(
-                            channel: channel,
-                            initialMessage: message,
-                          ),
-                        );
-                      },
-                    ),
-                  ),
                 ),
               ),
             );
@@ -578,36 +584,8 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
               MaterialPageRoute(
                 builder: (context) => StreamChannel(
                   channel: channel,
-                  child: MessageSearchBloc(
                   child: ChannelMediaDisplayScreen(
                     messageTheme: widget.messageTheme,
-                      sortOptions: [
-                        SortOption(
-                          'created_at',
-                          direction: SortOption.ASC,
-                        ),
-                      ],
-                      paginationParams: PaginationParams(limit: 20),
-                      onShowMessage: (m, c) async {
-                        final client = StreamChat.of(context).client;
-                        final message = m;
-                        final channel = client.channel(
-                          c.type,
-                          id: c.id,
-                        );
-                        if (channel.state == null) {
-                          await channel.watch();
-                        }
-                        await Navigator.pushNamed(
-                          context,
-                          Routes.CHANNEL_PAGE,
-                          arguments: ChannelPageArgs(
-                            channel: channel,
-                            initialMessage: message,
-                          ),
-                        );
-                      },
-                    ),
                   ),
                 ),
               ),
@@ -640,25 +618,16 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
               MaterialPageRoute(
                 builder: (context) => StreamChannel(
                   channel: channel,
-                  child: MessageSearchBloc(
                   child: ChannelFileDisplayScreen(
-                      sortOptions: [
+                    messageTheme: widget.messageTheme,
-                        SortOption(
-                          'created_at',
-                          direction: SortOption.ASC,
-                        ),
-                      ],
-                      paginationParams: PaginationParams(limit: 20),
-                    ),
                   ),
                 ),
               ),
             );
           },
         ),
-        if (!channel.channel.isDistinct &&
+        if (!channel.isDistinct &&
-            channel.channel.ownCapabilities
+            channel.ownCapabilities.contains(PermissionType.leaveChannel))
-                .contains(PermissionType.leaveChannel))
           StreamOptionListTile(
             tileColor: StreamChatTheme.of(context).colorTheme.appBg,
             separatorColor: StreamChatTheme.of(context).colorTheme.disabled,
@@ -703,37 +672,11 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
   }
 
   void _buildAddUserModal(context) {
-    var channel = StreamChannel.of(context).channel;
-    final userListController = StreamUserListController(
-      client: channel.client,
-      limit: 25,
-      filter: Filter.and(
-        [
-          if (_searchController!.text.isNotEmpty)
-            Filter.autoComplete('name', _userNameQuery),
-          Filter.notIn('id', [
-            StreamChat.of(context).currentUser!.id,
-            ...channel.state!.members
-                .map<String?>(((e) => e.userId))
-                .whereType<String>(),
-          ]),
-        ],
-      ),
-      sort: [
-        SortOption(
-          'name',
-          direction: 1,
-        ),
-      ],
-    );
-
     showDialog(
       useRootNavigator: false,
       context: context,
       barrierColor: StreamChatTheme.of(context).colorTheme.overlay,
       builder: (context) {
-        return StatefulBuilder(builder: (context, modalSetState) {
-          modalSetStateCallback = modalSetState;
         return Padding(
           padding: EdgeInsets.only(top: 16.0, left: 8.0, right: 8.0),
           child: Material(
@@ -747,10 +690,10 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
                 children: [
                   Padding(
                     padding: const EdgeInsets.all(16),
-                      child: _buildTextInputSection(modalSetState),
+                    child: _buildTextInputSection(),
                   ),
                   Expanded(
-                      child: StreamUserListView(
+                    child: StreamUserGridView(
                       controller: userListController,
                       onUserTap: (user) async {
                         _searchController!.clear();
@@ -797,12 +740,13 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
             ),
           ),
         );
-        });
       },
-    ).then((_) => userListController.dispose());
+    ).whenComplete(() {
+      _searchController?.clear();
+    });
   }
 
-  Widget _buildTextInputSection(modalSetState) {
+  Widget _buildTextInputSection() {
     final theme = StreamChatTheme.of(context);
     return Column(
       children: [
@@ -862,7 +806,6 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
   }
 
   void _showUserInfoModal(User? user, bool isUserAdmin) {
-    var channel = StreamChannel.of(context).channel;
     final color = StreamChatTheme.of(context).colorTheme.barsBg;
 
     showModalBottomSheet(

packages/stream_chat_v1/lib/pinned_messages_screen.dart

@@ -1,48 +1,18 @@
 import 'package:example/localizations.dart';
+import 'package:example/routes/routes.dart';
 import 'package:flutter/material.dart';
 import 'package:stream_chat_flutter/stream_chat_flutter.dart';
-import 'package:video_player/video_player.dart';
+
+import 'channel_page.dart';
 
 class PinnedMessagesScreen extends StatefulWidget {
-  /// The sorting used for the channels matching the filters.
-  /// Sorting is based on field and direction, multiple sorting options can be provided.
-  /// You can sort based on last_updated, last_message_at, updated_at, created_at or member_count.
-  /// Direction can be ascending or descending.
-  final List<SortOption>? sortOptions;
-
-  /// Pagination parameters
-  /// limit: the number of users to return (max is 30)
-  /// offset: the offset (max is 1000)
-  /// message_limit: how many messages should be included to each channel
-  final PaginationParams paginationParams;
-
-  /// The builder used when the file list is empty.
-  final WidgetBuilder? emptyBuilder;
-
-  final ShowMessageCallback? onShowMessage;
-
-  final StreamMessageThemeData messageTheme;
-
-  const PinnedMessagesScreen({
-    required this.messageTheme,
-    this.sortOptions,
-    this.paginationParams = const PaginationParams(limit: 20),
-    this.emptyBuilder,
-    this.onShowMessage,
-  });
-
   @override
-  _PinnedMessagesScreenState createState() => _PinnedMessagesScreenState();
+  State<PinnedMessagesScreen> createState() => _PinnedMessagesScreenState();
 }
 
 class _PinnedMessagesScreenState extends State<PinnedMessagesScreen> {
-  Map<String?, VideoPlayerController?> controllerCache = {};
+  late final controller = StreamMessageSearchListController(
-
+    client: StreamChat.of(context).client,
-  @override
-  void initState() {
-    super.initState();
-    final messageSearchBloc = MessageSearchBloc.of(context);
-    messageSearchBloc.search(
     filter: Filter.in_(
       'cid',
       [StreamChannel.of(context).channel.cid!],
@@ -51,10 +21,14 @@ class _PinnedMessagesScreenState extends State<PinnedMessagesScreen> {
       'pinned',
       true,
     ),
-      sort: widget.sortOptions,
+    sort: [
-      pagination: widget.paginationParams,
+      SortOption(
+        'created_at',
+        direction: SortOption.ASC,
+      ),
+    ],
+    limit: 20,
   );
-  }
 
   @override
   Widget build(BuildContext context) {
@@ -73,25 +47,9 @@ class _PinnedMessagesScreenState extends State<PinnedMessagesScreen> {
         leading: StreamBackButton(),
         backgroundColor: StreamChatTheme.of(context).colorTheme.barsBg,
       ),
-      body: _buildMediaGrid(),
+      body: StreamMessageSearchListView(
-    );
+        controller: controller,
-  }
+        emptyBuilder: (_) {
-
-  Widget _buildMediaGrid() {
-    final messageSearchBloc = MessageSearchBloc.of(context);
-
-    return StreamBuilder<List<GetMessageResponse>>(
-      builder: (context, snapshot) {
-        if (snapshot.data == null) {
-          return Center(
-            child: const CircularProgressIndicator(),
-          );
-        }
-
-        if (snapshot.data!.isEmpty) {
-          if (widget.emptyBuilder != null) {
-            return widget.emptyBuilder!(context);
-          }
           return Center(
             child: Column(
               mainAxisAlignment: MainAxisAlignment.center,
@@ -140,74 +98,33 @@ class _PinnedMessagesScreenState extends State<PinnedMessagesScreen> {
               ],
             ),
           );
+        },
+        onMessageTap: (messageResponse) async {
+          final client = StreamChat.of(context).client;
+          final message = messageResponse.message;
+          final channel = client.channel(
+            messageResponse.channel!.type,
+            id: messageResponse.channel!.id,
+          );
+          if (channel.state == null) {
+            await channel.watch();
           }
-
+          Navigator.pushNamed(
-        var data = snapshot.data ?? [];
+            context,
-
+            Routes.CHANNEL_PAGE,
-        return LazyLoadScrollView(
+            arguments: ChannelPageArgs(
-          onEndOfPage: () => messageSearchBloc.search(
+              channel: channel,
-            filter: Filter.in_(
+              initialMessage: message,
-              'cid',
-              [StreamChannel.of(context).channel.cid!],
-            ),
-            messageFilter: Filter.equal(
-              'pinned',
-              true,
-            ),
-            sort: widget.sortOptions,
-            pagination: widget.paginationParams.copyWith(
-              offset: messageSearchBloc.messageResponses?.length ?? 0,
-            ),
-          ),
-          child: ListView.builder(
-            itemBuilder: (context, position) {
-              var user = data[position].message.user!;
-              var attachments = data[position].message.attachments;
-              var text = data[position].message.text ?? '';
-
-              return ListTile(
-                leading: StreamUserAvatar(
-                  user: user,
-                  constraints: BoxConstraints.tightFor(
-                    width: 40.0,
-                    height: 40.0,
-                  ),
-                  borderRadius: BorderRadius.circular(28),
-                ),
-                title: Text(
-                  user.name,
-                  style: TextStyle(
-                      color: StreamChatTheme.of(context)
-                          .colorTheme
-                          .textHighEmphasis,
-                      fontWeight: FontWeight.bold),
-                ),
-                subtitle: Text(
-                  text != ''
-                      ? text
-                      : (attachments.isNotEmpty
-                          ? '${attachments.length} ${attachments.length > 1 ? AppLocalizations.of(context).attachments : AppLocalizations.of(context).attachment}'
-                          : ''),
-                ),
-                onTap: () {
-                  widget.onShowMessage?.call(data[position].message,
-                      StreamChannel.of(context).channel);
-                },
-              );
-            },
-            itemCount: snapshot.data!.length,
             ),
           );
         },
-      stream: messageSearchBloc.messagesStream,
+      ),
     );
   }
 
   @override
   void dispose() {
+    controller.dispose();
     super.dispose();
-    for (var c in controllerCache.values) {
-      c!.dispose();
-    }
   }
 }

packages/stream_chat_v1/lib/thread_page.dart

@@ -19,12 +19,13 @@ class ThreadPage extends StatefulWidget {
 
 class _ThreadPageState extends State<ThreadPage> {
   FocusNode _focusNode = FocusNode();
-  late MessageInputController _messageInputController;
+  late StreamMessageInputController _messageInputController;
 
   @override
   void initState() {
     super.initState();
-    _messageInputController = MessageInputController(message: widget.parent);
+    _messageInputController =
+        StreamMessageInputController(message: widget.parent);
   }
 
   @override