🚑 Hot fix thumbnail duration issue

🚀 Launch 1.2.1+33
✨ Attachment thumbnail
2024-09-10 23:52:10 +08:00 · 2024-09-10 23:46:08 +08:00 · 2024-09-10 22:47:28 +08:00 · 2024-09-10 21:53:05 +08:00 · 2024-09-10 21:36:10 +08:00
17 changed files with 668 additions and 375 deletions
--- a/ios/Podfile.lock
+++ b/ios/Podfile.lock
@ -1,6 +1,4 @@
 PODS:
-  - audio_session (0.0.1):
-    - Flutter
  - connectivity_plus (0.0.1):
    - Flutter
    - FlutterMacOS
@ -223,11 +221,15 @@ PODS:
    - TOCropViewController (~> 2.7.4)
  - image_picker_ios (0.0.1):
    - Flutter
-  - just_audio (0.0.1):
-    - Flutter
  - livekit_client (2.2.4):
    - Flutter
    - WebRTC-SDK (= 125.6422.04)
+  - media_kit_libs_ios_video (1.0.4):
+    - Flutter
+  - media_kit_native_event_loop (1.0.0):
+    - Flutter
+  - media_kit_video (0.0.1):
+    - Flutter
  - nanopb (3.30910.0):
    - nanopb/decode (= 3.30910.0)
    - nanopb/encode (= 3.30910.0)
@ -249,6 +251,8 @@ PODS:
    - PromisesObjC (= 2.4.0)
  - protocol_handler_ios (0.0.1):
    - Flutter
+  - screen_brightness_ios (0.1.0):
+    - Flutter
  - SDWebImage (5.19.7):
    - SDWebImage/Core (= 5.19.7)
  - SDWebImage/Core (5.19.7)
@ -264,15 +268,13 @@ PODS:
  - TOCropViewController (2.7.4)
  - url_launcher_ios (0.0.1):
    - Flutter
-  - video_player_avfoundation (0.0.1):
+  - volume_controller (0.0.1):
    - Flutter
-    - FlutterMacOS
  - wakelock_plus (0.0.1):
    - Flutter
  - WebRTC-SDK (125.6422.04)

 DEPENDENCIES:
-  - audio_session (from `.symlinks/plugins/audio_session/ios`)
  - connectivity_plus (from `.symlinks/plugins/connectivity_plus/darwin`)
  - device_info_plus (from `.symlinks/plugins/device_info_plus/ios`)
  - file_picker (from `.symlinks/plugins/file_picker/ios`)
@ -289,19 +291,22 @@ DEPENDENCIES:
  - gal (from `.symlinks/plugins/gal/darwin`)
  - image_cropper (from `.symlinks/plugins/image_cropper/ios`)
  - image_picker_ios (from `.symlinks/plugins/image_picker_ios/ios`)
-  - just_audio (from `.symlinks/plugins/just_audio/ios`)
  - livekit_client (from `.symlinks/plugins/livekit_client/ios`)
+  - media_kit_libs_ios_video (from `.symlinks/plugins/media_kit_libs_ios_video/ios`)
+  - media_kit_native_event_loop (from `.symlinks/plugins/media_kit_native_event_loop/ios`)
+  - media_kit_video (from `.symlinks/plugins/media_kit_video/ios`)
  - package_info_plus (from `.symlinks/plugins/package_info_plus/ios`)
  - pasteboard (from `.symlinks/plugins/pasteboard/ios`)
  - path_provider_foundation (from `.symlinks/plugins/path_provider_foundation/darwin`)
  - permission_handler_apple (from `.symlinks/plugins/permission_handler_apple/ios`)
  - pointer_interceptor_ios (from `.symlinks/plugins/pointer_interceptor_ios/ios`)
  - protocol_handler_ios (from `.symlinks/plugins/protocol_handler_ios/ios`)
+  - screen_brightness_ios (from `.symlinks/plugins/screen_brightness_ios/ios`)
  - share_plus (from `.symlinks/plugins/share_plus/ios`)
  - shared_preferences_foundation (from `.symlinks/plugins/shared_preferences_foundation/darwin`)
  - sqflite (from `.symlinks/plugins/sqflite/darwin`)
  - url_launcher_ios (from `.symlinks/plugins/url_launcher_ios/ios`)
-  - video_player_avfoundation (from `.symlinks/plugins/video_player_avfoundation/darwin`)
+  - volume_controller (from `.symlinks/plugins/volume_controller/ios`)
  - wakelock_plus (from `.symlinks/plugins/wakelock_plus/ios`)

 SPEC REPOS:
@ -334,8 +339,6 @@ SPEC REPOS:
    - WebRTC-SDK

 EXTERNAL SOURCES:
-  audio_session:
-    :path: ".symlinks/plugins/audio_session/ios"
  connectivity_plus:
    :path: ".symlinks/plugins/connectivity_plus/darwin"
  device_info_plus:
@ -368,10 +371,14 @@ EXTERNAL SOURCES:
    :path: ".symlinks/plugins/image_cropper/ios"
  image_picker_ios:
    :path: ".symlinks/plugins/image_picker_ios/ios"
-  just_audio:
-    :path: ".symlinks/plugins/just_audio/ios"
  livekit_client:
    :path: ".symlinks/plugins/livekit_client/ios"
+  media_kit_libs_ios_video:
+    :path: ".symlinks/plugins/media_kit_libs_ios_video/ios"
+  media_kit_native_event_loop:
+    :path: ".symlinks/plugins/media_kit_native_event_loop/ios"
+  media_kit_video:
+    :path: ".symlinks/plugins/media_kit_video/ios"
  package_info_plus:
    :path: ".symlinks/plugins/package_info_plus/ios"
  pasteboard:
@ -384,6 +391,8 @@ EXTERNAL SOURCES:
    :path: ".symlinks/plugins/pointer_interceptor_ios/ios"
  protocol_handler_ios:
    :path: ".symlinks/plugins/protocol_handler_ios/ios"
