Merge pull request #39 from GetStream/ref/segregate-api-layer

align with main repo ref/segregate-api-layer

packages/stream_chat_v1/lib/advanced_options_page.dart

@@ -1,3 +1,4 @@
+import 'package:example/home_page.dart';
 import 'package:example/routes/routes.dart';
 import 'package:example/stream_version.dart';
 import 'package:flutter/material.dart';
@@ -306,7 +307,6 @@ class _AdvancedOptionsPageState extends State<AdvancedOptionsPage> {
                             key: kStreamToken,
                             value: userToken,
                           );
-                          await client.disconnect();
                         } catch (e) {
                           var errorText = 'Error connecting, retry';
                           if (e is Map) {
@@ -317,15 +317,14 @@ class _AdvancedOptionsPageState extends State<AdvancedOptionsPage> {
                             _apiKeyError = errorText.toUpperCase();
                           });
                           loading = false;
-                          await client.disconnect();
                           return;
                         }
                         loading = false;
                         await Navigator.pushNamedAndRemoveUntil(
                           context,
-                          Routes.APP,
+                          Routes.HOME,
-                          ModalRoute.withName(Routes.APP),
+                          ModalRoute.withName(Routes.HOME),
-                          arguments: client,
+                          arguments: HomePageArgs(client),
                         );
                       }
                     },

packages/stream_chat_v1/lib/channel_list.dart

