✨ Queued upload

lib/controllers/post_editor_controller.dart

@@ -114,10 +114,12 @@ class PostEditorController extends GetxController {
       context: context,
       builder: (context) => AttachmentEditorPopup(
         usage: 'i.attachment',
-        current: attachments,
+        initialAttachments: attachments,
-        onUpdate: (value) {
+        onAdd: (value) {
-          attachments.value = value;
+          attachments.add(value);
-          attachments.refresh();
+        },
+        onRemove: (value) {
+          attachments.remove(value);
         },
       ),
     );
@@ -163,6 +165,8 @@ class PostEditorController extends GetxController {
     visibleUsers.clear();
     invisibleUsers.clear();
     visibility.value = 0;
+    publishedAt.value = null;
+    publishedUntil.value = null;
     isDraft.value = false;
     isRestoreFromLocal.value = false;
     lastSaveTime.value = null;

lib/main.dart

@@ -10,6 +10,7 @@ import 'package:sentry_flutter/sentry_flutter.dart';
 import 'package:solian/bootstrapper.dart';
 import 'package:solian/firebase_options.dart';
 import 'package:solian/platform.dart';
+import 'package:solian/providers/attachment_uploader.dart';
 import 'package:solian/providers/theme_switcher.dart';
 import 'package:solian/providers/websocket.dart';
 import 'package:solian/providers/auth.dart';
@@ -125,5 +126,6 @@ class SolianApp extends StatelessWidget {
     Get.lazyPut(() => ChannelProvider());
     Get.lazyPut(() => RealmProvider());
     Get.lazyPut(() => ChatCallProvider());
+    Get.lazyPut(() => AttachmentUploaderController());
   }
 }

lib/providers/attachment_uploader.dart

@@ -0,0 +1,165 @@
+import 'dart:io';
+import 'dart:typed_data';
+
+import 'package:get/get.dart';
+import 'package:solian/models/attachment.dart';
+import 'package:solian/providers/content/attachment.dart';
+
+class AttachmentUploadTask {
+  File file;
+  String usage;
+  Map<String, dynamic>? metadata;
+
+  double progress = 0;
+  bool isUploading = false;
+  bool isCompleted = false;
+
+  AttachmentUploadTask({
+    required this.file,
+    required this.usage,
+    this.metadata,
+  });
+}
+
+class AttachmentUploaderController extends GetxController {
+  RxBool isUploading = false.obs;
+  RxDouble progressOfUpload = 0.0.obs;
+  RxList<AttachmentUploadTask> queueOfUpload = RxList.empty(growable: true);
+
+  void enqueueTask(AttachmentUploadTask task) {
+    if (isUploading.value) throw Exception('uploading blocked');
+    queueOfUpload.add(task);
+  }
+
+  void dequeueTask(AttachmentUploadTask task) {
+    if (isUploading.value) throw Exception('uploading blocked');
+    queueOfUpload.remove(task);
+  }
+
+  Future<Attachment> performSingleTask(int queueIndex) async {
+    isUploading.value = true;
+    progressOfUpload.value = 0;
+
+    queueOfUpload[queueIndex].isUploading = true;
+    queueOfUpload.refresh();
+
+    final task = queueOfUpload[queueIndex];
+    final result = await _rawUploadAttachment(
+      await task.file.readAsBytes(),
+      task.file.path,
+      task.usage,
+      null,
+      onProgress: (value) {
+        queueOfUpload[queueIndex].progress = value;
+        queueOfUpload.refresh();
+        progressOfUpload.value = value;
+      },
+    );
+
+    queueOfUpload.removeAt(queueIndex);
+    queueOfUpload.refresh();
+
+    isUploading.value = false;
+
+    return result;
+  }
+
+  Future<void> performUploadQueue({
+    required Function(Attachment item) onData,
+  }) async {
+    isUploading.value = true;
+    progressOfUpload.value = 0;
+
+    for (var idx = 0; idx < queueOfUpload.length; idx++) {
+      queueOfUpload[idx].isUploading = true;
+      queueOfUpload.refresh();
+
+      final task = queueOfUpload[idx];
+      final result = await _rawUploadAttachment(
+        await task.file.readAsBytes(),
+        task.file.path,
+        task.usage,
+        null,
+        onProgress: (value) {
+          queueOfUpload[idx].progress = value;
+          queueOfUpload.refresh();
+          progressOfUpload.value = (idx + value) / queueOfUpload.length;
+        },
+      );
+      progressOfUpload.value = (idx + 1) / queueOfUpload.length;
+      onData(result);
+
+      queueOfUpload[idx].isUploading = false;
+      queueOfUpload[idx].isCompleted = false;
+      queueOfUpload.refresh();
+    }
+
+    queueOfUpload.clear();
+    queueOfUpload.refresh();
+    isUploading.value = false;
+  }
+
+  Future<void> uploadAttachmentWithCallback(
+    Uint8List data,
+    String path,
+    String usage,
+    Map<String, dynamic>? metadata,
+    Function(Attachment) callback,
+  ) async {
+    if (isUploading.value) throw Exception('uploading blocked');
+
+    isUploading.value = true;
+    final result = await _rawUploadAttachment(
+      data,
+      path,
+      usage,
+      metadata,
+      onProgress: (progress) {
+        progressOfUpload.value = progress;
+      },
+    );
+    isUploading.value = false;
+    callback(result);
+  }
+
+  Future<Attachment> uploadAttachment(
+    Uint8List data,
+    String path,
+    String usage,
+    Map<String, dynamic>? metadata,
+  ) async {
+    if (isUploading.value) throw Exception('uploading blocked');
+
+    isUploading.value = true;
+    final result = await _rawUploadAttachment(
+      data,
+      path,
+      usage,
+      metadata,
+      onProgress: (progress) {
+        progressOfUpload.value = progress;
+      },
+    );
+    isUploading.value = false;
+    return result;
+  }
+
+  Future<Attachment> _rawUploadAttachment(
+      Uint8List data, String path, String usage, Map<String, dynamic>? metadata,
+      {Function(double)? onProgress}) async {
+    final AttachmentProvider provider = Get.find();
+    try {
+      final resp = await provider.createAttachment(
+        data,
+        path,
+        usage,
+        metadata,
+        onProgress: onProgress,
+      );
+      var result = Attachment.fromJson(resp.body);
+      return result;
+    } catch (err) {
+      rethrow;
+    }
+  }
+}

lib/providers/content/attachment.dart

@@ -38,11 +38,8 @@ class AttachmentProvider extends GetConnect {
   }
 
   Future<Response> createAttachment(
-    Uint8List data,
+      Uint8List data, String path, String usage, Map<String, dynamic>? metadata,
-    String path,
+      {Function(double)? onProgress}) async {
-    String usage,
-    Map<String, dynamic>? metadata,
-  ) async {
     final AuthProvider auth = Get.find();
     if (auth.isAuthorized.isFalse) throw Exception('unauthorized');
 
@@ -71,7 +68,13 @@ class AttachmentProvider extends GetConnect {
       if (mimetypeOverride != null) 'mimetype': mimetypeOverride,
       'metadata': jsonEncode(metadata),
     });
-    final resp = await client.post('/attachments', payload);
+    final resp = await client.post(
+      '/attachments',
+      payload,
+      uploadProgress: (progress) {
+        if (onProgress != null) onProgress(progress);
+      },
+    );
     if (resp.statusCode != 200) {
       throw Exception(resp.bodyString);
     }

lib/translations/en_us.dart

@@ -157,6 +157,11 @@ const i18nEnglish = {
   'reactCompleted': 'Your reaction has been added',
   'reactUncompleted': 'Your reaction has been removed',
   'attachmentUploadBy': 'Upload by',
+  'attachmentAutoUpload': 'Auto Upload',
+  'attachmentUploadQueue': 'Upload Queue',
+  'attachmentUploadQueueStart': 'Start All',
+  'attachmentAttached': 'Exists Files',
+  'attachmentUploadBlocked': 'Upload blocked, there is currently a task in progress...',
   'attachmentAdd': 'Attach attachments',
   'attachmentAddGalleryPhoto': 'Gallery photo',
   'attachmentAddGalleryVideo': 'Gallery video',

lib/translations/zh_cn.dart

@@ -146,6 +146,11 @@ const i18nSimplifiedChinese = {
   'reactCompleted': '你的反应已被添加',
   'reactUncompleted': '你的反应已被移除',
   'attachmentUploadBy': '由上传',
+  'attachmentAutoUpload': '自动上传',
+  'attachmentUploadQueue': '上传队列',
+  'attachmentUploadQueueStart': '整队上传',
+  'attachmentAttached': '已附附件',
+  'attachmentUploadBlocked': '上传受阻，当前已有任务进行中……',
   'attachmentAdd': '附加附件',
   'attachmentAddGalleryPhoto': '相册照片',
   'attachmentAddGalleryVideo': '相册视频',

lib/widgets/attachments/attachment_attr_editor.dart

@@ -0,0 +1,132 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_animate/flutter_animate.dart';
+import 'package:get/get.dart';
+import 'package:solian/exts.dart';
+import 'package:solian/models/attachment.dart';
+import 'package:solian/providers/content/attachment.dart';
+
+class AttachmentAttrEditorDialog extends StatefulWidget {
+  final Attachment item;
+  final Function(Attachment item) onUpdate;
+
+  const AttachmentAttrEditorDialog({
+    super.key,
+    required this.item,
+    required this.onUpdate,
+  });
+
+  @override
+  State<AttachmentAttrEditorDialog> createState() => _AttachmentAttrEditorDialogState();
+}
+
+class _AttachmentAttrEditorDialogState extends State<AttachmentAttrEditorDialog> {
+  final _altController = TextEditingController();
+
+  bool _isBusy = false;
+  bool _isMature = false;
+
+  Future<Attachment?> _updateAttachment() async {
+    final AttachmentProvider provider = Get.find();
+
+    setState(() => _isBusy = true);
+    try {
+      final resp = await provider.updateAttachment(
+        widget.item.id,
+        _altController.value.text,
+        widget.item.usage,
+        isMature: _isMature,
+      );
+
+      Get.find<AttachmentProvider>().clearCache(id: widget.item.id);
+
+      setState(() => _isBusy = false);
+      return Attachment.fromJson(resp.body);
+    } catch (e) {
+      context.showErrorDialog(e);
+      setState(() => _isBusy = false);
+      return null;
+    }
+  }
+
+  void syncWidget() {
+    _isMature = widget.item.isMature;
+    _altController.text = widget.item.alt;
+  }
+
+  @override
+  void initState() {
+    syncWidget();
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return AlertDialog(
+      title: Text('attachmentSetting'.tr),
+      content: Container(
+        constraints: const BoxConstraints(minWidth: 400),
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            if (_isBusy)
+              ClipRRect(
+                borderRadius: const BorderRadius.all(Radius.circular(8)),
+                child: const LinearProgressIndicator().animate().scaleX(),
+              ),
+            const SizedBox(height: 18),
+            TextField(
+              controller: _altController,
+              decoration: InputDecoration(
+                isDense: true,
+                prefixIcon: const Icon(Icons.image_not_supported),
+                border: const OutlineInputBorder(),
+                labelText: 'attachmentAlt'.tr,
+              ),
+              onTapOutside: (_) =>
+                  FocusManager.instance.primaryFocus?.unfocus(),
+            ),
+            const SizedBox(height: 8),
+            CheckboxListTile(
+              contentPadding: const EdgeInsets.only(left: 4, right: 18),
+              shape: const RoundedRectangleBorder(
+                  borderRadius: BorderRadius.all(Radius.circular(10))),
+              title: Text('matureContent'.tr),
+              secondary: const Icon(Icons.visibility_off),
+              value: _isMature,
+              onChanged: (newValue) {
+                setState(() => _isMature = newValue ?? false);
+              },
+              controlAffinity: ListTileControlAffinity.leading,
+            ),
+          ],
+        ),
+      ),
+      actionsAlignment: MainAxisAlignment.spaceBetween,
+      actions: <Widget>[
+        Row(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            TextButton(
+              style: TextButton.styleFrom(
+                  foregroundColor:
+                  Theme.of(context).colorScheme.onSurfaceVariant),
+              onPressed: () => Navigator.pop(context),
+              child: Text('cancel'.tr),
+            ),
+            TextButton(
+              child: Text('apply'.tr),
+              onPressed: () {
+                _updateAttachment().then((value) {
+                  if (value != null) {
+                    widget.onUpdate(value);
+                    Navigator.pop(context);
+                  }
+                });
+              },
+            ),
+          ],
+        ),
+      ],
+    );
+  }
+}

