Merge remote-tracking branch 'origin/docusaurus' into docusaurus

docusaurus/docs/Flutter/basics/introduction.mdx

@@ -19,14 +19,14 @@ giving you complete control to ones that give you a rich out-of-the-box chat exp
 
 The packages that make up the Stream Chat SDK are:
 
-1. <b>Low Level Client (stream_chat)</b> : A pure Dart package that can be used on any Dart project.
+1. <b>Low Level Client (stream_chat)</b>: a pure Dart package that can be used on any Dart project.
 It provides a low-level client to access the Stream Chat service.
-2. <b>Core (stream_chat_flutter_core)</b> : Provides business logic to fetch common things required
+2. <b>Core (stream_chat_flutter_core)</b>: provides business logic to fetch common things required
 for integrating Stream Chat into your application.
 The core package allows more customisation and hence provides business logic but no UI components.
-3. <b>UI (stream_chat_flutter)</b> : This library includes both a low-level chat SDK and a set of
+3. <b>UI (stream_chat_flutter)</b>: this library includes both a low-level chat SDK and a set of
 reusable and customisable UI components.
-4. <b>Persistence (stream_chat_persistence)</b> : Provides a persistence client for fetching and
+4. <b>Persistence (stream_chat_persistence)</b>: provides a persistence client for fetching and
 saving chat data locally.
 
 We recommend building prototypes using the full UI package since it contains UI widgets already
@@ -37,7 +37,7 @@ The Flutter SDK enables you to build any type of chat or messaging experience fo
 and Desktop.
 
 If you're building a very custom UI and would prefer a more lean package,
-our core package will be suited to this use case. Core allows you to build custom,
+our [core package](https://pub.dev/packages/stream_chat_flutter) will be suited to this use case. Core allows you to build custom,
 expressive UIs while retaining the benefits of our full Flutter SDK.
 APIs for accessing and controlling users, sending messages, etc are seamlessly integrated into
 this package and accessible via providers and builders.
@@ -55,7 +55,7 @@ but there is a way to create a unique chat between a certain number of people by
 
 In essence, a normal two-person chat would be a <b>distinct channel</b> created with two members (you cannot add or delete members in this channel), whereas a group created with two people would simply be a <b>non distinct channel</b> (possible to add or remove members).
 
-Note: It is also possible to add more than two people in a distinct channel which retains the same add/removal properties and resembles the Slack DMs where you can DM two or more people as well.
+Note: It is also possible to add more than two people in a distinct channel which retains the same add/removal properties and resembles the Slack DMs where you can DM one or more people as well.
 
 In summary, if you were creating a Whatsapp-like app, the first screen would be a <b>list of channels</b> - which on opening would show a <b>list of messages</b> that were sent by the users in the Channel.
 

docusaurus/docs/Flutter/guides/adding_custom_attachments.mdx

@@ -14,7 +14,9 @@ own types of attachments through the SDK such as location, audio, etc.
 This involves doing three things:
 
 1) Rendering the attachment thumbnail in the `MessageInput`
+
 2) Sending a message with the custom attachment
+
 3) Rendering the custom message attachment
 
 To do this, let's check out an example to add location sharing to Stream Chat.
