Merge pull request #1789 from GetStream/develop

Update main development branch

.github/workflows/stream_flutter_workflow.yml

@@ -3,6 +3,7 @@ name: stream_flutter_workflow
 env:
   ACTIONS_ALLOW_UNSECURE_COMMANDS: 'true'
   flutter_channel: "stable"
+  flutter_version: "3.10.6"
 
 on:
   pull_request:
@@ -36,6 +37,7 @@ jobs:
       - name: "Install Flutter"
         uses: subosito/flutter-action@v2
         with:
+          flutter-version: ${{ env.flutter_version }}
           cache: true
           channel: ${{ env.flutter_channel }}
       - name: "Install Tools"
@@ -63,6 +65,7 @@ jobs:
       - name: "Install Flutter"
         uses: subosito/flutter-action@v2
         with:
+          flutter-version: ${{ env.flutter_version }}
           cache: true
           channel: ${{ env.flutter_channel }}
       - name: "Install Tools"
@@ -88,6 +91,7 @@ jobs:
       - name: "Install Flutter"
         uses: subosito/flutter-action@v2
         with:
+          flutter-version: ${{ env.flutter_version }}
           cache: true
           channel: ${{ env.flutter_channel }}
       - name: "Install Tools"

docusaurus/docs/Flutter/02-customization/01-custom-widgets/01-customize_message_widget.mdx

@@ -21,8 +21,9 @@ provided inside the `messageBuilder` parameter of the `StreamMessageListView` li
 ```dart
 StreamMessageListView(
     messageBuilder: (context, details, messageList, defaultImpl) {
-        // Your implementation of the message here
-        // E.g: return Text(details.message.text ?? '');
+        return defaultImpl.copyWith(
+            ...
+        );
     },
 ),
 ```

docusaurus/docs/Flutter/02-customization/01-custom-widgets/02-customize_text_messages.mdx