+  screen_brightness_ios:
+    :path: ".symlinks/plugins/screen_brightness_ios/ios"
  share_plus:
    :path: ".symlinks/plugins/share_plus/ios"
  shared_preferences_foundation:
@ -392,13 +401,12 @@ EXTERNAL SOURCES:
    :path: ".symlinks/plugins/sqflite/darwin"
  url_launcher_ios:
    :path: ".symlinks/plugins/url_launcher_ios/ios"
-  video_player_avfoundation:
-    :path: ".symlinks/plugins/video_player_avfoundation/darwin"
+  volume_controller:
+    :path: ".symlinks/plugins/volume_controller/ios"
  wakelock_plus:
    :path: ".symlinks/plugins/wakelock_plus/ios"

 SPEC CHECKSUMS:
-  audio_session: 088d2483ebd1dc43f51d253d4a1c517d9a2e7207
  connectivity_plus: ddd7f30999e1faaef5967c23d5b6d503d10434db
  device_info_plus: 97af1d7e84681a90d0693e63169a5d50e0839a0d
  DKImagePickerController: 946cec48c7873164274ecc4624d19e3da4c1ef3c
@ -434,8 +442,10 @@ SPEC CHECKSUMS:
  GoogleUtilities: 26a3abef001b6533cf678d3eb38fd3f614b7872d
  image_cropper: 37d40f62177c101ff4c164906d259ea2c3aa70cf
  image_picker_ios: c560581cceedb403a6ff17f2f816d7fea1421fc1
-  just_audio: baa7252489dbcf47a4c7cc9ca663e9661c99aafa
  livekit_client: d079c5f040d4bf2b80440ff0ae997725a183e4bc
+  media_kit_libs_ios_video: a5fe24bc7875ccd6378a0978c13185e1344651c1
+  media_kit_native_event_loop: e6b2ab20cf0746eb1c33be961fcf79667304fa2a
+  media_kit_video: 5da63f157170e5bf303bf85453b7ef6971218a2e
  nanopb: fad817b59e0457d11a5dfbde799381cd727c1275
  package_info_plus: 58f0028419748fad15bf008b270aaa8e54380b1c
  pasteboard: 982969ebaa7c78af3e6cc7761e8f5e77565d9ce0
@ -445,6 +455,7 @@ SPEC CHECKSUMS:
  PromisesObjC: f5707f49cb48b9636751c5b2e7d227e43fba9f47
  PromisesSwift: 9d77319bbe72ebf6d872900551f7eeba9bce2851
  protocol_handler_ios: a5db8abc38526ee326988b808be621e5fd568990
+  screen_brightness_ios: 715ca807df953bf676d339f11464e438143ee625
  SDWebImage: 8a6b7b160b4d710e2a22b6900e25301075c34cb3
  share_plus: 8875f4f2500512ea181eef553c3e27dba5135aad
  shared_preferences_foundation: fcdcbc04712aee1108ac7fda236f363274528f78
@ -452,7 +463,7 @@ SPEC CHECKSUMS:
  SwiftyGif: 706c60cf65fa2bc5ee0313beece843c8eb8194d4
  TOCropViewController: 80b8985ad794298fb69d3341de183f33d1853654
  url_launcher_ios: 5334b05cef931de560670eeae103fd3e431ac3fe
-  video_player_avfoundation: 7c6c11d8470e1675df7397027218274b6d2360b3
+  volume_controller: 531ddf792994285c9b17f9d8a7e4dcdd29b3eae9
  wakelock_plus: 78ec7c5b202cab7761af8e2b2b3d0671be6c4ae1
  WebRTC-SDK: c3d69a87e7185fad3568f6f3cff7c9ac5890acf3

