Add preparing state to attachment upload state

Signed-off-by: Sahil Kumar <[email protected]>

packages/stream_chat_flutter/lib/src/attachment/attachment_upload_state_builder.dart

@@ -11,6 +11,7 @@ class AttachmentUploadStateBuilder extends StatelessWidget {
   final FailedBuilder failedBuilder;
   final WidgetBuilder successBuilder;
   final InProgressBuilder inProgressBuilder;
+  final WidgetBuilder preparingBuilder;
 
   const AttachmentUploadStateBuilder({
     Key key,
@@ -19,6 +20,7 @@ class AttachmentUploadStateBuilder extends StatelessWidget {
     this.failedBuilder,
     this.successBuilder,
     this.inProgressBuilder,
+    this.preparingBuilder,
   })  : assert(message != null),
         assert(attachment != null),
         super(key: key);
@@ -51,7 +53,11 @@ class AttachmentUploadStateBuilder extends StatelessWidget {
     var success = successBuilder;
     success ??= (context) => _SuccessState();
 
+    var preparing = preparingBuilder;
+    preparing ??= (context) => _PreparingState(attachmentId: attachmentId);
+
     return attachment.uploadState.when(
+      preparing: () => preparing(context),
       inProgress: (sent, total) => inProgress(context, sent, total),
       success: () => success(context),
       failed: (error) => failed(context, error),
@@ -94,6 +100,42 @@ class _IconButton extends StatelessWidget {
   }
 }
 
+class _PreparingState extends StatelessWidget {
+  final String attachmentId;
+
+  const _PreparingState({
+    Key key,
+    @required this.attachmentId,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    final channel = StreamChannel.of(context).channel;
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.end,
+      mainAxisAlignment: MainAxisAlignment.spaceBetween,
+      children: [
+        Align(
+          alignment: Alignment.topRight,
+          child: _IconButton(
+            icon: StreamSvgIcon.close(
+              color: StreamChatTheme.of(context).colorTheme.white,
+            ),
+            onPressed: () => channel.cancelAttachmentUpload(attachmentId),
+          ),
+        ),
+        Align(
+          alignment: Alignment.topRight,
+          child: UploadProgressIndicator(
+            uploaded: 0,
+            total: double.maxFinite.toInt(),
+          ),
+        )
+      ],
+    );
+  }
+}
+
 class _InProgressState extends StatelessWidget {
   final int sent;
   final int total;

packages/stream_chat_flutter/lib/src/attachment/file_attachment.dart

@@ -181,6 +181,14 @@ class FileAttachment extends AttachmentWidget {
     final attachmentId = attachment.id;
     var trailingWidget = trailing;
     trailingWidget ??= attachment.uploadState?.when(
+          preparing: () => Padding(
+            padding: const EdgeInsets.all(8.0),
+            child: _buildButton(
+              icon: StreamSvgIcon.close(color: theme.colorTheme.white),
+              fillColor: theme.colorTheme.overlayDark,
+              onPressed: () => channel.cancelAttachmentUpload(attachmentId),
+            ),
+          ),
           inProgress: (_, __) => Padding(
             padding: const EdgeInsets.all(8.0),
             child: _buildButton(
@@ -232,6 +240,16 @@ class FileAttachment extends AttachmentWidget {
       color: theme.colorTheme.grey,
     );
     return attachment.uploadState?.when(
+          preparing: () {
+            return UploadProgressIndicator(
+              uploaded: 0,
+              total: double.maxFinite.toInt(),
+              showBackground: false,
+              padding: EdgeInsets.zero,
+              textStyle: textStyle,
+              progressIndicatorColor: theme.colorTheme.accentBlue,
+            );
+          },
           inProgress: (sent, total) {
             return UploadProgressIndicator(
               uploaded: sent,

packages/stream_chat_flutter/pubspec.yaml

@@ -11,7 +11,8 @@ environment:
 dependencies:
   flutter:
     sdk: flutter
-  stream_chat_flutter_core: ^1.1.0-beta
+  stream_chat_flutter_core:
+    path: ../stream_chat_flutter_core
   flutter_app_badger: ^1.1.2
   photo_view: ^0.10.3
   rxdart: ^0.25.0