@@ -91,7 +91,7 @@ StreamMessageListView(
     messageBuilder: (context, messageDetails, messageList, defaultWidget) {
         return defaultWidget.copyWith(
             textBuilder: (context, message) {
-                return Text(message.text);
+                return Text(message.text ?? '');
             },
         );
     },
@@ -108,45 +108,50 @@ StreamMessageListView(
     messageBuilder: (context, messageDetails, messageList, defaultWidget) {
         return defaultWidget.copyWith(
             textBuilder: (context, message) {
-                final text = _replaceHashtags(message.text).replaceAll('\n', '\\\n');
+                final text = _replaceHashtags(message.text)?.replaceAll('\n', '\\\n');
                 final messageTheme = StreamChatTheme.of(context).ownMessageTheme;
 
+                if (text == null) return const SizedBox();
+
                 return MarkdownBody(
                     data: text,
                     onTapLink: (
                         String link,
-                        String href,
+                        String? href,
                         String title,
                         ) {
                       // Do something with tapped hashtag
                     },
                     styleSheet: MarkdownStyleSheet.fromTheme(
                       Theme.of(context).copyWith(
                         textTheme: Theme.of(context).textTheme.apply(
-                          bodyColor: messageTheme.messageText.color,
-                          decoration: messageTheme.messageText.decoration,
-                          decorationColor: messageTheme.messageText.decorationColor,
-                          decorationStyle: messageTheme.messageText.decorationStyle,
-                          fontFamily: messageTheme.messageText.fontFamily,
+                          bodyColor: messageTheme.messageTextStyle?.color,
+                          decoration: messageTheme.messageTextStyle?.decoration,
+                          decorationColor: messageTheme.messageTextStyle?.decorationColor,
+                          decorationStyle: messageTheme.messageTextStyle?.decorationStyle,
+                          fontFamily: messageTheme.messageTextStyle?.fontFamily,
                         ),
                       ),
                     ).copyWith(
-                      a: messageTheme.messageLinks,
-                      p: messageTheme.messageText,
+                      a: messageTheme.messageLinksStyle,
+                      p: messageTheme.messageTextStyle,
                     ),
                 );
             },
         );
     },
 )
 
-String _replaceHashtags(String text) {
-  RegExp exp = new RegExp(r"\B#\w\w+");
+String? _replaceHashtags(String? text) {
+  if (text == null) return null;
+  
+  final exp = RegExp(r"\B#\w\w+");
+  String result = text;
   exp.allMatches(text).forEach((match){
-    text = text.replaceAll(
-        '${match.group(0)}', '[${match.group(0)}](${match.group(0).replaceAll(' ', '')})');
+    text = text!.replaceAll(
+        '${match.group(0)}', '[${match.group(0)}](${match.group(0)?.replaceAll(' ', '')})');
   });
-  return text;
+  return result;
 }
 ```
 

docusaurus/docs/Flutter/02-customization/01-custom-widgets/03-customize_message_actions.mdx

@@ -68,8 +68,8 @@ StreamMessageListView(
     return defaultMessage.copyWith(
       customActions: [
         StreamMessageAction(
-          leading: Icon(Icons.add),
-          title: Text('Demo Action'),
+          leading: const Icon(Icons.add),
+          title: const Text('Demo Action'),
           onTap: (message) {
             /// Complete action here
           },

docusaurus/docs/Flutter/02-customization/01-custom-widgets/04-adding_custom_attachments.mdx

@@ -35,9 +35,9 @@ Message(
   text: 'This is my location',
   attachments: [
     Attachment(
-      uploadState: UploadState.success(),
+      uploadState: const UploadState.success(),
       type: 'location',
-      extraData: {
+      extraData: const {
         'latitude': 'fetched_latitude',
         'longitude': 'fetched_longitude',
       },
@@ -62,22 +62,21 @@ First, we add a button which when clicked fetches and shares location into the `
 StreamMessageInput(
   actions: [
     InkWell(
-      child: Icon(
+      child: const Icon(
         Icons.location_on,
-        size: 20.0,
-        color: StreamChatTheme.of(context).colorTheme.grey,
+        size: 20,
+        color: StreamChatTheme.of(context).colorTheme.textLowEmphasis,
       ),
       onTap: () {
-       var channel = StreamChannel.of(context).channel;
-       var user = StreamChat.of(context).user;
+       final channel = StreamChannel.of(context).channel;
 
        _determinePosition().then((value) {
          channel.sendMessage(
            Message(
              text: 'This is my location',
              attachments: [
                Attachment(
-                 uploadState: UploadState.success(),
+                 uploadState: const UploadState.success(),
                  type: 'location',
                  extraData: {
                    'latitude': value.latitude.toString(),
@@ -126,8 +125,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 = Uri(
+    final url = Uri(
         scheme: 'https',
         host: 'maps.googleapis.com',
         port: 443,
@@ -155,8 +153,8 @@ StreamMessageListView(
           'location': (context, message, attachments) {
             final attachmentWidget = Image.network(
               _buildMapAttachment(
-                attachments[0].extraData['latitude'],
-                attachments[0].extraData['longitude'],
+                attachments[0].extraData['latitude'].toString(),
+                attachments[0].extraData['longitude'].toString(),
               ),
             );
 
@@ -194,14 +192,14 @@ First, we add the attachment when the location button is clicked:
      InkWell(
        child: Icon(
          Icons.location_on,
-         size: 20.0,
-         color: StreamChatTheme.of(context).colorTheme.grey,
+         size: 20,
+         color: StreamChatTheme.of(context).colorTheme.textLowEmphasis,
         ),
       onTap: () {
         _determinePosition().then((value) {
            _messageInputController.addAttachment(
               Attachment(
-                uploadState: UploadState.success(),
+                uploadState: const UploadState.success(),
                 type: 'location',
                 extraData: {
                   'latitude': value.latitude.toString(),
@@ -227,14 +225,14 @@ StreamMessageInput(
     InkWell(
       child: Icon(
         Icons.location_on,
-        size: 20.0,
-        color: StreamChatTheme.of(context).colorTheme.grey,
+        size: 20,
+        color: StreamChatTheme.of(context).colorTheme.textLowEmphasis,
       ),
      onTap: () {
        _determinePosition().then((value) {
          _messageInputController.addAttachment(
            Attachment(
-             uploadState: UploadState.success(),
+             uploadState: const UploadState.success(),
              type: 'location',
              extraData: {
                'latitude': value.latitude.toString(),
@@ -248,16 +246,21 @@ StreamMessageInput(
      },
    ),
   ],
-  attachmentThumbnailBuilders: {
-    'location': (context, attachment) {
-      return Image.network(
-        _buildMapAttachment(
-          attachment.extraData['latitude'],
-          attachment.extraData['longitude'],
-        ),
-      );
-    },
-  },
+  mediaAttachmentBuilder: (
+   BuildContext context,
+   Attachment attachment,
+   ValueSetter<Attachment>? onRemovePressed,
+   ) {
+     if (attachment.type == 'location') {
+       return Image.network(
+         _buildMapAttachment(
+           attachment.extraData['latitude'].toString(),
+           attachment.extraData['longitude'].toString(),
+         ),
+       );
+     }
+     return const SizedBox();
+   },  
 ),
 ```
 

docusaurus/docs/Flutter/02-customization/01-custom-widgets/05-customize_attachment_picker_modal.mdx

@@ -25,11 +25,14 @@ The initial attachments can be passed to the Attachment Picker Modal in two ways
  * By passing the `initialAttachments` parameter.
 
  ```dart
+ StreamMessageInputController _messageInputController =
+       StreamMessageInputController();
+ ...
  showStreamAttachmentPickerModalBottomSheet(
    context: context,
    initialAttachments: [
      // Pass the initial attachments to the modal here if any are available already (optional)
-     ...messageInputController.attachments,
+     ..._messageInputController.attachments,
    ],
  );
  ```
@@ -65,7 +68,7 @@ However, you can also customize the options by passing the `customOptions` param
    customOptions: [
      // Pass the custom attachment picker options here
      AttachmentPickerOption(
-       icon: Icon(Icons.audiotrack),
+       icon: const Icon(Icons.audiotrack),
        supportedTypes: [AttachmentPickerType.audios],
        optionViewBuilder: (context, attachmentPickerController) {
          return AudioPicker(
@@ -87,7 +90,7 @@ The size of the attachment thumbnail item shown in the gallery picker can be def
  ```dart
  showStreamAttachmentPickerModalBottomSheet(
    context: context,
-   attachmentThumbnailSize: ThumbnailSize.square(600),
+   attachmentThumbnailSize: const ThumbnailSize.square(600),
  );
  ```
 
@@ -121,13 +124,13 @@ Possible values are between 0 and 100.
 
 The scale of the attachment thumbnail item shown in the gallery picker can be defined by passing the `attachmentThumbnailScale` parameter.
 
-For example, if this is 2.0, it means that there are four image pixels for every one logical pixel, and the image's actual width and height are
+For example, if this is 2, it means that there are four image pixels for every one logical pixel, and the image's actual width and height are
 double the height and width that should be used when painting the image.
 
  ```dart
  showStreamAttachmentPickerModalBottomSheet(
    context: context,
-   attachmentThumbnailScale: 2.0,
+   attachmentThumbnailScale: 2,
  );
  ```
 
@@ -145,13 +148,13 @@ The `showStreamAttachmentPickerModalBottomSheet` function also accepts the param
    isDismissible: true,
    clipBehavior: Clip.antiAlias,
    barrierColor: Colors.black.withOpacity(0.5),
-   constraints: BoxConstraints(
+   constraints: const BoxConstraints(
      maxHeight: 500,
      maxWidth: 500,
    ),
    shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.vertical(
-       top: Radius.circular(16.0),
+       top: Radius.circular(16),
      ),
    ),
  );

docusaurus/docs/Flutter/02-customization/01-custom-widgets/06-autocomplete_triggers.mdx

@@ -63,19 +63,19 @@ class StreamEmojiAutocompleteOptions extends StatelessWidget {
           horizontalTitleGap: 0,
           leading: Text(
             emoji.char,
-            style: themeData.textTheme.headline6!.copyWith(
+            style: themeData.textTheme.titleLarge!.copyWith(
               fontSize: 24,
             ),
           ),
           title: SubstringHighlight(
             text: emoji.shortName,
             term: query,
-            textStyleHighlight: themeData.textTheme.headline6!.copyWith(
+            textStyleHighlight: themeData.textTheme.titleLarge!.copyWith(
               color: Colors.yellow,
               fontSize: 14.5,
               fontWeight: FontWeight.bold,
             ),
-            textStyle: themeData.textTheme.headline6!.copyWith(
+            textStyle: themeData.textTheme.titleLarge!.copyWith(
               fontSize: 14.5,
             ),
           ),

docusaurus/docs/Flutter/02-customization/01-custom-widgets/07-slidable_channel_list_preview.mdx

@@ -25,8 +25,8 @@ If you're new to Stream Chat Flutter, we recommend looking at our [getting start
 dependencies:
   flutter:
     sdk: flutter
-  stream_chat_flutter: ^4.0.0
-  flutter_slidable: ^1.2.0
+  stream_chat_flutter: ^6.0.0
+  flutter_slidable: ^3.0.0
 ```
 
 ⚠️ Note: The examples shown in this guide use the above packages and versions.
@@ -120,7 +120,8 @@ class _ChannelListPageState extends State<ChannelListPage> {
             onRefresh: _controller.refresh,
             child: StreamChannelListView(
               controller: _controller,
-              itemBuilder: (context, channel, tile) {
+              itemBuilder: (context, channels, index, tile) {
+                final channel = channels[index];
                 final chatTheme = StreamChatTheme.of(context);
                 final backgroundColor = chatTheme.colorTheme.inputBg;
                 final canDeleteChannel = channel.ownCapabilities