lib/widgets/attachments/attachment_editor.dart

@@ -1,7 +1,6 @@
 import 'dart:async';
 import 'dart:io';
 import 'dart:math' as math;
-import 'dart:typed_data';
 
 import 'package:desktop_drop/desktop_drop.dart';
 import 'package:dismissible_page/dismissible_page.dart';
@@ -15,20 +14,24 @@ import 'package:path/path.dart' show basename;
 import 'package:solian/exts.dart';
 import 'package:solian/models/attachment.dart';
 import 'package:solian/platform.dart';
+import 'package:solian/providers/attachment_uploader.dart';
 import 'package:solian/providers/auth.dart';
 import 'package:solian/providers/content/attachment.dart';
+import 'package:solian/widgets/attachments/attachment_attr_editor.dart';
 import 'package:solian/widgets/attachments/attachment_fullscreen.dart';
 
 class AttachmentEditorPopup extends StatefulWidget {
   final String usage;
-  final List<int> current;
+  final List<int> initialAttachments;
-  final void Function(List<int> data) onUpdate;
+  final void Function(int) onAdd;
+  final void Function(int) onRemove;
 
   const AttachmentEditorPopup({
     super.key,
     required this.usage,
-    required this.current,
+    required this.initialAttachments,
-    required this.onUpdate,
+    required this.onAdd,
+    required this.onRemove,
   });
 
   @override
@@ -37,6 +40,9 @@ class AttachmentEditorPopup extends StatefulWidget {
 
 class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
   final _imagePicker = ImagePicker();
+  final AttachmentUploaderController _uploadController = Get.find();
+
+  bool _isAutoUpload = false;
 
   bool _isBusy = false;
   bool _isFirstTimeBusy = true;
@@ -50,22 +56,12 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
     final medias = await _imagePicker.pickMultiImage();
     if (medias.isEmpty) return;
 
-    setState(() => _isBusy = true);
-
     for (final media in medias) {
       final file = File(media.path);
-      try {
+      _enqueueTask(
-        await _uploadAttachment(
+        AttachmentUploadTask(file: file, usage: widget.usage),
-          await file.readAsBytes(),
+      );
-          file.path,
-          null,
-        );
-      } catch (err) {
-        context.showErrorDialog(err);
-      }
     }
-
-    setState(() => _isBusy = false);
   }
 
   Future<void> _pickVideoToUpload() async {
@@ -75,17 +71,10 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
     final media = await _imagePicker.pickVideo(source: ImageSource.gallery);
     if (media == null) return;
 
-    setState(() => _isBusy = true);
-
     final file = File(media.path);
-
+    _enqueueTask(
-    try {
+      AttachmentUploadTask(file: file, usage: widget.usage),
-      await _uploadAttachment(await file.readAsBytes(), file.path, null);
+    );
-    } catch (err) {
-      context.showErrorDialog(err);
-    }
-
-    setState(() => _isBusy = false);
   }
 
   Future<void> _pickFileToUpload() async {
@@ -97,19 +86,13 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
     );
     if (result == null) return;
 
-    setState(() => _isBusy = true);
-
     List<File> files = result.paths.map((path) => File(path!)).toList();
 
     for (final file in files) {
-      try {
+      _enqueueTask(
-        await _uploadAttachment(await file.readAsBytes(), file.path, null);
+        AttachmentUploadTask(file: file, usage: widget.usage),
-      } catch (err) {
+      );
-        context.showErrorDialog(err);
-      }
     }
-
-    setState(() => _isBusy = false);
   }
 
   Future<void> _takeMediaToUpload(bool isVideo) async {
@@ -124,50 +107,30 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
     }
     if (media == null) return;
 
