chore: Follow up avatars

lib/widgets/avatar.dart

@@ -75,7 +75,8 @@ class Avatar extends StatelessWidget {
             child: noPic
                 ? textWidget
                 : MxcImage(
-                    key: Key(mxContent.toString()),
+                    key: ValueKey(mxContent.toString()),
+                    cacheKey: '${mxContent}_$size',
                     uri: mxContent,
                     fit: BoxFit.cover,
                     width: size,

lib/widgets/mxc_image.dart

@@ -2,7 +2,7 @@ import 'dart:typed_data';
 
 import 'package:flutter/material.dart';
 
-import 'package:cached_network_image/cached_network_image.dart';
+import 'package:http/http.dart' as http;
 import 'package:matrix/matrix.dart';
 
 import 'package:fluffychat/config/themes.dart';
@@ -18,8 +18,11 @@ class MxcImage extends StatefulWidget {
   final bool isThumbnail;
   final bool animated;
   final Duration retryDuration;
+  final Duration animationDuration;
+  final Curve animationCurve;
   final ThumbnailMethod thumbnailMethod;
   final Widget Function(BuildContext context)? placeholder;
+  final String? cacheKey;
 
   const MxcImage({
     this.uri,
@@ -30,8 +33,11 @@ class MxcImage extends StatefulWidget {
     this.placeholder,
     this.isThumbnail = true,
     this.animated = false,
+    this.animationDuration = FluffyThemes.animationDuration,
     this.retryDuration = const Duration(seconds: 2),
+    this.animationCurve = FluffyThemes.animationCurve,
     this.thumbnailMethod = ThumbnailMethod.scale,
+    this.cacheKey,
     super.key,
   });
 
@@ -40,11 +46,76 @@ class MxcImage extends StatefulWidget {
 }
 
 class _MxcImageState extends State<MxcImage> {
-  Uint8List? _imageData;
+  static final Map<String, Uint8List> _imageDataCache = {};
+  Uint8List? _imageDataNoCache;
+
+  Uint8List? get _imageData => widget.cacheKey == null
+      ? _imageDataNoCache
+      : _imageDataCache[widget.cacheKey];
+
+  set _imageData(Uint8List? data) {
+    if (data == null) return;
+    final cacheKey = widget.cacheKey;
+    cacheKey == null
+        ? _imageDataNoCache = data
+        : _imageDataCache[cacheKey] = data;
+  }
+
+  bool? _isCached;
 
   Future<void> _load() async {
+    final client = Matrix.of(context).client;
+    final uri = widget.uri;
     final event = widget.event;
 
+    if (uri != null) {
+      final devicePixelRatio = MediaQuery.of(context).devicePixelRatio;
+      final width = widget.width;
+      final realWidth = width == null ? null : width * devicePixelRatio;
+      final height = widget.height;
+      final realHeight = height == null ? null : height * devicePixelRatio;
+
+      final httpUri = widget.isThumbnail
+          ? uri.getThumbnail(
+              client,
+              width: realWidth,
+              height: realHeight,
+              animated: widget.animated,
+              method: widget.thumbnailMethod,
+            )
+          : uri.getDownloadLink(client);
+
+      final storeKey = widget.isThumbnail ? httpUri : uri;
+
+      if (_isCached == null) {
+        final cachedData = await client.database?.getFile(storeKey);
+        if (cachedData != null) {
+          if (!mounted) return;
+          setState(() {
+            _imageData = cachedData;
+            _isCached = true;
+          });
+          return;
+        }
+        _isCached = false;
+      }
+
+      final response = await http.get(httpUri);
+      if (response.statusCode != 200) {
+        if (response.statusCode == 404) {
+          return;
+        }
+        throw Exception();
+      }
+      final remoteData = response.bodyBytes;
+
+      if (!mounted) return;
+      setState(() {
+        _imageData = remoteData;
+      });
+      await client.database?.storeFile(storeKey, remoteData, 0);
+    }
+
     if (event != null) {
       final data = await event.downloadAndDecryptAttachment(
         getThumbnail: widget.isThumbnail,
@@ -60,7 +131,7 @@ class _MxcImageState extends State<MxcImage> {
   }
 
   void _tryLoad(_) async {
-    if (_imageData != null || widget.event == null) {
+    if (_imageData != null) {
       return;
     }
     try {
@@ -89,36 +160,6 @@ class _MxcImageState extends State<MxcImage> {
 
   @override
   Widget build(BuildContext context) {
-    final uri = widget.uri;
-
-    if (uri != null) {
-      final client = Matrix.of(context).client;
-      final devicePixelRatio = MediaQuery.of(context).devicePixelRatio;
-      final width = widget.width;
-      final realWidth = width == null ? null : width * devicePixelRatio;
-      final height = widget.height;
-      final realHeight = height == null ? null : height * devicePixelRatio;
-
-      final httpUri = widget.isThumbnail
-          ? uri.getThumbnail(
-              client,
-              width: realWidth,
-              height: realHeight,
-              animated: widget.animated,
-              method: widget.thumbnailMethod,
-            )
-          : uri.getDownloadLink(client);
-
-      return CachedNetworkImage(
-        imageUrl: httpUri.toString(),
-        width: width,
-        height: height,
-        fit: widget.fit,
-        placeholder: (context, _) => placeholder(context),
-        errorWidget: (context, _, __) => placeholder(context),
-      );
-    }
-
     final data = _imageData;
     final hasData = data != null && data.isNotEmpty;
 
@@ -136,6 +177,7 @@ class _MxcImageState extends State<MxcImage> {
               filterQuality:
                   widget.isThumbnail ? FilterQuality.low : FilterQuality.medium,
               errorBuilder: (context, __, ___) {
+                _isCached = false;
                 _imageData = null;
                 WidgetsBinding.instance.addPostFrameCallback(_tryLoad);
                 return placeholder(context);