🚑 Hot fix thumbnail duration issue

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:
+  volume_controller:
-    :path: ".symlinks/plugins/video_player_avfoundation/darwin"
+    :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
 

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,
     });
 

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
+      leading: AutoCacheImage(
-          ? CachedNetworkImage(
-              imageUrl: imageUrl,
-              width: 28,
-              height: 28,
-            )
-          : Image.network(
         imageUrl,
         width: 28,
         height: 28,
+        noErrorWidget: true,
       ),
     );
   }

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,

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
+      backgroundImage: !isEmpty ? AutoCacheImage.provider(url) : null,
-          ? (PlatformInfo.canCacheImage
-              ? CachedNetworkImageProvider(url)
-              : NetworkImage(url)) as ImageProvider<Object>?
-          : 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 AutoCacheImage(url, fit: fit, noErrorWidget: true);
-      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,
-            ),
-          );
-        },
-      );
-    }
   }
 }

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);

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
+                      onPressed: () => _showAttachmentPreview(element),
-                        ? () => _showAttachmentPreview(element)
+                    ),
-                        : null,
+                  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));
                         },
                       ),
                     ],

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),
+        ),
+      ],
+    );
+  }
+}

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,
                       ],
                     ),
                   ),

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)
+          AutoCacheImage(
-            CachedNetworkImage(
+            ServiceFinder.buildUrl(
-              fit: fit,
-              imageUrl: 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(
+        child: Stack(
-          aspectRatio: ratio,
-          child: CenteredContainer(
-            maxWidth: 280,
-            child: Column(
-              mainAxisAlignment: MainAxisAlignment.center,
           children: [
-                const Icon(
+            if (widget.item.metadata?['thumbnail'] != null)
-                  Icons.not_started,
+              AspectRatio(
-                  color: Colors.white,
+                aspectRatio: 16 / 9,
-                  size: 32,
+                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,
+                            widget.item.alt,
-                  style: const TextStyle(
+                            style: const TextStyle(shadows: labelShadows),
-                    color: Colors.white,
-                    fontWeight: FontWeight.bold,
-                    fontSize: 16,
-                  ),
                           ),
                           Text(
-                  'attachmentUnloadCaption'.tr,
+                            Duration(
-                  style: const TextStyle(color: Colors.white),
+                              milliseconds:
-                  textAlign: TextAlign.center,
+                                  (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(
+        child: Stack(
-          aspectRatio: ratio,
-          child: CenteredContainer(
-            maxWidth: 280,
-            child: Column(
-              mainAxisAlignment: MainAxisAlignment.center,
           children: [
-                const Icon(
+            if (widget.item.metadata?['thumbnail'] != null)
-                  Icons.not_started,
+              AspectRatio(
-                  color: Colors.white,
+                aspectRatio: 16 / 9,
-                  size: 32,
+                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,
+                            widget.item.alt,
-                  style: const TextStyle(
+                            style: const TextStyle(shadows: labelShadows),
-                    color: Colors.white,
-                    fontWeight: FontWeight.bold,
-                    fontSize: 16,
-                  ),
                           ),
                           Text(
-                  'attachmentUnloadCaption'.tr,
+                            _formatBytes(widget.item.size),
-                  style: const TextStyle(color: Colors.white),
+                            style: GoogleFonts.robotoMono(
-                  textAlign: TextAlign.center,
+                              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:
+                              secondaryTrackValue: _bufferedPosition
-                              _bufferedPosition.inMilliseconds.abs().toDouble(),
+                                  .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!
+                                _audioPlayer!.seek(
-                                .seek(Duration(milliseconds: value.toInt()));
+                                  Duration(milliseconds: value.toInt()),
+                                );
                                 setState(() => _draggingValue = null);
                               },
                             ),
@@ -512,6 +596,8 @@ class _AttachmentItemAudioState extends State<_AttachmentItemAudio> {
               ],
             ),
           ),
+        ),
+      ],
     );
   }
 

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);
+  }
+}

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
+                    return AutoCacheImage.provider(userinfo.avatar);
-                        ? CachedNetworkImageProvider(userinfo.avatar)
-                            as ImageProvider
-                        : NetworkImage(userinfo.avatar) as ImageProvider;
                   }).toList(),
                 ),
               );

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
+                              leading: AutoCacheImage(
-                                  ? CachedNetworkImage(
-                                      imageUrl: x.imageUrl,
-                                      width: 28,
-                                      height: 28,
-                                    )
-                                  : Image.network(
                                 x.imageUrl,
                                 width: 28,
                                 height: 28,

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
+    return AutoCacheImage(
-        ? 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(
       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),
-                ),
-              );
-            },
     );
   }
 

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
+                  child: AutoCacheImage(
-                      ? CachedNetworkImage(
-                          imageUrl: url,
-                          width: width,
-                          height: height,
-                          fit: fit,
-                        )
-                      : Image.network(
                     url,
                     width: width,
                     height: height,
@@ -138,14 +130,7 @@ class MarkdownTextContent extends StatelessWidget {
           }
         }
 
-        return PlatformInfo.canCacheImage
+        return AutoCacheImage(
-            ? CachedNetworkImage(
-                imageUrl: url,
-                width: width,
-                height: height,
-                fit: fit,
-              )
-            : Image.network(
           url,
           width: width,
           height: height,

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)
+                            Colors.transparent,
-                                .colorScheme
-                                .surface
-                                .withOpacity(0),
                           ],
                         ),
                       ),
@@ -464,10 +461,7 @@ class _PostItemState extends State<PostItem> {
                                     end: Alignment.topCenter,
                                     colors: [
                                       Theme.of(context).colorScheme.surface,
-                                      Theme.of(context)
+                                      Colors.transparent,
-                                          .colorScheme
-                                          .surface
-                                          .withOpacity(0),
                                     ],
                                   ),
                                 ),

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"