@@ -0,0 +1,199 @@
+import 'dart:async';
+
+import 'package:example/routes/routes.dart';
+import 'package:example/search_text_field.dart';
+import 'package:flutter/material.dart';
+import 'package:stream_chat_flutter/stream_chat_flutter.dart';
+
+import 'channel_page.dart';
+import 'chat_info_screen.dart';
+import 'group_info_screen.dart';
+
+class ChannelList extends StatefulWidget {
+  @override
+  _ChannelList createState() => _ChannelList();
+}
+
+class _ChannelList extends State<ChannelList> {
+  TextEditingController? _controller;
+
+  String _channelQuery = '';
+
+  bool _isSearchActive = false;
+
+  Timer? _debounce;
+
+  void _channelQueryListener() {
+    if (_debounce?.isActive ?? false) _debounce!.cancel();
+    _debounce = Timer(const Duration(milliseconds: 350), () {
+      if (mounted) {
+        setState(() {
+          _channelQuery = _controller!.text;
+          _isSearchActive = _channelQuery.isNotEmpty;
+        });
+      }
+    });
+  }
+
+  @override
+  void initState() {
+    super.initState();
+    _controller = TextEditingController()..addListener(_channelQueryListener);
+  }
+
+  @override
+  void dispose() {
+    _controller?.removeListener(_channelQueryListener);
+    _controller?.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final user = StreamChat.of(context).user;
+    return WillPopScope(
+      onWillPop: () async {
+        if (_isSearchActive) {
+          _controller!.clear();
+          setState(() => _isSearchActive = false);
+          return false;
+        }
+        return true;
+      },
+      child: ChannelsBloc(
+        child: MessageSearchBloc(
+          child: NestedScrollView(
+            floatHeaderSlivers: true,
+            headerSliverBuilder: (_, __) => [
+              SliverToBoxAdapter(
+                child: SearchTextField(
+                  controller: _controller,
+                  showCloseButton: _isSearchActive,
+                ),
+              ),
+            ],
+            body: AnimatedSwitcher(
+              duration: const Duration(milliseconds: 350),
+              child: GestureDetector(
+                behavior: HitTestBehavior.opaque,
+                onPanDown: (_) => FocusScope.of(context).unfocus(),
+                child: _isSearchActive
+                    ? MessageSearchListView(
+                        showErrorTile: true,
+                        messageQuery: _channelQuery,
+                        filters: Filter.in_('members', [user!.id]),
+                        sortOptions: [
+                          SortOption(
+                            'created_at',
+                            direction: SortOption.ASC,
+                          ),
+                        ],
+                        pullToRefresh: false,
+                        paginationParams: PaginationParams(limit: 20),
+                        emptyBuilder: (_) {
+                          return LayoutBuilder(
+                            builder: (context, viewportConstraints) {
+                              return SingleChildScrollView(
+                                physics: AlwaysScrollableScrollPhysics(),
+                                child: ConstrainedBox(
+                                  constraints: BoxConstraints(
+                                    minHeight: viewportConstraints.maxHeight,
+                                  ),
+                                  child: Center(
+                                    child: Column(
+                                      children: [
+                                        Padding(
+                                          padding: const EdgeInsets.all(24),
+                                          child: StreamSvgIcon.search(
+                                            size: 96,
+                                            color: Colors.grey,
+                                          ),
+                                        ),
+                                        Text(
+                                          'No results...',
+                                        ),
+                                      ],
+                                    ),
+                                  ),
+                                ),
+                              );
+                            },
+                          );
+                        },
+                        onItemTap: (messageResponse) async {
+                          FocusScope.of(context).requestFocus(FocusNode());
+                          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(
+                            context,
+                            Routes.CHANNEL_PAGE,
+                            arguments: ChannelPageArgs(
+                              channel: channel,
+                              initialMessage: message,
+                            ),
+                          );
+                        },
+                      )
+                    : ChannelListView(
+                        onStartChatPressed: () {
+                          Navigator.pushNamed(context, Routes.NEW_CHAT);
+                        },
+                        swipeToAction: true,
+                        filter: Filter.in_('members', [user!.id]),
+                        presence: true,
+                        pagination: PaginationParams(
+                          limit: 20,
+                        ),
+                        channelWidget: ChannelPage(),
+                        onViewInfoTap: (channel) {
+                          Navigator.pop(context);
+                          if (channel.memberCount == 2 && channel.isDistinct) {
+                            Navigator.push(
+                              context,
+                              MaterialPageRoute(
+                                builder: (context) => StreamChannel(
+                                  channel: channel,
+                                  child: ChatInfoScreen(
+                                    messageTheme: StreamChatTheme.of(context)
+                                        .ownMessageTheme,
+                                    user: channel.state!.members
+                                        .where((m) =>
+                                            m.userId !=
+                                            channel.client.state.user!.id)
+                                        .first
+                                        .user,
+                                  ),
+                                ),
+                              ),
+                            );
+                          } else {
+                            Navigator.push(
+                              context,
+                              MaterialPageRoute(
+                                builder: (context) => StreamChannel(
+                                  channel: channel,
+                                  child: GroupInfoScreen(
+                                    messageTheme: StreamChatTheme.of(context)
+                                        .ownMessageTheme,
+                                  ),
+                                ),
+                              ),
+                            );
+                          }
+                        },
+                      ),
+              ),
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}

packages/stream_chat_v1/lib/channel_list_page.dart

@@ -0,0 +1,281 @@
+import 'dart:async';
+
+import 'package:example/routes/routes.dart';
+import 'package:example/user_mentions_page.dart';
+import 'package:flutter/foundation.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_app_badger/flutter_app_badger.dart';
+import 'package:flutter_secure_storage/flutter_secure_storage.dart';
+import 'package:stream_chat_flutter/stream_chat_flutter.dart';
+import 'package:streaming_shared_preferences/streaming_shared_preferences.dart';
+
+import 'channel_list.dart';
+
+class ChannelListPage extends StatefulWidget {
+  const ChannelListPage({
+    Key? key,
+  }) : super(key: key);
+
+  @override
+  _ChannelListPageState createState() => _ChannelListPageState();
+}
+
+class _ChannelListPageState extends State<ChannelListPage> {
+  int _currentIndex = 0;
+
+  bool _isSelected(int index) => _currentIndex == index;
+
+  List<BottomNavigationBarItem> get _navBarItems {
+    return <BottomNavigationBarItem>[
+      BottomNavigationBarItem(
+        icon: Stack(
+          clipBehavior: Clip.none,
+          children: [
+            StreamSvgIcon.message(
+              color: _isSelected(0)
+                  ? StreamChatTheme.of(context).colorTheme.black
+                  : Colors.grey,
+            ),
+            Positioned(
+              top: -3,
+              right: -16,
+              child: UnreadIndicator(),
+            ),
+          ],
+        ),
+        label: 'Chats',
+      ),
+      BottomNavigationBarItem(
+        icon: Stack(
+          clipBehavior: Clip.none,
+          children: [
+            StreamSvgIcon.mentions(
+              color: _isSelected(1)
+                  ? StreamChatTheme.of(context).colorTheme.black
+                  : Colors.grey,
+            ),
+          ],
+        ),
+        label: 'Mentions',
+      ),
+    ];
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final user = StreamChat.of(context).user;
+    if (user == null) {
+      return Offstage();
+    }
+    return Scaffold(
+      backgroundColor: StreamChatTheme.of(context).colorTheme.whiteSnow,
+      appBar: ChannelListHeader(
+        onNewChatButtonTap: () {
+          Navigator.pushNamed(context, Routes.NEW_CHAT);
+        },
+        preNavigationCallback: () {
+          FocusScope.of(context).requestFocus(FocusNode());
+        },
+      ),
+      drawer: LeftDrawer(
+        user: user,
+      ),
+      drawerEdgeDragWidth: 50,
+      bottomNavigationBar: BottomNavigationBar(
+        backgroundColor: StreamChatTheme.of(context).colorTheme.white,
+        currentIndex: _currentIndex,
+        items: _navBarItems,
+        selectedLabelStyle: StreamChatTheme.of(context).textTheme.footnoteBold,
+        unselectedLabelStyle:
+            StreamChatTheme.of(context).textTheme.footnoteBold,
+        type: BottomNavigationBarType.fixed,
+        selectedItemColor: StreamChatTheme.of(context).colorTheme.black,
+        unselectedItemColor: Colors.grey,
+        onTap: (index) {
+          setState(() => _currentIndex = index);
+        },
+      ),
+      body: IndexedStack(
+        index: _currentIndex,
+        children: [
+          ChannelList(),
+          UserMentionsPage(),
+        ],
+      ),
+    );
+  }
+
+  StreamSubscription<int>? badgeListener;
+
+  @override
+  void initState() {
+    if (!kIsWeb) {
+      badgeListener = StreamChat.of(context)
+          .client
+          .state
+          .totalUnreadCountStream
+          .listen((count) {
+        if (count > 0) {
+          FlutterAppBadger.updateBadgeCount(count);
+        } else {
+          FlutterAppBadger.removeBadge();
+        }
+      });
+    }
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    badgeListener?.cancel();
+    super.dispose();
+  }
+}
+
+class LeftDrawer extends StatelessWidget {
+  const LeftDrawer({
+    Key? key,
+    required this.user,
+  }) : super(key: key);
+
+  final User user;
+
+  @override
+  Widget build(BuildContext context) {
+    return Drawer(
+      child: Container(
+        color: StreamChatTheme.of(context).colorTheme.white,
+        child: SafeArea(
+          child: Padding(
+            padding: EdgeInsets.only(
+              top: MediaQuery.of(context).viewPadding.top + 8,
+            ),
+            child: Column(
+              children: [
+                Padding(
+                  padding: const EdgeInsets.only(
+                    bottom: 20.0,
+                    left: 8,
+                  ),
+                  child: Row(
+                    children: [
+                      UserAvatar(
+                        user: user,
+                        showOnlineStatus: false,
+                        constraints: BoxConstraints.tight(Size.fromRadius(20)),
+                      ),
+                      Padding(
+                        padding: const EdgeInsets.only(left: 16.0),
+                        child: Text(
+                          user.name,
+                          style: TextStyle(
+                            fontSize: 16,
+                            fontWeight: FontWeight.bold,
+                          ),
+                        ),
+                      ),
+                    ],
+                  ),
+                ),
+                ListTile(
+                  leading: StreamSvgIcon.penWrite(
+                    color: StreamChatTheme.of(context)
+                        .colorTheme
+                        .black
+                        .withOpacity(.5),
+                  ),
+                  onTap: () {
+                    Navigator.popAndPushNamed(
+                      context,
+                      Routes.NEW_CHAT,
+                    );
+                  },
+                  title: Text(
+                    'New direct message',
+                    style: TextStyle(
+                      fontSize: 14.5,
+                    ),
+                  ),
+                ),
+                ListTile(
+                  leading: StreamSvgIcon.contacts(
+                    color: StreamChatTheme.of(context)
+                        .colorTheme
+                        .black
+                        .withOpacity(.5),
+                  ),
+                  onTap: () {
+                    Navigator.popAndPushNamed(
+                      context,
+                      Routes.NEW_GROUP_CHAT,
+                    );
+                  },
+                  title: Text(
+                    'New group',
+                    style: TextStyle(
+                      fontSize: 14.5,
+                    ),
+                  ),
+                ),
+                Expanded(
+                  child: Container(
+                    alignment: Alignment.bottomCenter,
+                    child: ListTile(
+                      onTap: () async {
+                        Navigator.pop(context);
+
+                        if (!kIsWeb) {
+                          final secureStorage = FlutterSecureStorage();
+                          await secureStorage.deleteAll();
+                        }
+
+                        final client = StreamChat.of(context).client;
+                        client.disconnectUser();
+                        await client.dispose();
+
+                        await Navigator.of(
+                          context,
+                          rootNavigator: true,
+                        ).pushNamedAndRemoveUntil(
+                          Routes.CHOOSE_USER,
+                          ModalRoute.withName(Routes.CHOOSE_USER),
+                        );
+                      },
+                      leading: StreamSvgIcon.user(
+                        color: StreamChatTheme.of(context)
+                            .colorTheme
+                            .black
+                            .withOpacity(.5),
+                      ),
+                      title: Text(
+                        'Sign out',
+                        style: TextStyle(
+                          fontSize: 14.5,
+                        ),
+                      ),
+                      trailing: IconButton(
+                        icon: StreamSvgIcon.iconMoon(
+                          size: 24,
+                        ),
+                        color: StreamChatTheme.of(context).colorTheme.grey,
+                        onPressed: () async {
+                          final sp = await StreamingSharedPreferences.instance;
+                          sp.setInt(
+                            'theme',
+                            Theme.of(context).brightness == Brightness.dark
+                                ? 1
+                                : -1,
+                          );
+                        },
+                      ),
+                    ),
+                  ),
+                ),
+              ],
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}

packages/stream_chat_v1/lib/channel_media_display_screen.dart

@@ -71,21 +71,7 @@ class _ChannelMediaDisplayScreenState extends State<ChannelMediaDisplayScreen> {
             fontSize: 16.0,
           ),
         ),
-        leading: Center(
+        leading: StreamBackButton(),
-          child: InkWell(
-            onTap: () {
-              Navigator.of(context).pop();
-            },
-            child: Container(
-              width: 24.0,
-              height: 24.0,
-              child: StreamSvgIcon.left(
-                color: StreamChatTheme.of(context).colorTheme.black,
-                size: 24.0,
-              ),
-            ),
-          ),
-        ),
         backgroundColor: StreamChatTheme.of(context).colorTheme.white,
       ),
       body: _buildMediaGrid(),

packages/stream_chat_v1/lib/channel_page.dart

@@ -0,0 +1,183 @@
+import 'package:collection/collection.dart';
+import 'package:example/routes/routes.dart';
+import 'package:example/thread_page.dart';
+import 'package:flutter/material.dart';
+import 'package:stream_chat_flutter/stream_chat_flutter.dart';
+
+import 'chat_info_screen.dart';
+import 'group_info_screen.dart';
+
+class ChannelPageArgs {
+  final Channel? channel;
+  final Message? initialMessage;
+
+  const ChannelPageArgs({
+    this.channel,
+    this.initialMessage,
+  });
+}
+
+class ChannelPage extends StatefulWidget {
+  final int? initialScrollIndex;
+  final double? initialAlignment;
+  final bool highlightInitialMessage;
+
+  const ChannelPage({
+    Key? key,
+    this.initialScrollIndex,
+    this.initialAlignment,
+    this.highlightInitialMessage = false,
+  }) : super(key: key);
+
+  @override
+  _ChannelPageState createState() => _ChannelPageState();
+}
+
+class _ChannelPageState extends State<ChannelPage> {
+  Message? _quotedMessage;
+  FocusNode? _focusNode;
+
+  @override
+  void initState() {
+    _focusNode = FocusNode();
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    _focusNode!.dispose();
+    super.dispose();
+  }
+
+  void _reply(Message message) {
+    setState(() => _quotedMessage = message);
+    WidgetsBinding.instance!.addPostFrameCallback((timeStamp) {
+      _focusNode!.requestFocus();
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      backgroundColor: StreamChatTheme.of(context).colorTheme.whiteSnow,
+      appBar: ChannelHeader(
+        showTypingIndicator: false,
+        onImageTap: () async {
+          var channel = StreamChannel.of(context).channel;
+
+          if (channel.memberCount == 2 && channel.isDistinct) {
+            final currentUser = StreamChat.of(context).user;
+            final otherUser = channel.state!.members.firstWhereOrNull(
+              (element) => element.user!.id != currentUser!.id,
+            );
+            if (otherUser != null) {
+              final pop = await Navigator.push(
+                context,
+                MaterialPageRoute(
+                  builder: (context) => StreamChannel(
+                    child: ChatInfoScreen(
+                      messageTheme: StreamChatTheme.of(context).ownMessageTheme,
+                      user: otherUser.user,
+                    ),
+                    channel: channel,
+                  ),
+                ),
+              );
+
+              if (pop == true) {
+                Navigator.pop(context);
+              }
+            }
+          } else {
+            await Navigator.push(
+              context,
+              MaterialPageRoute(
+                builder: (context) => StreamChannel(
+                  child: GroupInfoScreen(
+                    messageTheme: StreamChatTheme.of(context).ownMessageTheme,
+                  ),
+                  channel: channel,
+                ),
+              ),
+            );
+          }
+        },
+      ),
+      body: Column(
+        children: <Widget>[
+          Expanded(
+            child: Stack(
+              children: <Widget>[
+                MessageListView(
+                  initialScrollIndex: widget.initialScrollIndex,
+                  initialAlignment: widget.initialAlignment,
+                  highlightInitialMessage: widget.highlightInitialMessage,
+                  onMessageSwiped: _reply,
+                  onReplyTap: _reply,
+                  threadBuilder: (_, parentMessage) {
+                    return ThreadPage(
+                      parent: parentMessage,
+                    );
+                  },
+                  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.pushReplacementNamed(
+                      context,
+                      Routes.CHANNEL_PAGE,
+                      arguments: ChannelPageArgs(
+                        channel: channel,
+                        initialMessage: message,
+                      ),
+                    );
+                  },
+                  pinPermissions: ['owner', 'admin', 'member'],
+                ),
+                Positioned(
+                  bottom: 0,
+                  left: 0,
+                  right: 0,
+                  child: Container(
+                    alignment: Alignment.centerLeft,
+                    color: StreamChatTheme.of(context)
+                        .colorTheme
+                        .whiteSnow
+                        .withOpacity(.9),
+                    child: TypingIndicator(
+                      alignment: Alignment.centerLeft,
+                      padding: const EdgeInsets.symmetric(
+                        horizontal: 8,
+                        vertical: 4,
+                      ),
+                      style: StreamChatTheme.of(context)
+                          .textTheme
+                          .footnote
+                          .copyWith(
+                              color:
+                                  StreamChatTheme.of(context).colorTheme.grey),
+                    ),
+                  ),
+                ),
+              ],
+            ),
+          ),
+          MessageInput(
+            focusNode: _focusNode,
+            quotedMessage: _quotedMessage,
+            onQuotedMessageCleared: () {
+              setState(() => _quotedMessage = null);
+              _focusNode!.unfocus();
+            },
+          ),
+        ],
+      ),
+    );
+  }
+}

packages/stream_chat_v1/lib/chat_info_screen.dart

@@ -6,8 +6,8 @@ import 'package:stream_chat_flutter/stream_chat_flutter.dart';
 
 import 'channel_file_display_screen.dart';
 import 'channel_media_display_screen.dart';
+import 'channel_page.dart';
 import 'pinned_messages_screen.dart';
-import 'main.dart';
 import 'routes/routes.dart';
 
 /// Detail screen for a 1:1 chat correspondence
@@ -615,7 +615,7 @@ class __SharedGroupsScreenState extends State<_SharedGroupsScreen> {
             title = 'No title';
           }
         } else {
-          title = extraData['name'];
+          title = extraData['name'] as String;
         }
 
         return Column(
@@ -633,7 +633,7 @@ class __SharedGroupsScreenState extends State<_SharedGroupsScreen> {
                   ),
                   Expanded(
                       child: Text(
-                    title!,
+                    title,
                     style: textStyle,
                   )),
                   Padding(

packages/stream_chat_v1/lib/choose_user_page.dart

@@ -1,4 +1,5 @@
 import 'package:example/app_config.dart';
+import 'package:example/home_page.dart';
 import 'package:example/stream_version.dart';
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
@@ -6,6 +7,7 @@ import 'package:flutter_secure_storage/flutter_secure_storage.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:stream_chat_flutter/stream_chat_flutter.dart';
 
+import 'main.dart';
 import 'routes/routes.dart';
 
 const kStreamApiKey = 'STREAM_API_KEY';
@@ -89,8 +91,11 @@ class ChooseUserPage extends StatelessWidget {
                               ),
                             );
 
-                            final client = StreamChat.of(context).client;
+                            final client = StreamChatClient(
-                            client.apiKey = kDefaultStreamApiKey;
+                              kDefaultStreamApiKey,
+                              logLevel: Level.INFO,
+                            )..chatPersistenceClient = chatPersistentClient;
+
                             await client.connectUser(
                               user,
                               token,
@@ -115,6 +120,7 @@ class ChooseUserPage extends StatelessWidget {
                               context,
                               Routes.HOME,
                               ModalRoute.withName(Routes.HOME),
+                              arguments: HomePageArgs(client),
                             );
                           },
                           leading: UserAvatar(

packages/stream_chat_v1/lib/group_chat_details_screen.dart

@@ -2,7 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:stream_chat_flutter/stream_chat_flutter.dart';
 import 'package:uuid/uuid.dart';
 
-import 'main.dart';
+import 'channel_page.dart';
 import 'routes/routes.dart';
 
 class GroupChatDetailsScreen extends StatefulWidget {

packages/stream_chat_v1/lib/group_info_screen.dart

@@ -10,9 +10,9 @@ import 'package:stream_chat_flutter/stream_chat_flutter.dart';
 
 import 'channel_file_display_screen.dart';
 import 'channel_media_display_screen.dart';
-import 'pinned_messages_screen.dart';
+import 'channel_page.dart';
 import 'chat_info_screen.dart';
-import 'main.dart';
+import 'pinned_messages_screen.dart';
 import 'routes/routes.dart';
 
 class GroupInfoScreen extends StatefulWidget {
@@ -61,7 +61,9 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
     super.initState();
     var channel = StreamChannel.of(context);
     _nameController = TextEditingController.fromValue(
-        TextEditingValue(text: channel.channel.extraData['name'] ?? ''));
+      TextEditingValue(
+          text: (channel.channel.extraData['name'] as String?) ?? ''),
+    );
     _searchController = TextEditingController()..addListener(_userNameListener);
 
     _nameController!.addListener(() {
@@ -333,7 +335,7 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
 
   Widget _buildNameTile() {
     var channel = StreamChannel.of(context).channel;
-    var channelName = channel.extraData['name'] ?? '';
+    var channelName = (channel.extraData['name'] as String?) ?? '';
 
     return Material(
       color: StreamChatTheme.of(context).colorTheme.whiteSnow,
@@ -377,8 +379,7 @@ class _GroupInfoScreenState extends State<GroupInfoScreen> {
                 ),
               ),
             ),
-            if ((channelName == null) ||
+            if (channelName != _nameController!.text.trim())
-                (channelName != _nameController!.text.trim()))
               Row(
                 mainAxisSize: MainAxisSize.min,
                 children: [

packages/stream_chat_v1/lib/home_page.dart

@@ -0,0 +1,31 @@
+import 'package:example/routes/app_routes.dart';
+import 'package:example/routes/routes.dart';
+import 'package:flutter/foundation.dart';
+import 'package:flutter/material.dart';
+import 'package:stream_chat_flutter/stream_chat_flutter.dart';
+
+class HomePageArgs {
+  final StreamChatClient chatClient;
+
+  HomePageArgs(this.chatClient);
+}
+
+class HomePage extends StatelessWidget {
+  HomePage({
+    Key? key,
+    required this.chatClient,
+  }) : super(key: key);
+
+  final StreamChatClient chatClient;
+
+  @override
+  Widget build(BuildContext context) {
+    return StreamChat(
+      client: chatClient,
+      child: Navigator(
+        onGenerateRoute: AppRoutes.generateRoute,
+        initialRoute: Routes.CHANNEL_LIST_PAGE,
+      ),
+    );
+  }
+}

packages/stream_chat_v1/lib/new_chat_screen.dart

@@ -3,8 +3,8 @@ import 'dart:async';
 import 'package:flutter/material.dart';
 import 'package:stream_chat_flutter/stream_chat_flutter.dart';
 
+import 'channel_page.dart';
 import 'chips_input_text_field.dart';
-import 'main.dart';
 import 'routes/routes.dart';
 
 class NewChatScreen extends StatefulWidget {
@@ -66,10 +66,8 @@ class _NewChatScreenState extends State<NewChatScreen> {
         final chatState = StreamChat.of(context);
 
         final res = await chatState.client.queryChannelsOnline(
-          options: {
+          state: false,
-            'state': false,
+          watch: false,
-            'watch': false,
-          },
           filter: Filter.raw(value: {
             'members': [
               ..._selectedUsers.map((e) => e.id),

packages/stream_chat_v1/lib/pinned_messages_screen.dart

@@ -70,21 +70,7 @@ class _PinnedMessagesScreenState extends State<PinnedMessagesScreen> {
             fontSize: 16.0,
           ),
         ),
-        leading: Center(
+        leading: StreamBackButton(),
-          child: InkWell(
-            onTap: () {
-              Navigator.of(context).pop();
-            },
-            child: Container(
-              width: 24.0,
-              height: 24.0,
-              child: StreamSvgIcon.left(
-                color: StreamChatTheme.of(context).colorTheme.black,
-                size: 24.0,
-              ),
-            ),
-          ),
-        ),
         backgroundColor: StreamChatTheme.of(context).colorTheme.white,
       ),
       body: _buildMediaGrid(),

packages/stream_chat_v1/lib/routes/app_routes.dart

@@ -1,14 +1,18 @@
-import 'routes.dart';
+import 'package:example/channel_list_page.dart';
 import 'package:flutter/material.dart';
-import '../choose_user_page.dart';
-import '../advanced_options_page.dart';
 import 'package:stream_chat_flutter/stream_chat_flutter.dart';
-import '../main.dart';
+
-import '../group_chat_details_screen.dart';
+import '../advanced_options_page.dart';
-import '../new_group_chat_screen.dart';
+import '../channel_page.dart';
-import '../new_chat_screen.dart';
 import '../chat_info_screen.dart';
+import '../choose_user_page.dart';
+import '../group_chat_details_screen.dart';
 import '../group_info_screen.dart';
+import '../home_page.dart';
+import '../main.dart';
+import '../new_chat_screen.dart';
+import '../new_group_chat_screen.dart';
+import 'routes.dart';
 
 class AppRoutes {
   /// Add entry for new route here
@@ -25,7 +29,10 @@ class AppRoutes {
         return MaterialPageRoute(
             settings: const RouteSettings(name: Routes.HOME),
             builder: (_) {
-              return HomePage();
+              final homePageArgs = args as HomePageArgs;
+              return HomePage(
+                chatClient: homePageArgs.chatClient,
+              );
             });
       case Routes.CHOOSE_USER:
         return MaterialPageRoute(
@@ -42,12 +49,13 @@ class AppRoutes {
         return MaterialPageRoute(
             settings: const RouteSettings(name: Routes.CHANNEL_PAGE),
             builder: (_) {
-              final arg = args as ChannelPageArgs;
+              final channelPageArgs = args as ChannelPageArgs;
               return StreamChannel(
-                channel: arg.channel!,
+                channel: channelPageArgs.channel!,
-                initialMessageId: arg.initialMessage?.id,
+                initialMessageId: channelPageArgs.initialMessage?.id,
                 child: ChannelPage(
-                  highlightInitialMessage: arg.initialMessage != null,
+                  highlightInitialMessage:
+                      channelPageArgs.initialMessage != null,
                 ),
               );
             });
@@ -88,6 +96,12 @@ class AppRoutes {
                 messageTheme: StreamChatTheme.of(context).ownMessageTheme,
               );
             });
+      case Routes.CHANNEL_LIST_PAGE:
+        return MaterialPageRoute(
+            settings: const RouteSettings(name: Routes.CHANNEL_LIST_PAGE),
+            builder: (context) {
+              return ChannelListPage();
+            });
       // Default case, should not reach here.
       default:
         return null;

packages/stream_chat_v1/lib/routes/routes.dart

@@ -10,4 +10,5 @@ class Routes {
   static const String NEW_GROUP_CHAT_DETAILS = '/new_group_chat_details';
   static const String CHAT_INFO_SCREEN = '/chat_info_screen';
   static const String GROUP_INFO_SCREEN = '/group_info_screen';
+  static const String CHANNEL_LIST_PAGE = '/channel_list_page';
 }

packages/stream_chat_v1/lib/splash_screen.dart

@@ -0,0 +1,122 @@
+import 'package:flutter/material.dart';
+import 'package:flutter/scheduler.dart';
+import 'package:lottie/lottie.dart';
+
+mixin SplashScreenStateMixin<T extends StatefulWidget> on State<T>
+    implements TickerProvider {
+  late Animation<double> animation, scaleAnimation;
+  late AnimationController _animationController, _scaleAnimationController;
+  late Animation<Color?> colorAnimation;
+  bool animationCompleted = false;
+
+  void _createAnimations() {
+    _scaleAnimationController = AnimationController(
+      vsync: this,
+      value: 0,
+      duration: Duration(
+        milliseconds: 500,
+      ),
+    );
+    scaleAnimation = Tween(
+      begin: 1.0,
+      end: 1.5,
+    ).animate(CurvedAnimation(
+      parent: _scaleAnimationController,
+      curve: Curves.easeInOutBack,
+    ));
+
+    _animationController = AnimationController(
+      vsync: this,
+      duration: Duration(
+        milliseconds: 1000,
+      ),
+    );
+    animation = Tween(
+      begin: 0.0,
+      end: 1000.0,
+    ).animate(CurvedAnimation(
+      parent: _animationController,
+      curve: Curves.easeInOut,
+    ));
+    colorAnimation = ColorTween(
+      begin: Color(0xff005FFF),
+      end: Color(0xff005FFF),
+    ).animate(CurvedAnimation(
+      parent: _animationController,
+      curve: Curves.easeInOut,
+    ));
+    colorAnimation = ColorTween(
+      begin: Color(0xff005FFF),
+      end: Colors.transparent,
+    ).animate(CurvedAnimation(
+      parent: _animationController,
+      curve: Curves.easeInOut,
+    ));
+  }
+
+  void forwardAnimations() {
+    _scaleAnimationController.forward().whenComplete(() {
+      _animationController.forward();
+    });
+  }
+
+  Widget buildAnimation() => Stack(
+        clipBehavior: Clip.none,
+        alignment: Alignment.center,
+        children: [
+          AnimatedBuilder(
+            animation: scaleAnimation,
+            builder: (context, _) {
+              return Transform.scale(
+                scale: scaleAnimation.value,
+                child: AnimatedBuilder(
+                    animation: colorAnimation,
+                    builder: (context, snapshot) {
+                      return Container(
+                        alignment: Alignment.center,
+                        constraints: BoxConstraints.expand(),
+                        color: colorAnimation.value,
+                        child: !_animationController.isAnimating
+                            ? Lottie.asset(
+                                'assets/floating_boat.json',
+                                alignment: Alignment.center,
+                              )
+                            : SizedBox(),
+                      );
+                    }),
+              );
+            },
+          ),
+          AnimatedBuilder(
+            animation: animation,
+            builder: (context, snapshot) {
+              return Transform.scale(
+                scale: animation.value,
+                child: Container(
+                  width: 1.0,
+                  height: 1.0,
+                  decoration: BoxDecoration(
+                    color: Colors.white
+                        .withOpacity(1 - _animationController.value),
+                    shape: BoxShape.circle,
+                  ),
+                ),
+              );
+            },
+          ),
+        ],
+      );
+
+  @override
+  void initState() {
+    _createAnimations();
+    _animationController.addStatusListener((status) {
+      if (status == AnimationStatus.completed) {
+        setState(() {
+          animationCompleted = true;
+        });
+      }
+    });
+    super.initState();
+  }
+}

packages/stream_chat_v1/lib/thread_page.dart

@@ -0,0 +1,70 @@
+import 'package:flutter/material.dart';
+import 'package:stream_chat_flutter/stream_chat_flutter.dart';
+
+class ThreadPage extends StatefulWidget {
+  final Message? parent;
+  final int? initialScrollIndex;
+  final double? initialAlignment;
+
+  ThreadPage({
+    Key? key,
+    this.parent,
+    this.initialScrollIndex,
+    this.initialAlignment,
+  }) : super(key: key);
+
+  @override
+  _ThreadPageState createState() => _ThreadPageState();
+}
+
+class _ThreadPageState extends State<ThreadPage> {
+  Message? _quotedMessage;
+  FocusNode _focusNode = FocusNode();
+
+  @override
+  void dispose() {
+    _focusNode.dispose();
+    super.dispose();
+  }
+
+  void _reply(Message message) {
+    setState(() => _quotedMessage = message);
+    WidgetsBinding.instance!.addPostFrameCallback((timeStamp) {
+      _focusNode.requestFocus();
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      backgroundColor: StreamChatTheme.of(context).colorTheme.whiteSnow,
+      appBar: ThreadHeader(
+        parent: widget.parent!,
+      ),
+      body: Column(
+        children: <Widget>[
+          Expanded(
+            child: MessageListView(
+              parentMessage: widget.parent,
+              initialScrollIndex: widget.initialScrollIndex,
+              initialAlignment: widget.initialAlignment,
+              onMessageSwiped: _reply,
+              onReplyTap: _reply,
+              pinPermissions: ['owner', 'admin', 'member'],
+            ),
+          ),
+          if (widget.parent!.type != 'deleted')
+            MessageInput(
+              parentMessage: widget.parent,
+              focusNode: _focusNode,
+              quotedMessage: _quotedMessage,
+              onQuotedMessageCleared: () {
+                setState(() => _quotedMessage = null);
+                _focusNode.unfocus();
+              },
+            ),
+        ],
+      ),
+    );
+  }
+}

packages/stream_chat_v1/lib/user_mentions_page.dart

@@ -0,0 +1,88 @@
+import 'package:example/routes/routes.dart';
+import 'package:flutter/material.dart';
+import 'package:stream_chat_flutter/stream_chat_flutter.dart';
+
+import 'channel_page.dart';
+
+class UserMentionsPage extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    final user = StreamChat.of(context).user!;
+    return MessageSearchBloc(
+      child: MessageSearchListView(
+        filters: Filter.in_('members', [user.id]),
+        messageFilters: Filter.custom(
+          operator: r'$contains',
+          key: 'mentioned_users.id',
+          value: user.id,
+        ),
+        sortOptions: [
+          SortOption(
+            'created_at',
+            direction: SortOption.ASC,
+          ),
+        ],
+        paginationParams: PaginationParams(limit: 20),
+        showResultCount: false,
+        emptyBuilder: (_) {
+          return LayoutBuilder(
+            builder: (context, viewportConstraints) {
+              return SingleChildScrollView(
+                physics: AlwaysScrollableScrollPhysics(),
+                child: ConstrainedBox(
+                  constraints: BoxConstraints(
+                    minHeight: viewportConstraints.maxHeight,
+                  ),
+                  child: Center(
+                    child: Column(
+                      children: [
+                        Padding(
+                          padding: const EdgeInsets.all(24),
+                          child: StreamSvgIcon.mentions(
+                            size: 96,
+                            color: StreamChatTheme.of(context)
+                                .colorTheme
+                                .greyGainsboro,
+                          ),
+                        ),
+                        Text(
+                          'No mentions exist yet...',
+                          style: StreamChatTheme.of(context)
+                              .textTheme
+                              .body
+                              .copyWith(
+                                color:
+                                    StreamChatTheme.of(context).colorTheme.grey,
+                              ),
+                        ),
+                      ],
+                    ),
+                  ),
+                ),
+              );
+            },
+          );
+        },
+        onItemTap: (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(
+            context,
+            Routes.CHANNEL_PAGE,
+            arguments: ChannelPageArgs(
+              channel: channel,
+              initialMessage: message,
+            ),
+          );
+        },
+      ),
+    );
+  }
+}