--- a/lib/providers/content/attachment.dart
+++ b/lib/providers/content/attachment.dart
@ -192,6 +192,7 @@ class AttachmentProvider extends GetConnect {
  Future<Response> updateAttachment(
    int id,
    String alt, {
+    required Map<String, dynamic> metadata,
    bool isMature = false,
  }) async {
    final AuthProvider auth = Get.find();
@ -201,6 +202,7 @@ class AttachmentProvider extends GetConnect {

    var resp = await client.put('/attachments/$id', {
      'alt': alt,
+      'metadata': metadata,
      'is_mature': isMature,
    });

--- a/lib/screens/account/stickers.dart
+++ b/lib/screens/account/stickers.dart
@ -1,14 +1,13 @@
-import 'package:cached_network_image/cached_network_image.dart';
 import 'package:flutter/material.dart';
 import 'package:gap/gap.dart';
 import 'package:get/get.dart';
 import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart';
 import 'package:solian/models/pagination.dart';
 import 'package:solian/models/stickers.dart';
-import 'package:solian/platform.dart';
 import 'package:solian/providers/auth.dart';
 import 'package:solian/providers/stickers.dart';
 import 'package:solian/services.dart';
+import 'package:solian/widgets/auto_cache_image.dart';
 import 'package:solian/widgets/stickers/sticker_uploader.dart';

 class StickerScreen extends StatefulWidget {
@ -94,16 +93,11 @@ class _StickerScreenState extends State<StickerScreen> {
          ),
        ],
      ),
-      leading: PlatformInfo.canCacheImage
-          ? CachedNetworkImage(
-              imageUrl: imageUrl,
-              width: 28,
-              height: 28,
-            )
-          : Image.network(
+      leading: AutoCacheImage(
        imageUrl,
        width: 28,
        height: 28,
+        noErrorWidget: true,
      ),
    );
  }
--- a/lib/screens/posts/post_editor.dart
+++ b/lib/screens/posts/post_editor.dart
@ -177,7 +177,9 @@ class _PostPublishScreenState extends State<PostPublishScreen> {
          children: [
            ListTile(
              tileColor: Theme.of(context).colorScheme.surfaceContainerLow,
-              title: Row(
+              title: SingleChildScrollView(
+                scrollDirection: Axis.horizontal,
+                child: Row(
                  children: [
                    Text(
                      _editorController.title ?? 'title'.tr,
@ -187,10 +189,12 @@ class _PostPublishScreenState extends State<PostPublishScreen> {
                    const Gap(6),
                    if (_editorController.aliasController.text.isNotEmpty)
                      Badge(
-                      label: Text('#${_editorController.aliasController.text}'),
+                        label:
+                            Text('#${_editorController.aliasController.text}'),
                      ),
                  ],
                ),
+              ),
              subtitle: Text(
                _editorController.description ?? 'description'.tr,
                maxLines: 2,
--- a/lib/widgets/account/account_avatar.dart
+++ b/lib/widgets/account/account_avatar.dart
@ -1,7 +1,6 @@
-import 'package:cached_network_image/cached_network_image.dart';
 import 'package:flutter/material.dart';
-import 'package:solian/platform.dart';
 import 'package:solian/services.dart';
+import 'package:solian/widgets/auto_cache_image.dart';

 class AccountAvatar extends StatelessWidget {
  final dynamic content;
@ -34,11 +33,7 @@ class AccountAvatar extends StatelessWidget {
      key: Key('a$content'),
      radius: radius,
      backgroundColor: bgColor,
-      backgroundImage: !isEmpty
-          ? (PlatformInfo.canCacheImage
-              ? CachedNetworkImageProvider(url)
-              : NetworkImage(url)) as ImageProvider<Object>?
-          : null,
+      backgroundImage: !isEmpty ? AutoCacheImage.provider(url) : null,
      child: isEmpty
          ? Icon(
              Icons.account_circle,
@ -74,33 +69,6 @@ class AccountProfileImage extends StatelessWidget {
        ? content
        : ServiceFinder.buildUrl('files', '/attachments/$content');

-    if (PlatformInfo.canCacheImage) {
-      return CachedNetworkImage(
-        imageUrl: url,
-        fit: fit,
-        progressIndicatorBuilder: (context, url, downloadProgress) => Center(
-          child: CircularProgressIndicator(
-            value: downloadProgress.progress,
-          ),
-        ),
-      );
-    } else {
-      return Image.network(
-        url,
-        fit: fit,
-        loadingBuilder: (BuildContext context, Widget child,
-            ImageChunkEvent? loadingProgress) {
-          if (loadingProgress == null) return child;
-          return Center(
-            child: CircularProgressIndicator(
-              value: loadingProgress.expectedTotalBytes != null
-                  ? loadingProgress.cumulativeBytesLoaded /
-                      loadingProgress.expectedTotalBytes!
-                  : null,
-            ),
-          );
-        },
-      );
-    }
+    return AutoCacheImage(url, fit: fit, noErrorWidget: true);
  }
 }
--- a/lib/widgets/attachments/attachment_attr_editor.dart
+++ b/lib/widgets/attachments/attachment_attr_editor.dart
@ -37,6 +37,7 @@ class _AttachmentAttrEditorDialogState
        widget.item.id,
        _altController.value.text,
        isMature: _isMature,
+        metadata: widget.item.metadata ?? {},
      );

      Get.find<AttachmentProvider>().clearCache(id: widget.item.rid);
--- a/lib/widgets/attachments/attachment_editor.dart
+++ b/lib/widgets/attachments/attachment_editor.dart
@ -20,6 +20,7 @@ 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_editor_thumbnail.dart';
 import 'package:solian/widgets/attachments/attachment_fullscreen.dart';

 class AttachmentEditorPopup extends StatefulWidget {
@ -264,6 +265,21 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
    );
  }

+  void _showAttachmentThumbnailEditor(Attachment element, int idx) {
+    showDialog(
+      context: context,
+      builder: (context) => AttachmentEditorThumbnailDialog(
+        item: element,
+        pool: widget.pool,
+        initialItem: element.metadata?['thumbnail'],
+        onUpdate: (value) {
+          _attachments[idx]!.metadata ??= {};
+          _attachments[idx]!.metadata!['thumbnail'] = value;
+        },
+      ),
+    );
+  }
+
  void _showEdit(Attachment element, int index) {
    showDialog(
      context: context,
@ -455,11 +471,12 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
    );
  }

-  Widget _buildListEntry(Attachment element, int index) {
+  Widget _buildListEntry(Attachment element, int idx) {
    var fileType = element.mimetype.split('/').firstOrNull;
    fileType ??= 'unknown';

    final canBePreview = fileType.toLowerCase() == 'image';
+    final canHasThumbnail = fileType.toLowerCase() != 'image';

    return Container(
      padding: const EdgeInsets.only(left: 16, right: 8, bottom: 16),
@ -491,13 +508,22 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
                      ],
                    ),
                  ),
+                  if (canBePreview)
                    IconButton(
                      color: Colors.teal,
                      icon: const Icon(Icons.preview),
                      visualDensity: const VisualDensity(horizontal: -4),
-                    onPressed: canBePreview
-                        ? () => _showAttachmentPreview(element)
-                        : null,
+                      onPressed: () => _showAttachmentPreview(element),
+                    ),
+                  if (canHasThumbnail)
+                    IconButton(
+                      color: Colors.teal,
+                      icon: const Icon(Icons.add_photo_alternate),
+                      visualDensity: const VisualDensity(horizontal: -4),
+                      onPressed: () => _showAttachmentThumbnailEditor(
+                        element,
+                        idx,
+                      ),
                    ),
                  PopupMenuButton(
                    icon: const Icon(Icons.more_horiz),
@ -514,7 +540,7 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
                            horizontal: 8,
                          ),
                        ),
-                        onTap: () => _showEdit(element, index),
+                        onTap: () => _showEdit(element, idx),
                      ),
                      PopupMenuItem(
                        child: ListTile(
@ -527,7 +553,7 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
                        onTap: () {
                          _deleteAttachment(element).then((_) {
                            widget.onRemove(element.rid);
-                            setState(() => _attachments.removeAt(index));
+                            setState(() => _attachments.removeAt(idx));
                          });
                        },
                      ),
@ -541,7 +567,7 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
                        ),
                        onTap: () {
                          widget.onRemove(element.rid);
-                          setState(() => _attachments.removeAt(index));
+                          setState(() => _attachments.removeAt(idx));
                        },
                      ),
                    ],
--- a/lib/widgets/attachments/attachment_editor_thumbnail.dart
+++ b/lib/widgets/attachments/attachment_editor_thumbnail.dart
@ -0,0 +1,148 @@
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+import 'package:solian/exts.dart';
+import 'package:solian/models/attachment.dart';
+import 'package:solian/providers/content/attachment.dart';
+import 'package:solian/widgets/attachments/attachment_editor.dart';
+
+class AttachmentEditorThumbnailDialog extends StatefulWidget {
+  final Attachment item;
+  final String pool;
+  final String? initialItem;
+  final Function(String? id) onUpdate;
+
+  const AttachmentEditorThumbnailDialog({
+    super.key,
+    required this.item,
+    required this.pool,
+    required this.initialItem,
+    required this.onUpdate,
+  });
+
+  @override
+  State<AttachmentEditorThumbnailDialog> createState() =>
+      _AttachmentEditorThumbnailDialogState();
+}
+
+class _AttachmentEditorThumbnailDialogState
+    extends State<AttachmentEditorThumbnailDialog> {
+  bool _isLoading = false;
+
+  final TextEditingController _attachmentController = TextEditingController();
+
+  void _promptUploadNewAttachment() {
+    showModalBottomSheet(
+      context: context,
+      builder: (context) => AttachmentEditorPopup(
+        pool: widget.pool,
+        singleMode: true,
+        imageOnly: true,
+        autoUpload: true,
+        onAdd: (value) {
+          widget.onUpdate(value);
+          _attachmentController.text = value;
+        },
+        initialAttachments: const [],
+        onRemove: (_) {},
+      ),
+    );
+  }
+
+  Future<void> _updateAttachment() async {
+    setState(() => _isLoading = true);
+
+    final AttachmentProvider attach = Get.find();
+
+    widget.item.metadata ??= {};
+    if (_attachmentController.text.isNotEmpty) {
+      widget.item.metadata!['thumbnail'] = _attachmentController.text;
+    } else {
+      widget.item.metadata!['thumbnail'] = null;
+    }
+
+    try {
+      await attach.updateAttachment(
+        widget.item.id,
+        widget.item.alt,
+        isMature: widget.item.isMature,
+        metadata: widget.item.metadata!,
+      );
+
+      Get.find<AttachmentProvider>().clearCache(id: widget.item.rid);
+    } catch (e) {
+      context.showErrorDialog(e);
+    } finally {
+      setState(() => _isLoading = false);
+    }
+  }
+
+  @override
+  void initState() {
+    if (widget.initialItem != null) {
+      _attachmentController.text = widget.initialItem!;
+    }
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    _attachmentController.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return AlertDialog(
+      title: Text('postThumbnail'.tr),
+      content: Column(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          Card(
+            margin: EdgeInsets.zero,
+            child: ListTile(
+              title: Text('postThumbnailAttachmentNew'.tr),
+              contentPadding: const EdgeInsets.only(left: 12, right: 9),
+              trailing: const Icon(Icons.chevron_right),
+              shape: const RoundedRectangleBorder(
+                borderRadius: BorderRadius.all(Radius.circular(8)),
+              ),
+              onTap: () {
+                _promptUploadNewAttachment();
+              },
+            ),
+          ),
+          const Row(children: <Widget>[
+            Expanded(child: Divider()),
+            Text('OR'),
+            Expanded(child: Divider()),
+          ]).paddingOnly(top: 12, bottom: 16, left: 16, right: 16),
+          TextField(
+            controller: _attachmentController,
+            decoration: InputDecoration(
+              isDense: true,
+              border: const OutlineInputBorder(),
+              prefixText: '#',
+              labelText: 'postThumbnailAttachment'.tr,
+            ),
+            onTapOutside: (_) => FocusManager.instance.primaryFocus?.unfocus(),
+          ),
+        ],
+      ),
+      actions: [
+        TextButton(
+          onPressed: _isLoading
+              ? null
+              : () {
+                  _updateAttachment().then((_) {
+                    widget.onUpdate(_attachmentController.text);
+                    if (mounted) {
+                      Navigator.pop(context);
+                    }
+                  });
+                },
+          child: Text('confirm'.tr),
+        ),
+      ],
+    );
+  }
+}
--- a/lib/widgets/attachments/attachment_fullscreen.dart
+++ b/lib/widgets/attachments/attachment_fullscreen.dart
@ -172,7 +172,7 @@ class _AttachmentFullScreenState extends State<AttachmentFullScreen> {
                      end: Alignment.topCenter,
                      colors: [
                        Theme.of(context).colorScheme.surface,
-                        Theme.of(context).colorScheme.surface.withOpacity(0),
+                        Colors.transparent,
                      ],
                    ),
                  ),
--- a/lib/widgets/attachments/attachment_item.dart
+++ b/lib/widgets/attachments/attachment_item.dart
@ -1,6 +1,5 @@
-import 'dart:math';
+import 'dart:math' as math;

-import 'package:cached_network_image/cached_network_image.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_animate/flutter_animate.dart';
 import 'package:gap/gap.dart';
@ -9,9 +8,9 @@ import 'package:google_fonts/google_fonts.dart';
 import 'package:media_kit/media_kit.dart';
 import 'package:media_kit_video/media_kit_video.dart';
 import 'package:solian/models/attachment.dart';
-import 'package:solian/platform.dart';
 import 'package:solian/providers/durations.dart';
 import 'package:solian/services.dart';
+import 'package:solian/widgets/auto_cache_image.dart';
 import 'package:solian/widgets/sized_container.dart';
 import 'package:url_launcher/url_launcher_string.dart';

@ -140,65 +139,12 @@ class _AttachmentItemImage extends StatelessWidget {
      child: Stack(
        fit: StackFit.expand,
        children: [
-          if (PlatformInfo.canCacheImage)
-            CachedNetworkImage(
-              fit: fit,
-              imageUrl: ServiceFinder.buildUrl(
+          AutoCacheImage(
+            ServiceFinder.buildUrl(
              'files',
              '/attachments/${item.rid}',
            ),
-              progressIndicatorBuilder: (context, url, downloadProgress) {
-                return Center(
-                  child: CircularProgressIndicator(
-                    value: downloadProgress.progress,
-                  ),
-                );
-              },
-              errorWidget: (context, url, error) {
-                return Material(
-                  color: Theme.of(context).colorScheme.surface,
-                  child: Column(
-                    mainAxisAlignment: MainAxisAlignment.center,
-                    children: [
-                      const Icon(Icons.close, size: 32)
-                          .animate(onPlay: (e) => e.repeat(reverse: true))
-                          .fade(duration: 500.ms),
-                      Text(error.toString()),
-                    ],
-                  ),
-                );
-              },
-            )
-          else
-            Image.network(
-              ServiceFinder.buildUrl('files', '/attachments/${item.rid}'),
            fit: fit,
-              loadingBuilder: (BuildContext context, Widget child,
-                  ImageChunkEvent? loadingProgress) {
-                if (loadingProgress == null) return child;
-                return Center(
-                  child: CircularProgressIndicator(
-                    value: loadingProgress.expectedTotalBytes != null
-                        ? loadingProgress.cumulativeBytesLoaded /
-                            loadingProgress.expectedTotalBytes!
-                        : null,
-                  ),
-                );
-              },
-              errorBuilder: (context, error, stackTrace) {
-                return Material(
-                  color: Theme.of(context).colorScheme.surface,
-                  child: Column(
-                    mainAxisAlignment: MainAxisAlignment.center,
-                    children: [
-                      const Icon(Icons.close, size: 32)
-                          .animate(onPlay: (e) => e.repeat(reverse: true))
-                          .fade(duration: 500.ms),
-                      Text(error.toString()),
-                    ],
-                  ),
-                );
-              },
          ),
          if (showBadge && badge != null)
            Positioned(
@ -276,38 +222,89 @@ class _AttachmentItemVideoState extends State<_AttachmentItemVideo> {

  @override
  Widget build(BuildContext context) {
+    const labelShadows = <Shadow>[
+      Shadow(
+        offset: Offset(1, 1),
+        blurRadius: 5.0,
+        color: Color.fromARGB(255, 0, 0, 0),
+      ),
+    ];
    final ratio = widget.item.metadata?['ratio'] ?? 16 / 9;
    if (!_showContent) {
      return GestureDetector(
-        child: AspectRatio(
-          aspectRatio: ratio,
-          child: CenteredContainer(
-            maxWidth: 280,
-            child: Column(
-              mainAxisAlignment: MainAxisAlignment.center,
+        child: Stack(
          children: [
-                const Icon(
-                  Icons.not_started,
-                  color: Colors.white,
-                  size: 32,
+            if (widget.item.metadata?['thumbnail'] != null)
+              AspectRatio(
+                aspectRatio: 16 / 9,
+                child: AutoCacheImage(
+                  ServiceFinder.buildUrl(
+                    'uc',
+                    '/attachments/${widget.item.metadata?['thumbnail']}',
                  ),
-                const Gap(8),
+                  fit: BoxFit.cover,
+                ),
+              )
+            else
+              const Center(
+                child: Icon(Icons.movie, size: 64),
+              ),
+            Align(
+              alignment: Alignment.bottomCenter,
+              child: IgnorePointer(
+                child: Container(
+                  height: 56,
+                  decoration: BoxDecoration(
+                    gradient: LinearGradient(
+                      begin: Alignment.bottomCenter,
+                      end: Alignment.topCenter,
+                      colors: [
+                        Theme.of(context).colorScheme.surface,
+                        Colors.transparent,
+                      ],
+                    ),
+                  ),
+                ),
+              ),
+            ),
+            Positioned(
+              bottom: 4,
+              left: 16,
+              right: 16,
+              child: SizedBox(
+                height: 45,
+                child: Row(
+                  children: [
+                    Expanded(
+                      child: Column(
+                        crossAxisAlignment: CrossAxisAlignment.start,
+                        children: [
                          Text(
-                  'attachmentUnload'.tr,
-                  style: const TextStyle(
-                    color: Colors.white,
-                    fontWeight: FontWeight.bold,
-                    fontSize: 16,
-                  ),
+                            widget.item.alt,
+                            style: const TextStyle(shadows: labelShadows),
                          ),
                          Text(
-                  'attachmentUnloadCaption'.tr,
-                  style: const TextStyle(color: Colors.white),
-                  textAlign: TextAlign.center,
+                            Duration(
+                              milliseconds:
+                                  (widget.item.metadata?['duration'] ?? 0)
+                                          .toInt() *
+                                      1000,
+                            ).toHumanReadableString(),
+                            style: GoogleFonts.robotoMono(
+                              fontSize: 12,
+                              shadows: labelShadows,
+                            ),
                          ),
                        ],
                      ),
                    ),
+                    const Icon(Icons.play_arrow, shadows: labelShadows)
+                        .paddingOnly(bottom: 4, right: 8),
+                  ],
+                ),
+              ),
+            ),
+          ],
        ),
        onTap: () {
          _startLoad();
@ -373,6 +370,25 @@ class _AttachmentItemAudioState extends State<_AttachmentItemAudio> {
    );
  }

+  String _formatBytes(int bytes, {int decimals = 2}) {
+    if (bytes == 0) return '0 Bytes';
+    const k = 1024;
+    final dm = decimals < 0 ? 0 : decimals;
+    final sizes = [
+      'Bytes',
+      'KiB',
+      'MiB',
+      'GiB',
+      'TiB',
+      'PiB',
+      'EiB',
+      'ZiB',
+      'YiB'
+    ];
+    final i = (math.log(bytes) / math.log(k)).floor().toInt();
+    return '${(bytes / math.pow(k, i)).toStringAsFixed(dm)} ${sizes[i]}';
+  }
+
  @override
  void initState() {
    super.initState();
@ -383,38 +399,84 @@ class _AttachmentItemAudioState extends State<_AttachmentItemAudio> {

  @override
  Widget build(BuildContext context) {
+    const labelShadows = <Shadow>[
+      Shadow(
+        offset: Offset(1, 1),
+        blurRadius: 5.0,
+        color: Color.fromARGB(255, 0, 0, 0),
+      ),
+    ];
    const ratio = 16 / 9;
    if (!_showContent) {
      return GestureDetector(
-        child: AspectRatio(
-          aspectRatio: ratio,
-          child: CenteredContainer(
-            maxWidth: 280,
-            child: Column(
-              mainAxisAlignment: MainAxisAlignment.center,
+        child: Stack(
          children: [
-                const Icon(
-                  Icons.not_started,
-                  color: Colors.white,
-                  size: 32,
+            if (widget.item.metadata?['thumbnail'] != null)
+              AspectRatio(
+                aspectRatio: 16 / 9,
+                child: AutoCacheImage(
+                  ServiceFinder.buildUrl(
+                    'uc',
+                    '/attachments/${widget.item.metadata?['thumbnail']}',
                  ),
-                const Gap(8),
+                  fit: BoxFit.cover,
+                ),
+              )
+            else
+              const Center(
+                child: Icon(Icons.radio, size: 64),
+              ),
+            Align(
+              alignment: Alignment.bottomCenter,
+              child: IgnorePointer(
+                child: Container(
+                  height: 56,
+                  decoration: BoxDecoration(
+                    gradient: LinearGradient(
+                      begin: Alignment.bottomCenter,
+                      end: Alignment.topCenter,
+                      colors: [
+                        Theme.of(context).colorScheme.surface,
+                        Colors.transparent,
+                      ],
+                    ),
+                  ),
+                ),
+              ),
+            ),
+            Positioned(
+              bottom: 4,
+              left: 16,
+              right: 16,
+              child: SizedBox(
+                height: 45,
+                child: Row(
+                  children: [
+                    Expanded(
+                      child: Column(
+                        crossAxisAlignment: CrossAxisAlignment.start,
+                        children: [
                          Text(
-                  'attachmentUnload'.tr,
-                  style: const TextStyle(
-                    color: Colors.white,
-                    fontWeight: FontWeight.bold,
-                    fontSize: 16,
-                  ),
+                            widget.item.alt,
+                            style: const TextStyle(shadows: labelShadows),
                          ),
                          Text(
-                  'attachmentUnloadCaption'.tr,
-                  style: const TextStyle(color: Colors.white),
-                  textAlign: TextAlign.center,
+                            _formatBytes(widget.item.size),
+                            style: GoogleFonts.robotoMono(
+                              fontSize: 12,
+                              shadows: labelShadows,
+                            ),
                          ),
                        ],
                      ),
                    ),
+                    const Icon(Icons.play_arrow, shadows: labelShadows)
+                        .paddingOnly(bottom: 4, right: 8),
+                  ],
+                ),
+              ),
+            ),
+          ],
        ),
        onTap: () {
          _startLoad();
@ -426,7 +488,24 @@ class _AttachmentItemAudioState extends State<_AttachmentItemAudio> {
      );
    }

-    return AspectRatio(
+    return Stack(
+      children: [
+        if (widget.item.metadata?['thumbnail'] != null)
+          AspectRatio(
+            aspectRatio: 16 / 9,
+            child: AutoCacheImage(
+              ServiceFinder.buildUrl(
+                'uc',
+                '/attachments/${widget.item.metadata?['thumbnail']}',
+              ),
+              fit: BoxFit.cover,
+            ),
+          ).animate().blur(
+                duration: 300.ms,
+                end: const Offset(10, 10),
+                curve: Curves.easeInOut,
+              ),
+        AspectRatio(
          aspectRatio: ratio,
          child: CenteredContainer(
            maxWidth: 320,
@ -456,24 +535,29 @@ class _AttachmentItemAudioState extends State<_AttachmentItemAudio> {
                              overlayShape: SliderComponentShape.noOverlay,
                            ),
                            child: Slider(
-                          secondaryTrackValue:
-                              _bufferedPosition.inMilliseconds.abs().toDouble(),
+                              secondaryTrackValue: _bufferedPosition
+                                  .inMilliseconds
+                                  .abs()
+                                  .toDouble(),
                              value: _draggingValue?.abs() ??
                                  _position.inMilliseconds.toDouble().abs(),
                              min: 0,
-                          max: max(
+                              max: math
+                                  .max(
                                    _bufferedPosition.inMilliseconds.abs(),
-                            max(
+                                    math.max(
                                      _position.inMilliseconds.abs(),
                                      _duration.inMilliseconds.abs(),
                                    ),
-                          ).toDouble(),
+                                  )
+                                  .toDouble(),
                              onChanged: (value) {
                                setState(() => _draggingValue = value);
                              },
                              onChangeEnd: (value) {
-                            _audioPlayer!
-                                .seek(Duration(milliseconds: value.toInt()));
+                                _audioPlayer!.seek(
+                                  Duration(milliseconds: value.toInt()),
+                                );
                                setState(() => _draggingValue = null);
                              },
                            ),
@ -512,6 +596,8 @@ class _AttachmentItemAudioState extends State<_AttachmentItemAudio> {
              ],
            ),
          ),
+        ),
+      ],
    );
  }

--- a/lib/widgets/auto_cache_image.dart
+++ b/lib/widgets/auto_cache_image.dart
@ -0,0 +1,113 @@
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_animate/flutter_animate.dart';
+import 'package:solian/platform.dart';
+import 'package:solian/widgets/sized_container.dart';
+
+class AutoCacheImage extends StatelessWidget {
+  final String url;
+  final double? width, height;
+  final BoxFit? fit;
+  final bool noProgressIndicator;
+  final bool noErrorWidget;
+
+  const AutoCacheImage(
+    this.url, {
+    super.key,
+    this.width,
+    this.height,
+    this.fit,
+    this.noProgressIndicator = false,
+    this.noErrorWidget = false,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    if (PlatformInfo.canCacheImage) {
+      return CachedNetworkImage(
+        imageUrl: url,
+        width: width,
+        height: height,
+        fit: fit,
+        progressIndicatorBuilder: noProgressIndicator
+            ? null
+            : (context, url, downloadProgress) => Center(
+                  child: CircularProgressIndicator(
+                    value: downloadProgress.progress,
+                  ),
+                ),
+        errorWidget: noErrorWidget
+            ? null
+            : (context, url, error) {
+                return Material(
+                  color: Theme.of(context).colorScheme.surface,
+                  child: CenteredContainer(
+                    maxWidth: 280,
+                    child: Column(
+                      mainAxisAlignment: MainAxisAlignment.center,
+                      children: [
+                        const Icon(Icons.close, size: 32)
+                            .animate(onPlay: (e) => e.repeat(reverse: true))
+                            .fade(duration: 500.ms),
+                        Text(
+                          error.toString(),
+                          textAlign: TextAlign.center,
+                        ),
+                      ],
+                    ),
+                  ),
+                );
+              },
+      );
+    }
+    return Image.network(
+      url,
+      width: width,
+      height: height,
+      fit: fit,
+      loadingBuilder: noProgressIndicator
+          ? null
+          : (BuildContext context, Widget child,
+              ImageChunkEvent? loadingProgress) {
+              if (loadingProgress == null) return child;
+              return Center(
+                child: CircularProgressIndicator(
+                  value: loadingProgress.expectedTotalBytes != null
+                      ? loadingProgress.cumulativeBytesLoaded /
+                          loadingProgress.expectedTotalBytes!
+                      : null,
+                ),
+              );
+            },
+      errorBuilder: noErrorWidget
+          ? null
+          : (context, error, stackTrace) {
+              return Material(
+                color: Theme.of(context).colorScheme.surface,
+                child: CenteredContainer(
+                  maxWidth: 280,
+                  child: Column(
+                    mainAxisAlignment: MainAxisAlignment.center,
+                    children: [
+                      const Icon(Icons.close, size: 32)
+                          .animate(onPlay: (e) => e.repeat(reverse: true))
+                          .fade(duration: 500.ms),
+                      Text(
+                        error.toString(),
+                        textAlign: TextAlign.center,
+                      ),
+                    ],
+                  ),
+                ),
+              );
+            },
+    );
+  }
+
+  static ImageProvider provider(String url) {
+    if (PlatformInfo.canCacheImage) {
+      return CachedNetworkImageProvider(url);
+    }
+    return NetworkImage(url);
+  }
+}
--- a/lib/widgets/channel/channel_call_indicator.dart
+++ b/lib/widgets/channel/channel_call_indicator.dart
@ -1,16 +1,15 @@
 import 'dart:convert';

 import 'package:avatar_stack/avatar_stack.dart';
-import 'package:cached_network_image/cached_network_image.dart';
 import 'package:flutter/material.dart';
 import 'package:gap/gap.dart';
 import 'package:get/get.dart';
 import 'package:solian/models/account.dart';
 import 'package:solian/models/call.dart';
 import 'package:solian/models/channel.dart';
-import 'package:solian/platform.dart';
 import 'package:solian/providers/call.dart';
 import 'package:solian/theme.dart';
+import 'package:solian/widgets/auto_cache_image.dart';
 import 'package:solian/widgets/chat/call/call_prejoin.dart';

 class ChannelCallIndicator extends StatelessWidget {
@ -76,10 +75,7 @@ class ChannelCallIndicator extends StatelessWidget {
                  avatars: ongoingCall.participants!.map((x) {
                    final userinfo =
                        Account.fromJson(jsonDecode(x['metadata']));
-                    return PlatformInfo.canCacheImage
-                        ? CachedNetworkImageProvider(userinfo.avatar)
-                            as ImageProvider
-                        : NetworkImage(userinfo.avatar) as ImageProvider;
+                    return AutoCacheImage.provider(userinfo.avatar);
                  }).toList(),
                ),
              );
--- a/lib/widgets/chat/chat_message_input.dart
+++ b/lib/widgets/chat/chat_message_input.dart
@ -1,7 +1,6 @@
 import 'dart:async';
 import 'dart:convert';

-import 'package:cached_network_image/cached_network_image.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_typeahead/flutter_typeahead.dart';
 import 'package:font_awesome_flutter/font_awesome_flutter.dart';
@ -11,13 +10,13 @@ import 'package:solian/models/account.dart';
 import 'package:solian/models/channel.dart';
 import 'package:solian/models/event.dart';
 import 'package:solian/models/packet.dart';
-import 'package:solian/platform.dart';
 import 'package:solian/providers/attachment_uploader.dart';
 import 'package:solian/providers/auth.dart';
 import 'package:solian/providers/stickers.dart';
 import 'package:solian/providers/websocket.dart';
 import 'package:solian/widgets/account/account_avatar.dart';
 import 'package:solian/widgets/attachments/attachment_editor.dart';
+import 'package:solian/widgets/auto_cache_image.dart';
 import 'package:solian/widgets/chat/chat_event.dart';
 import 'package:badges/badges.dart' as badges;
 import 'package:uuid/uuid.dart';
@ -414,13 +413,7 @@ class _ChatMessageInputState extends State<ChatMessageInput> {
                          .map(
                            (x) => ChatMessageSuggestion(
                              type: 'emotes',
-                              leading: PlatformInfo.canCacheImage
-                                  ? CachedNetworkImage(
-                                      imageUrl: x.imageUrl,
-                                      width: 28,
-                                      height: 28,
-                                    )
-                                  : Image.network(
+                              leading: AutoCacheImage(
                                x.imageUrl,
                                width: 28,
                                height: 28,
--- a/lib/widgets/link_expansion.dart
+++ b/lib/widgets/link_expansion.dart
@ -1,11 +1,9 @@
-import 'package:cached_network_image/cached_network_image.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter_animate/flutter_animate.dart';
 import 'package:flutter_markdown/flutter_markdown.dart';
 import 'package:flutter_svg/svg.dart';
 import 'package:get/get.dart';
-import 'package:solian/platform.dart';
 import 'package:solian/providers/link_expander.dart';
+import 'package:solian/widgets/auto_cache_image.dart';
 import 'package:url_launcher/url_launcher_string.dart';

 class LinkExpansion extends StatelessWidget {
@ -17,36 +15,10 @@ class LinkExpansion extends StatelessWidget {
    if (url.endsWith('svg')) {
      return SvgPicture.network(url, width: width, height: height);
    }
-    return PlatformInfo.canCacheImage
-        ? CachedNetworkImage(
-            imageUrl: url,
-            width: width,
-            height: height,
-            errorWidget: (context, url, error) {
-              return Material(
-                color: Theme.of(context).colorScheme.surface,
-                child: Center(
-                  child: const Icon(Icons.close, size: 32)
-                      .animate(onPlay: (e) => e.repeat(reverse: true))
-                      .fade(duration: 500.ms),
-                ),
-              );
-            },
-          )
-        : Image.network(
+    return AutoCacheImage(
      url,
      width: width,
      height: height,
-            errorBuilder: (context, error, stackTrace) {
-              return Material(
-                color: Theme.of(context).colorScheme.surface,
-                child: Center(
-                  child: const Icon(Icons.close, size: 32)
-                      .animate(onPlay: (e) => e.repeat(reverse: true))
-                      .fade(duration: 500.ms),
-                ),
-              );
-            },
    );
  }

--- a/lib/widgets/markdown_text_content.dart
+++ b/lib/widgets/markdown_text_content.dart
@ -1,12 +1,11 @@
-import 'package:cached_network_image/cached_network_image.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_markdown_selectionarea/flutter_markdown.dart';
 import 'package:get/get.dart';
 import 'package:markdown/markdown.dart' as markdown;
 import 'package:markdown/markdown.dart';
-import 'package:solian/platform.dart';
 import 'package:solian/providers/stickers.dart';
 import 'package:solian/widgets/attachments/attachment_list.dart';
+import 'package:solian/widgets/auto_cache_image.dart';
 import 'package:url_launcher/url_launcher_string.dart';

 import 'account/account_profile_popup.dart';
@ -107,14 +106,7 @@ class MarkdownTextContent extends StatelessWidget {
                borderRadius: BorderRadius.all(Radius.circular(radius)),
                child: Container(
                  color: Theme.of(context).colorScheme.surfaceContainer,
-                  child: PlatformInfo.canCacheImage
-                      ? CachedNetworkImage(
-                          imageUrl: url,
-                          width: width,
-                          height: height,
-                          fit: fit,
-                        )
-                      : Image.network(
+                  child: AutoCacheImage(
                    url,
                    width: width,
                    height: height,
@ -138,14 +130,7 @@ class MarkdownTextContent extends StatelessWidget {
          }
        }

-        return PlatformInfo.canCacheImage
-            ? CachedNetworkImage(
-                imageUrl: url,
-                width: width,
-                height: height,
-                fit: fit,
-              )
-            : Image.network(
+        return AutoCacheImage(
          url,
          width: width,
          height: height,
--- a/lib/widgets/posts/post_item.dart
+++ b/lib/widgets/posts/post_item.dart
@ -299,14 +299,14 @@ class _PostItemState extends State<PostItem> {
      return AttachmentList(
        parentId: widget.item.id.toString(),
        attachmentsId: attachments,
-        autoload: true,
+        autoload: false,
        isGrid: true,
      ).paddingOnly(left: 36, top: 4, bottom: 4);
    } else if (attachments.length > 1) {
      return AttachmentList(
        parentId: widget.item.id.toString(),
        attachmentsId: attachments,
-        autoload: true,
+        autoload: false,
        isColumn: true,
      ).paddingOnly(left: 60, right: 24);
    } else {
@ -314,7 +314,7 @@ class _PostItemState extends State<PostItem> {
        flatMaxHeight: MediaQuery.of(context).size.width,
        parentId: widget.item.id.toString(),
        attachmentsId: attachments,
-        autoload: true,
+        autoload: false,
      );
    }
  }
@ -368,10 +368,7 @@ class _PostItemState extends State<PostItem> {
                          end: Alignment.topCenter,
                          colors: [
                            Theme.of(context).colorScheme.surfaceContainerLow,
-                            Theme.of(context)
-                                .colorScheme
-                                .surface
-                                .withOpacity(0),
+                            Colors.transparent,
                          ],
                        ),
                      ),
@ -464,10 +461,7 @@ class _PostItemState extends State<PostItem> {
                                    end: Alignment.topCenter,
                                    colors: [
                                      Theme.of(context).colorScheme.surface,
-                                      Theme.of(context)
-                                          .colorScheme
-                                          .surface
-                                          .withOpacity(0),
+                                      Colors.transparent,
                                    ],
                                  ),
                                ),
--- a/pubspec.yaml
+++ b/pubspec.yaml
@ -2,7 +2,7 @@ name: solian
 description: "The Solar Network App"
 publish_to: "none"

-version: 1.2.1+30
+version: 1.2.1+34

 environment:
  sdk: ">=3.3.4 <4.0.0"
Author	SHA1	Message	Date
LittleSheep	133213b430	🚑 Hot fix thumbnail duration issue	2024-09-10 23:52:10 +08:00
LittleSheep	2ff142a84f	🚀 Launch 1.2.1+33	2024-09-10 23:46:08 +08:00
LittleSheep	e385f79df2	✨ Attachment thumbnail	2024-09-10 22:47:28 +08:00
LittleSheep	8d9a8b5435	🧑‍💻 All in one auto cache image widget	2024-09-10 21:53:05 +08:00
LittleSheep	c5a975b5ed	✨ Setting of attachment thumbnail	2024-09-10 21:36:10 +08:00