Improve management of cache key

lib/ui/routes/full_screen_image.dart

@@ -10,8 +10,9 @@ import 'package:url_launcher/url_launcher.dart';
 
 class FullScreenImageRoute extends StatefulWidget {
   final String url;
+  final String? cacheKey;
 
-  FullScreenImageRoute(this.url);
+  FullScreenImageRoute({required this.url, this.cacheKey});
 
   @override
   _FullScreenImageRouteState createState() => _FullScreenImageRouteState();
@@ -28,7 +29,12 @@ class _FullScreenImageRouteState extends State<FullScreenImageRoute> {
               icon: Icon(Icons.launch), onPressed: () => launch(widget.url))
         ],
       ),
-      body: PhotoView(imageProvider: CachedNetworkImageProvider(widget.url)),
+      body: PhotoView(
+          loadingBuilder: (c, i) => Center(child: CircularProgressIndicator()),
+          imageProvider: CachedNetworkImageProvider(
+            widget.url,
+            cacheKey: widget.cacheKey,
+          )),
     );
   }
 }

lib/ui/widgets/conversation_file_tile.dart

@@ -22,7 +22,7 @@ class ConversationFileWidget extends StatefulWidget {
     Key? key,
     required this.messageID,
     required this.file,
-  })  : super(key: key);
+  }) : super(key: key);
 
   @override
   _ConversationFileWidgetState createState() => _ConversationFileWidgetState();
@@ -31,6 +31,10 @@ class ConversationFileWidget extends StatefulWidget {
 class _ConversationFileWidgetState extends State<ConversationFileWidget> {
   ConversationMessageFile get file => widget.file;
 
+  String get _thumbCacheKey => "conv-msg-thumb-${widget.messageID}";
+
+  String get _fileCacheKey => "conv-msg-file-${widget.messageID}";
+
   @override
   Widget build(BuildContext context) => Stack(
         children: [
@@ -43,7 +47,7 @@ class _ConversationFileWidgetState extends State<ConversationFileWidget> {
                   opacity: 0.8,
                   child: CachedNetworkImage(
                     imageUrl: file.thumbnail!,
-                    cacheKey: "conv-file-${widget.messageID}",
+                    cacheKey: _thumbCacheKey,
                     width: _AreaWidth,
                     height: _AreaHeight,
                     fit: BoxFit.cover,
@@ -64,7 +68,9 @@ class _ConversationFileWidgetState extends State<ConversationFileWidget> {
         return Center(
           child: NetworkImageWidget(
             url: file.url!,
+            cacheKey: _fileCacheKey,
             thumbnailURL: file.thumbnail,
+            thumbnailCacheKey: _thumbCacheKey,
             allowFullScreen: true,
           ),
         );

lib/ui/widgets/network_image_widget.dart

@@ -10,7 +10,9 @@ import 'package:flutter/material.dart';
 
 class NetworkImageWidget extends StatelessWidget {
   final String url;
+  final String? cacheKey;
   final String? thumbnailURL;
+  final String? thumbnailCacheKey;
   final bool allowFullScreen;
   final bool roundedEdges;
   final double? width;
@@ -20,13 +22,15 @@ class NetworkImageWidget extends StatelessWidget {
   const NetworkImageWidget({
     Key? key,
     required this.url,
+    this.cacheKey,
     this.thumbnailURL,
+    this.thumbnailCacheKey,
     this.allowFullScreen = false,
     this.width,
     this.height,
     this.roundedEdges = true,
     this.loadingHeight,
-  })  : super(key: key);
+  }) : super(key: key);
 
   double? get _loadingHeight => loadingHeight != null ? loadingHeight : height;
 
@@ -38,33 +42,34 @@ class NetworkImageWidget extends StatelessWidget {
       child: InkWell(
         onTap: allowFullScreen
             ? () {
-                showImageFullScreen(context, url);
+                showImageFullScreen(context, url, cacheKey: cacheKey);
               }
             : null,
         child: CachedNetworkImage(
           imageUrl: thumbnailURL ?? url,
+          cacheKey: thumbnailURL != null ? thumbnailCacheKey : cacheKey,
           width: width,
           height: height,
           fit: BoxFit.cover,
           placeholder: (c, s) => Container(
-                width: _loadingWidth,
+            width: _loadingWidth,
-                height: _loadingHeight,
+            height: _loadingHeight,
-                color: Colors.lightBlueAccent,
+            color: Colors.lightBlueAccent,
-                child: Center(
+            child: Center(
-                  child: CircularProgressIndicator(),
+              child: CircularProgressIndicator(),
-                ),
+            ),
-              ),
+          ),
           errorWidget: (c, s, o) => Container(
-                width: _loadingWidth,
+            width: _loadingWidth,
-                height: _loadingHeight,
+            height: _loadingHeight,
-                color: Colors.red,
+            color: Colors.red,
-                child: Center(
+            child: Center(
-                  child: Icon(
+              child: Icon(
-                    Icons.error,
+                Icons.error,
-                    color: Colors.white,
+                color: Colors.white,
-                  ),
-                ),
               ),
+            ),
+          ),
         ),
       ),
       borderRadius:

lib/utils/ui_utils.dart

@@ -74,9 +74,13 @@ Widget buildErrorCard(String? message,
 }
 
 /// Show an image with a given [url] in full screen
-void showImageFullScreen(BuildContext context, String? url) {
+void showImageFullScreen(BuildContext context, String? url,
+    {String? cacheKey}) {
   Navigator.of(context).push(MaterialPageRoute(builder: (c) {
-    return FullScreenImageRoute(url!);
+    return FullScreenImageRoute(
+      url: url!,
+      cacheKey: cacheKey,
+    );
   }));
 }