-    setState(() => _isBusy = true);
-
     final file = File(media.path);
-    try {
+    _enqueueTask(
-      await _uploadAttachment(await file.readAsBytes(), file.path, null);
+      AttachmentUploadTask(file: file, usage: widget.usage),
-    } catch (err) {
+    );
-      context.showErrorDialog(err);
-    }
-
-    setState(() => _isBusy = false);
   }
 
   void _pasteFileToUpload() async {
     final data = await Pasteboard.image;
     if (data == null) return;
 
-    setState(() => _isBusy = true);
+    if (_uploadController.isUploading.value) return;
 
-    _uploadAttachment(data, 'Pasted Image', null);
+    _uploadController.uploadAttachmentWithCallback(
-
+      data,
-    setState(() => _isBusy = false);
+      'Pasted Image',
-  }
+      widget.usage,
-
+      null,
-  Future<void> _uploadAttachment(
+      (item) {
-      Uint8List data, String path, Map<String, dynamic>? metadata) async {
+        widget.onAdd(item.id);
-    final AttachmentProvider provider = Get.find();
+        if (mounted) {
-    try {
+          setState(() => _attachments.add(item));
-      context.showSnackbar((PlatformInfo.isWeb
+        }
-              ? 'attachmentUploadingWebMode'
+      },
-              : 'attachmentUploading')
+    );
-          .trParams({'name': basename(path)}));
-      final resp = await provider.createAttachment(
-        data,
-        path,
-        widget.usage,
-        metadata,
-      );
-      var result = Attachment.fromJson(resp.body);
-      setState(() => _attachments.add(result));
-      widget.onUpdate(_attachments.map((e) => e!.id).toList());
-      context.clearSnackbar();
-    } catch (err) {
-      rethrow;
-    }
   }
 
   String _formatBytes(int bytes, {int decimals = 2}) {
@@ -192,21 +155,21 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
   void _revertMetadataList() {
     final AttachmentProvider provider = Get.find();
 
-    if (widget.current.isEmpty) {
+    if (widget.initialAttachments.isEmpty) {
       _isFirstTimeBusy = false;
       return;
     } else {
-      _attachments = List.filled(widget.current.length, null);
+      _attachments = List.filled(widget.initialAttachments.length, null);
     }
 
     setState(() => _isBusy = true);
 
     int progress = 0;
-    for (var idx = 0; idx < widget.current.length; idx++) {
+    for (var idx = 0; idx < widget.initialAttachments.length; idx++) {
-      provider.getMetadata(widget.current[idx]).then((resp) {
+      provider.getMetadata(widget.initialAttachments[idx]).then((resp) {
         progress++;
         _attachments[idx] = resp;
-        if (progress == widget.current.length) {
+        if (progress == widget.initialAttachments.length) {
           setState(() {
             _isBusy = false;
             _isFirstTimeBusy = false;
@@ -230,11 +193,10 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
     showDialog(
       context: context,
       builder: (context) {
-        return AttachmentEditorDialog(
+        return AttachmentAttrEditorDialog(
           item: element,
           onUpdate: (item) {
             setState(() => _attachments[index] = item);
-            widget.onUpdate(_attachments.map((e) => e!.id).toList());
           },
         );
       },
@@ -253,6 +215,107 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
     }
   }
 
+  Widget _buildQueueEntry(AttachmentUploadTask element, int index) {
+    return Container(
+      padding: const EdgeInsets.only(left: 16, right: 8, bottom: 16),
+      child: Card(
+        color: Theme.of(context).colorScheme.surface,
+        child: Column(
+          children: [
+            SizedBox(
+              height: 54,
+              child: Row(
+                children: [
+                  Expanded(
+                    child: Column(
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        Text(
+                          basename(element.file.path),
+                          overflow: TextOverflow.ellipsis,
+                          maxLines: 1,
+                          style: const TextStyle(
+                            fontWeight: FontWeight.bold,
+                            fontFamily: 'monospace',
+                          ),
+                        ),
+                        FutureBuilder(
+                          future: element.file.length(),
+                          builder: (context, snapshot) {
+                            if (!snapshot.hasData) {
+                              return const Text(
+                                '- Bytes',
+                                style: TextStyle(fontSize: 12),
+                              );
+                            }
+                            return Text(
+                              _formatBytes(snapshot.data!),
+                              style: const TextStyle(fontSize: 12),
+                            );
+                          },
+                        ),
+                      ],
+                    ),
+                  ),
+                  if (element.isUploading)
+                    SizedBox(
+                      width: 40,
+                      height: 38,
+                      child: Center(
+                        child: SizedBox(
+                          width: 20,
+                          height: 20,
+                          child: CircularProgressIndicator(
+                            strokeWidth: 2.5,
+                            value: element.progress,
+                          ),
+                        ),
+                      ),
+                    ),
+                  if (element.isCompleted)
+                    const SizedBox(
+                      width: 40,
+                      height: 38,
+                      child: Center(
+                        child: Icon(Icons.check),
+                      ),
+                    ),
+                  if (!element.isCompleted && !element.isUploading)
+                    IconButton(
+                      color: Colors.green,
+                      icon: const Icon(Icons.play_arrow),
+                      visualDensity: const VisualDensity(horizontal: -4),
+                      onPressed: _uploadController.isUploading.value
+                          ? null
+                          : () {
+                              _uploadController
+                                  .performSingleTask(index)
+                                  .then((r) {
+                                widget.onAdd(r.id);
+                                if (mounted) {
+                                  setState(() => _attachments.add(r));
+                                }
+                              });
+                            },
+                    ),
+                  if (!element.isCompleted && !element.isUploading)
+                    IconButton(
+                      color: Colors.red,
+                      icon: const Icon(Icons.remove_circle),
+                      visualDensity: const VisualDensity(horizontal: -4),
+                      onPressed: () {
+                        _uploadController.dequeueTask(element);
+                      },
+                    ),
+                ],
+              ).paddingSymmetric(vertical: 8, horizontal: 16),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+
   Widget _buildListEntry(Attachment element, int index) {
     var fileType = element.mimetype.split('/').firstOrNull;
     fileType ??= 'unknown';
@@ -278,8 +341,9 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
                           overflow: TextOverflow.ellipsis,
                           maxLines: 1,
                           style: const TextStyle(
-                              fontWeight: FontWeight.bold,
+                            fontWeight: FontWeight.bold,
-                              fontFamily: 'monospace'),
+                            fontFamily: 'monospace',
+                          ),
                         ),
                         Text(
                           '${fileType[0].toUpperCase()}${fileType.substring(1)} · ${_formatBytes(element.size)}',
@@ -314,21 +378,20 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
                         onTap: () => _showEdit(element, index),
                       ),
                       PopupMenuItem(
-                          child: ListTile(
+                        child: ListTile(
-                            title: Text('delete'.tr),
+                          title: Text('delete'.tr),
-                            leading: const Icon(Icons.delete),
+                          leading: const Icon(Icons.delete),
-                            contentPadding: const EdgeInsets.symmetric(
+                          contentPadding: const EdgeInsets.symmetric(
-                              horizontal: 8,
+                            horizontal: 8,
-                            ),
                           ),
-                          onTap: () {
+                        ),
-                            _deleteAttachment(element).then((_) {
+                        onTap: () {
-                              setState(() => _attachments.removeAt(index));
+                          _deleteAttachment(element).then((_) {
-                              widget.onUpdate(
+                            widget.onRemove(element.id);
-                                _attachments.map((e) => e!.id).toList(),
+                            setState(() => _attachments.removeAt(index));
-                              );
+                          });
-                            });
+                        },
-                          }),
+                      ),
                     ],
                   ),
                 ],
@@ -340,6 +403,22 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
     );
   }
 
+  void _enqueueTask(AttachmentUploadTask task) {
+    _uploadController.enqueueTask(task);
+    if (_isAutoUpload) {
+      _startUploading();
+    }
+  }
+
+  void _startUploading() {
+    _uploadController.performUploadQueue(onData: (r) {
+      widget.onAdd(r.id);
+      if (mounted) {
+        setState(() => _attachments.add(r));
+      }
+    });
+  }
+
   @override
   void initState() {
     super.initState();
@@ -353,222 +432,208 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
     return SafeArea(
       child: DropTarget(
         onDragDone: (detail) async {
-          setState(() => _isBusy = true);
+          if (_uploadController.isUploading.value) return;
           for (final file in detail.files) {
-            final data = await file.readAsBytes();
+            _enqueueTask(
-            _uploadAttachment(data, file.path, null);
+              AttachmentUploadTask(file: File(file.path), usage: widget.usage),
+            );
           }
-          setState(() => _isBusy = false);
         },
         child: Column(
           crossAxisAlignment: CrossAxisAlignment.start,
           children: [
-            Text(
+            Row(
-              'attachmentAdd'.tr,
+              children: [
-              style: Theme.of(context).textTheme.headlineSmall,
+                Expanded(
+                  child: Row(
+                    mainAxisSize: MainAxisSize.min,
+                    children: [
+                      Text(
+                        'attachmentAdd'.tr,
+                        style: Theme.of(context).textTheme.headlineSmall,
+                      ),
+                      const SizedBox(width: 10),
+                      Obx(() {
+                        if (_uploadController.isUploading.value) {
+                          return const SizedBox(
+                            width: 18,
+                            height: 18,
+                            child: CircularProgressIndicator(
+                              strokeWidth: 2.5,
+                            ),
+                          );
+                        }
+                        return const SizedBox();
+                      }),
+                    ],
+                  ),
+                ),
+                Text('attachmentAutoUpload'.tr),
+                const SizedBox(width: 8),
+                Switch(
+                  value: _isAutoUpload,
+                  onChanged: (bool? value) {
+                    if (value != null) {
+                      setState(() => _isAutoUpload = value);
+                    }
+                  },
+                ),
+              ],
             ).paddingOnly(left: 24, right: 24, top: 32, bottom: 16),
             if (_isBusy) const LinearProgressIndicator().animate().scaleX(),
             Expanded(
-              child: Builder(builder: (context) {
+              child: CustomScrollView(
-                if (_isFirstTimeBusy && _isBusy) {
+                slivers: [
-                  return const Center(
+                  Obx(() {
-                    child: CircularProgressIndicator(),
+                    if (_uploadController.queueOfUpload.isNotEmpty) {
-                  );
+                      return SliverPadding(
-                }
+                        padding: const EdgeInsets.only(bottom: 8),
-
+                        sliver: SliverToBoxAdapter(
-                return ListView.builder(
+                          child: Row(
-                  itemCount: _attachments.length,
+                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                  itemBuilder: (context, index) {
+                            children: [
-                    final element = _attachments[index];
+                              Text(
-                    return _buildListEntry(element!, index);
+                                'attachmentUploadQueue'.tr,
-                  },
+                                style: Theme.of(context).textTheme.bodyLarge,
-                );
+                              ),
-              }),
+                              Obx(() {
-            ),
+                                if (_uploadController.isUploading.value) {
-            const Divider(thickness: 0.3, height: 0.3),
+                                  return const SizedBox();
-            SizedBox(
+                                }
-              height: 64,
+                                return TextButton(
-              child: SingleChildScrollView(
+                                  child: Text('attachmentUploadQueueStart'.tr),
-                scrollDirection: Axis.horizontal,
+                                  onPressed: () {
-                child: Wrap(
+                                    _startUploading();
-                  spacing: 8,
+                                  },
-                  runSpacing: 0,
+                                );
-                  alignment: WrapAlignment.center,
+                              }),
-                  runAlignment: WrapAlignment.center,
+                            ],
-                  children: [
+                          ).paddingOnly(left: 24, right: 24),
-                    if (PlatformInfo.isDesktop ||
+                        ),
-                        PlatformInfo.isIOS ||
+                      );
-                        PlatformInfo.isWeb)
+                    }
-                      ElevatedButton.icon(
+                    return const SliverToBoxAdapter(child: SizedBox());
-                        icon: const Icon(Icons.paste),
+                  }),
-                        label: Text('attachmentAddClipboard'.tr),
+                  Obx(() {
-                        style: const ButtonStyle(visualDensity: density),
+                    if (_uploadController.queueOfUpload.isNotEmpty) {
-                        onPressed: () => _pasteFileToUpload(),
+                      return SliverPadding(
+                        padding: const EdgeInsets.only(bottom: 8),
+                        sliver: SliverList.builder(
+                          itemCount: _uploadController.queueOfUpload.length,
+                          itemBuilder: (context, index) {
+                            final element =
+                                _uploadController.queueOfUpload[index];
+                            return _buildQueueEntry(element, index);
+                          },
+                        ),
+                      );
+                    }
+                    return const SliverToBoxAdapter(child: SizedBox());
+                  }),
+                  if (_attachments.isNotEmpty)
+                    SliverPadding(
+                      padding: const EdgeInsets.only(bottom: 8),
+                      sliver: SliverToBoxAdapter(
+                        child: Text(
+                          'attachmentAttached'.tr,
+                          style: Theme.of(context).textTheme.bodyLarge,
+                        ).paddingOnly(left: 24, right: 24),
                       ),
-                    ElevatedButton.icon(
-                      icon: const Icon(Icons.add_photo_alternate),
-                      label: Text('attachmentAddGalleryPhoto'.tr),
-                      style: const ButtonStyle(visualDensity: density),
-                      onPressed: () => _pickPhotoToUpload(),
                     ),
-                    ElevatedButton.icon(
+                  if (_attachments.isNotEmpty)
-                      icon: const Icon(Icons.add_road),
+                    Builder(builder: (context) {
-                      label: Text('attachmentAddGalleryVideo'.tr),
+                      if (_isFirstTimeBusy && _isBusy) {
-                      style: const ButtonStyle(visualDensity: density),
+                        return const SliverFillRemaining(
-                      onPressed: () => _pickVideoToUpload(),
+                          child: Center(
-                    ),
+                            child: CircularProgressIndicator(),
-                    ElevatedButton.icon(
+                          ),
-                      icon: const Icon(Icons.photo_camera_back),
+                        );
-                      label: Text('attachmentAddCameraPhoto'.tr),
+                      }
-                      style: const ButtonStyle(visualDensity: density),
+
-                      onPressed: () => _takeMediaToUpload(false),
+                      return SliverList.builder(
-                    ),
+                        itemCount: _attachments.length,
-                    ElevatedButton.icon(
+                        itemBuilder: (context, index) {
-                      icon: const Icon(Icons.video_camera_back_outlined),
+                          final element = _attachments[index];
-                      label: Text('attachmentAddCameraVideo'.tr),
+                          return _buildListEntry(element!, index);
-                      style: const ButtonStyle(visualDensity: density),
+                        },
-                      onPressed: () => _takeMediaToUpload(true),
+                      );
-                    ),
+                    }),
-                    ElevatedButton.icon(
+                ],
-                      icon: const Icon(Icons.file_present_rounded),
-                      label: Text('attachmentAddFile'.tr),
-                      style: const ButtonStyle(visualDensity: density),
-                      onPressed: () => _pickFileToUpload(),
-                    ),
-                  ],
-                ).paddingSymmetric(horizontal: 12),
               ),
-            )
+            ),
+            Obx(() {
+              return IgnorePointer(
+                ignoring: _uploadController.isUploading.value,
+                child: Container(
+                  height: 64,
+                  decoration: BoxDecoration(
+                    border: Border(
+                      top: BorderSide(
+                        color: Theme.of(context).dividerColor,
+                        width: 0.3,
+                      ),
+                    ),
+                  ),
+                  child: SingleChildScrollView(
+                    scrollDirection: Axis.horizontal,
+                    child: Wrap(
+                      spacing: 8,
+                      runSpacing: 0,
+                      alignment: WrapAlignment.center,
+                      runAlignment: WrapAlignment.center,
+                      children: [
+                        if (PlatformInfo.isDesktop ||
+                            PlatformInfo.isIOS ||
+                            PlatformInfo.isWeb)
+                          ElevatedButton.icon(
+                            icon: const Icon(Icons.paste),
+                            label: Text('attachmentAddClipboard'.tr),
+                            style: const ButtonStyle(visualDensity: density),
+                            onPressed: () => _pasteFileToUpload(),
+                          ),
+                        ElevatedButton.icon(
+                          icon: const Icon(Icons.add_photo_alternate),
+                          label: Text('attachmentAddGalleryPhoto'.tr),
+                          style: const ButtonStyle(visualDensity: density),
+                          onPressed: () => _pickPhotoToUpload(),
+                        ),
+                        ElevatedButton.icon(
+                          icon: const Icon(Icons.add_road),
+                          label: Text('attachmentAddGalleryVideo'.tr),
+                          style: const ButtonStyle(visualDensity: density),
+                          onPressed: () => _pickVideoToUpload(),
+                        ),
+                        ElevatedButton.icon(
+                          icon: const Icon(Icons.photo_camera_back),
+                          label: Text('attachmentAddCameraPhoto'.tr),
+                          style: const ButtonStyle(visualDensity: density),
+                          onPressed: () => _takeMediaToUpload(false),
+                        ),
+                        ElevatedButton.icon(
+                          icon: const Icon(Icons.video_camera_back_outlined),
+                          label: Text('attachmentAddCameraVideo'.tr),
+                          style: const ButtonStyle(visualDensity: density),
+                          onPressed: () => _takeMediaToUpload(true),
+                        ),
+                        ElevatedButton.icon(
+                          icon: const Icon(Icons.file_present_rounded),
+                          label: Text('attachmentAddFile'.tr),
+                          style: const ButtonStyle(visualDensity: density),
+                          onPressed: () => _pickFileToUpload(),
+                        ),
+                      ],
+                    ).paddingSymmetric(horizontal: 12),
+                  ),
+                )
+                    .animate(
+                      target: _uploadController.isUploading.value ? 0 : 1,
+                    )
+                    .fade(duration: 100.ms),
+              );
+            }),
           ],
         ),
       ),
     );
   }
 }
-
-class AttachmentEditorDialog extends StatefulWidget {
-  final Attachment item;
-  final Function(Attachment item) onUpdate;
-
-  const AttachmentEditorDialog({
-    super.key,
-    required this.item,
-    required this.onUpdate,
-  });
-
-  @override
-  State<AttachmentEditorDialog> createState() => _AttachmentEditorDialogState();
-}
-
-class _AttachmentEditorDialogState extends State<AttachmentEditorDialog> {
-  final _altController = TextEditingController();
-
-  bool _isBusy = false;
-  bool _isMature = false;
-
-  Future<Attachment?> _updateAttachment() async {
-    final AttachmentProvider provider = Get.find();
-
-    setState(() => _isBusy = true);
-    try {
-      final resp = await provider.updateAttachment(
-        widget.item.id,
-        _altController.value.text,
-        widget.item.usage,
-        isMature: _isMature,
-      );
-
-      Get.find<AttachmentProvider>().clearCache(id: widget.item.id);
-
-      setState(() => _isBusy = false);
-      return Attachment.fromJson(resp.body);
-    } catch (e) {
-      context.showErrorDialog(e);
-
-      setState(() => _isBusy = false);
-      return null;
-    }
-  }
-
-  void syncWidget() {
-    _isMature = widget.item.isMature;
-    _altController.text = widget.item.alt;
-  }
-
-  @override
-  void initState() {
-    syncWidget();
-    super.initState();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return AlertDialog(
-      title: Text('attachmentSetting'.tr),
-      content: Container(
-        constraints: const BoxConstraints(minWidth: 400),
-        child: Column(
-          mainAxisSize: MainAxisSize.min,
-          children: [
-            if (_isBusy)
-              ClipRRect(
-                borderRadius: const BorderRadius.all(Radius.circular(8)),
-                child: const LinearProgressIndicator().animate().scaleX(),
-              ),
-            const SizedBox(height: 18),
-            TextField(
-              controller: _altController,
-              decoration: InputDecoration(
-                isDense: true,
-                prefixIcon: const Icon(Icons.image_not_supported),
-                border: const OutlineInputBorder(),
-                labelText: 'attachmentAlt'.tr,
-              ),
-              onTapOutside: (_) =>
-                  FocusManager.instance.primaryFocus?.unfocus(),
-            ),
-            const SizedBox(height: 8),
-            CheckboxListTile(
-              contentPadding: const EdgeInsets.only(left: 4, right: 18),
-              shape: const RoundedRectangleBorder(
-                  borderRadius: BorderRadius.all(Radius.circular(10))),
-              title: Text('matureContent'.tr),
-              secondary: const Icon(Icons.visibility_off),
-              value: _isMature,
-              onChanged: (newValue) {
-                setState(() => _isMature = newValue ?? false);
-              },
-              controlAffinity: ListTileControlAffinity.leading,
-            ),
-          ],
-        ),
-      ),
-      actionsAlignment: MainAxisAlignment.spaceBetween,
-      actions: <Widget>[
-        Row(
-          mainAxisSize: MainAxisSize.min,
-          children: [
-            TextButton(
-              style: TextButton.styleFrom(
-                  foregroundColor:
-                      Theme.of(context).colorScheme.onSurfaceVariant),
-              onPressed: () => Navigator.pop(context),
-              child: Text('cancel'.tr),
-            ),
-            TextButton(
-              child: Text('apply'.tr),
-              onPressed: () {
-                _updateAttachment().then((value) {
-                  if (value != null) {
-                    widget.onUpdate(value);
-                    Navigator.pop(context);
-                  }
-                });
-              },
-            ),
-          ],
-        ),
-      ],
-    );
-  }
-}

lib/widgets/chat/chat_event.dart

@@ -112,7 +112,9 @@ class ChatEvent extends StatelessWidget {
       case 'messages.edit':
         return ChatEventMessageActionLog(
           icon: const Icon(Icons.edit_note, size: 16),
-          text: 'messageEditDesc'.trParams({'id': '#${item.id}'}),
+          text: 'messageEditDesc'.trParams({
+            'id': '#${item.body['related_event']}',
+          }),
           isMerged: isMerged,
           isHasMerged: isHasMerged,
           isQuote: isQuote,
@@ -120,7 +122,9 @@ class ChatEvent extends StatelessWidget {
       case 'messages.delete':
         return ChatEventMessageActionLog(
           icon: const Icon(Icons.cancel_schedule_send, size: 16),
-          text: 'messageDeleteDesc'.trParams({'id': '#${item.id}'}),
+          text: 'messageDeleteDesc'.trParams({
+            'id': '#${item.body['related_event']}',
+          }),
           isMerged: isMerged,
           isHasMerged: isHasMerged,
           isQuote: isQuote,

lib/widgets/chat/chat_message_input.dart

@@ -38,7 +38,7 @@ class _ChatMessageInputState extends State<ChatMessageInput> {
   final TextEditingController _textController = TextEditingController();
   final FocusNode _focusNode = FocusNode();
 
-  List<int> _attachments = List.empty(growable: true);
+  final List<int> _attachments = List.empty(growable: true);
 
   Event? _editTo;
   Event? _replyTo;
@@ -48,8 +48,17 @@ class _ChatMessageInputState extends State<ChatMessageInput> {
       context: context,
       builder: (context) => AttachmentEditorPopup(
         usage: 'm.attachment',
-        current: _attachments,
+        initialAttachments: _attachments,
-        onUpdate: (value) => _attachments = value,
+        onAdd: (value) {
+          setState(() {
+            _attachments.add(value);
+          });
+        },
+        onRemove: (value) {
+          setState(() {
+            _attachments.remove(value);
+          });
+        },
       ),
     );
   }