@@ -126,7 +128,7 @@ Next, we build the Static Maps URL (Add your API key before using the code snipp
 ```dart
   String _buildMapAttachment(String lat, String long) {
     var baseURL = 'https://maps.googleapis.com/maps/api/staticmap?';
-    var url = new Uri(
+    var url = Uri(
         scheme: 'https',
         host: 'maps.googleapis.com',
         port: 443,

docusaurus/docs/Flutter/stream_chat_flutter/channel_list_header.mdx

@@ -85,4 +85,4 @@ To enable this, use the `showConnectionStateTile` property.
 ChannelListHeader(
     showConnectionStateTile: true,
 ),
-```
+```

docusaurus/docs/Flutter/stream_chat_flutter/channel_list_view.mdx

@@ -13,9 +13,10 @@ Find the pub.dev documentation [here](https://pub.dev/documentation/stream_chat_
 ### Background
 
 Channels are fundamental elements of Stream Chat and constitute shared spaces which allow users to
-message each other. 1:1 conversations and groups are both examples of channels, albeit with some (distinct/non-distinct)
+message each other.
-differences. Displaying the list of channels that a user is a part of is a pattern that is part of
+
-most messaging apps.
+1:1 conversations and groups are both examples of channels, albeit with some (distinct/non-distinct)
+differences. Displaying the list of channels that a user is a part of is a pattern present in most messaging apps.
 
 The `ChannelListView` widget allows displaying a list of channels to a user. By default, this is NOT
 ONLY the channels that the user is a part of. This section goes into setting up and using a `ChannelListView`
@@ -108,4 +109,3 @@ ChannelListView(
 ),
 ```
 
-

docusaurus/docs/Flutter/stream_chat_flutter/introduction.mdx

@@ -16,4 +16,3 @@ use it in your Flutter apps, we wanted to make sure that adding Chat functionali
 The UI package is built on top of the low-level client and the core package and allows you to build a
 full fledged app with either the inbuilt components, modify existing components, or easily add widgets
 of your own to match your app's style better.
-

docusaurus/docs/Flutter/stream_chat_flutter/message_input.mdx

@@ -14,7 +14,7 @@ Find the pub.dev documentation [here](https://pub.dev/documentation/stream_chat_
 
 In Stream Chat, we can send messages in a channel. However, sending a message isn't as simple as adding
 a `TextField` and logic for sending a message. It involves additional processes like addition of media,
-quoting a messages, adding a custom command like a GIF board, and much more. Moreover, most apps also
+quoting a message, adding a custom command like a GIF board, and much more. Moreover, most apps also
 need to customize the input to match their theme, overall color and structure pattern, etc.
 
 To do this, we created a `MessageInput` widget which abstracts all expected functionality a modern input
@@ -54,7 +54,7 @@ class ChannelPage extends StatelessWidget {
 }
 ```
 
-It is common to put this widget in the same page of a [MessageListView] as the bottom widget.
+It is common to put this widget in the same page of a `MessageListView` as the bottom widget.
 
 ### Quoting A Message
 
@@ -119,7 +119,7 @@ class _ChannelPageState extends State<ChannelPage> {
 
 ### Adding Custom Actions
 
-By default, the `MessageInput` has two actions: one for attachments and one for commands like giphy.
+By default, the `MessageInput` has two actions: one for attachments and one for commands like Giphy.
 To add your own action, we use the `actions` parameter like this:
 
 ```dart
@@ -167,4 +167,4 @@ MessageInput(
 ),
 ```
 
-![](../assets/message_input_change_position.png)
+![](../assets/message_input_change_position.png)

docusaurus/docs/Flutter/stream_chat_flutter/message_widget.mdx

@@ -95,4 +95,4 @@ MessageWidget(
     //...
     reverse = true,
 )
-```
+```

docusaurus/docs/Flutter/stream_chat_flutter/setup.mdx

@@ -4,7 +4,7 @@ sidebar_position: 2
 title: Setup
 ---
 
-Understanding Setup For stream_chat_flutter
+Understanding Setup For `stream_chat_flutter`
 
 ### Add pub.dev dependency
 
@@ -12,7 +12,7 @@ First, you need to add the `stream_chat_flutter` dependency to your `pubspec.yam
 
 You can either run this command:
 
-```
+```shell
 flutter pub add stream_chat_flutter
 ```
 
@@ -20,15 +20,17 @@ OR
 
 Add this line in the dependencies section of your pubspec.yaml after substituting latest version:
 
-```
+```yaml
 dependencies:
-  stream_chat_flutter_core: ^latest_version
+  stream_chat_flutter: ^latest_version
 ```
 
+You can find the package details on [pub.dev](https://pub.dev/packages/stream_chat_flutter).
+
 ### Details On Platform Support
 
 `stream_chat_flutter` was originally created for Android and iOS mobile platforms. As Flutter matured,
-additional platforms were added and the package now has experimental support for web and desktop as
+support for additional platforms was added and the package now has experimental support for web and desktop as
 [detailed here](https://getstream.io/blog/announcing-experimental-multi-platform-support-for-the-stream-flutter-sdk/).
 
 However, platforms other than mobile may have additional constraints due to not supporting all plugins,
@@ -44,22 +46,3 @@ Follow [this guide](https://pub.dev/packages/video_player#installation) to fulfi
 
 To pick images from the camera, we use the [image_picker](https://pub.dev/packages/image_picker) plugin.
 Follow [these instructions](https://pub.dev/packages/image_picker#ios) to check the requirements.
-
-### Setup: Web
-
-Due to Moor web (for offline storage) you need to include the sql.js library:
-
-```
-<!doctype html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <script defer src="sql-wasm.js"></script>
-    <script defer src="main.dart.js" type="application/javascript"></script>
-</head>
-<body></body>
-</html>
-```
-
-You can grab the latest version of sql-wasm.js and sql-wasm.wasm [here](https://github.com/sql-js/sql.js/releases)
-and copy them into your `/web` folder.

docusaurus/docs/Flutter/stream_chat_flutter/user_list_view.mdx

@@ -74,7 +74,7 @@ UsersListView(
 
 ### Selecting Users
 
-The `UserListView` widget allows selecting users in a list by supplying a selected users and callbacks
+The `UserListView` widget allows selecting users in a list by supplying a selected users list and callbacks
 for when user items are tapped.
 
 ```dart

docusaurus/docs/Flutter/stream_chat_flutter_core/channel_list_core.mdx

@@ -18,16 +18,15 @@ class ChannelListPage extends StatelessWidget {
   Widget build(BuildContext context) {
     return Scaffold(
       body: ChannelListCore(
-        filter: {
+        filter: Filter.in_(
-          'members': {
+            'members',
-            '\$in': [StreamChat.of(context).user.id],
+            [StreamChat.of(context).user!.id],
-          }
+        ),
-        },
         sort: [SortOption('last_message_at')],
         pagination: PaginationParams(
           limit: 20,
         ),
-        errorBuilder: (err) {
+        errorBuilder: (context, err) {
           return Center(
             child: Text('An error has occured'),
           );
@@ -37,7 +36,7 @@ class ChannelListPage extends StatelessWidget {
             child: Text('Nothing here...'),
           );
         },
-        emptyBuilder: (context) {
+        loadingBuilder: (context) {
           return Center(
             child: CircularProgressIndicator(),
           );

docusaurus/docs/Flutter/stream_chat_flutter_core/channels_bloc.mdx

@@ -9,7 +9,7 @@ title: ChannelsBloc
 Channels with pagination, re-ordering, querying and other operations
 associated with Channels.
 
-`ChannelsBloc` can be accessed at anytime by using the static of method
+`ChannelsBloc` can be accessed at anytime by using the static `.of` method
 using Flutter's `BuildContext`.
 
 ```dart
@@ -63,7 +63,7 @@ ChannelsBloc(
 
 #### Decide if channel should be added on new message event
 
-When a new message arrives, a `message.new` event is created. We can decide if we want to add the channel
+When a new message arrives, a `message.new` event is received. We can decide if we want to add the channel
 to the list using the `shouldAddChannel` parameter which is a callback supplying the event data:
 
 ```dart

docusaurus/docs/Flutter/stream_chat_flutter_core/introduction.mdx

@@ -15,10 +15,11 @@ Please use the `stream_chat_flutter` package for the full fledged suite of UI co
 In the early days of the Flutter SDK, the SDK was only split into the LLC (`stream_chat`) and
 the UI package (`stream_chat_flutter`). With this you could use a fully built interface with the UI package
 or a fully custom interface with the LLC. However, we soon recognised the need for a third intermediary
-package which made tasks like building and modifying a list or channels or messages easy but without
+package which made tasks like building and modifying a list of channels or messages easy but without
 the complexity of using low level components. The Core package (`stream_chat_flutter_core`) is a manifestation
 of the same idea and allows you to build an interface with Stream Chat without having to deal with
-low level code and architecture as well as implementing your own theme and UI effortlessly.
+low level code and architecture as well as implementing your own theme and UI effortlessly. 
+Also, it has very few dependencies.
 
 We will now explore the components of this intermediary package and understand how it helps you build
 the experience you want your users to have.
@@ -46,7 +47,7 @@ The BLoCs we provide are:
 ### Core Components
 
 Core components usually are an easy way to fetch data associated with Stream Chat.
-Core components use functions exposed by the respective BLoCs (the ChannelListCore uses the ChannelsBloc)
+Core components use functions exposed by the respective BLoCs (for example the ChannelListCore uses the ChannelsBloc)
 and use the respective controllers for various operations. Unlike heavier components from the UI
 package, core components are decoupled from UI and they expose builders instead to help you build
 a fully custom interface.
@@ -76,4 +77,4 @@ specific function (reload / paginate) whenever such an event is triggered throug
 * MessageSearchListController
 * ChannelListController
 
-This section goes into the individual core package widgets and their functional use.
+This section goes into the individual core package widgets and their functional use.

docusaurus/docs/Flutter/stream_chat_flutter_core/message_search_bloc.mdx

@@ -7,7 +7,7 @@ title: MessageSearchListBloc
 `MessageSearchBloc` is used to manage a list of messages with pagination.
 This class can be used to load messages, perform queries, etc.
 
-`MessageSearchBloc` can be accessed at anytime by using the static of method
+`MessageSearchBloc` can be accessed at anytime by using the static `.of` method
 using Flutter's BuildContext.
 
 ```dart

docusaurus/docs/Flutter/stream_chat_flutter_core/message_search_list_core.mdx

@@ -15,12 +15,8 @@ class MessageSearchPage extends StatelessWidget {
   Widget build(BuildContext context) {
     return Scaffold(
       body: MessageSearchListCore(
-              messageQuery: _channelQuery,
+              messageQuery: _messageFilter,
-              filters: {
+              filters: _channelsFilter,
-                'members': {
-                  r'$in': [user.id]
-                }
-              },
               paginationParams: PaginationParams(limit: 20),
       ),
     );

docusaurus/docs/Flutter/stream_chat_flutter_core/setup.mdx

@@ -4,7 +4,7 @@ sidebar_position: 2
 title: Setup
 ---
 
-Understanding Setup For stream_chat_flutter_core
+Understanding Setup For `stream_chat_flutter_core`
 
 ### Add pub.dev dependency
 
@@ -12,7 +12,7 @@ First, you need to add the `stream_chat_flutter_core` dependency to your pubspec
 
 You can either run this command:
 
-```
+```shell
 flutter pub add stream_chat_flutter_core
 ```
 
@@ -20,8 +20,9 @@ OR
 
 Add this line in the dependencies section of your pubspec.yaml after substituting latest version:
 
-```
+```yaml
 dependencies:
   stream_chat_flutter_core: ^latest_version
 ```
 
+You can find the package details on [pub.dev](https://pub.dev/packages/stream_chat_flutter_core).

docusaurus/docs/Flutter/stream_chat_flutter_core/stream_chat_core.mdx

@@ -4,15 +4,14 @@ sidebar_position: 3
 title: StreamChatCore
 ---
 
-`StreamChatCore` is a version of `StreamChat` found in stream_chat_flutter that is decoupled from 
+`StreamChatCore` is a version of `StreamChat` found in `stream_chat_flutter` that is decoupled from 
 theme and initialisations.
 
 `StreamChatCore` is used to provide information about the chat client to the widget tree.
 This Widget is used to react to life cycle changes and system updates.
-When the app goes into the background, the websocket connection is kept
+When the app goes into the background, the websocket connection is automatically closed and when it goes back to foreground the connection is opened again.
-alive for two minutes before being terminated.
 
-Like the StreamChat widget in the higher level UI package, the StreamChatCore widget should
+Like the `StreamChat` widget in the higher level UI package, the `StreamChatCore` widget should
 be on the top level before using any Stream functionality:
 
 ```dart

docusaurus/docs/Flutter/stream_chat_flutter_core/users_bloc.mdx

@@ -6,15 +6,14 @@ title: UsersBloc
 
 Widget dedicated to the management of a users list with pagination.
 
-`UsersBloc` can be accessed at anytime by using the static of method
+`UsersBloc` can be accessed at anytime by using the static `.of` method
 using Flutter's `BuildContext`.
 
 ```dart
 var _userBloc_ = UsersBloc.of(context);
 ```
 
-The `UsersBloc` widget encapsulates common functionality related to searching for users
+The `UsersBloc` widget encapsulates common functionality related to user lists and also supplies them down the widget tree.
-and also supplies them down the widget tree.
 
 Here is a basic implementation of `UsersBloc`:
 

packages/stream_chat_flutter_core/lib/src/channel_list_core.dart

@@ -19,16 +19,15 @@ import 'package:stream_chat_flutter_core/src/typedef.dart';
 ///   Widget build(BuildContext context) {
 ///     return Scaffold(
 ///       body: ChannelListCore(
-///         filter: {
+///         filter: Filter.in_(
-///           'members': {
+///            'members',
-///             '\$in': [StreamChat.of(context).user.id],
+///            [StreamChat.of(context).user!.id],
-///           }
+///         ),
-///         },
 ///         sort: [SortOption('last_message_at')],
 ///         pagination: PaginationParams(
 ///           limit: 20,
 ///         ),
-///         errorBuilder: (err) {
+///         errorBuilder: (context, err) {
 ///           return Center(
 ///             child: Text('An error has occured'),
 ///           );
@@ -38,7 +37,7 @@ import 'package:stream_chat_flutter_core/src/typedef.dart';
 ///             child: Text('Nothing here...'),
 ///           );
 ///         },
-///         emptyBuilder: (context) {
+///         loadingBuilder: (context) {
 ///           return Center(
 ///             child: CircularProgressIndicator(),
 ///           );

packages/stream_chat_flutter_core/lib/src/message_search_list_core.dart

@@ -17,12 +17,8 @@ import 'package:stream_chat_flutter_core/src/typedef.dart';
 ///   Widget build(BuildContext context) {
 ///     return Scaffold(
 ///       body: MessageSearchListCore(
-///               messageQuery: _channelQuery,
+///               messageQuery: _messageFilter,
-///               filters: {
+///               filters: _channelsFilter,
-///                 'members': {
-///                   r'$in': [user.id]
-///                 }
-///               },
 ///               paginationParams: PaginationParams(limit: 20),
 ///       ),
 ///     );