From de4f2397e139f659f77d47da395117c9ef37d002 Mon Sep 17 00:00:00 2001
From: Nikolas Rimikis <rimikis.nikolas@gmail.com>
Date: Thu, 29 Jun 2023 14:38:02 +0200
Subject: [PATCH] neon: improve loading animation of NeonCachedImage

---
 .../neon/lib/src/widgets/cached_image.dart    | 69 ++++++++++---------
 1 file changed, 38 insertions(+), 31 deletions(-)

diff --git a/packages/neon/neon/lib/src/widgets/cached_image.dart b/packages/neon/neon/lib/src/widgets/cached_image.dart
index 43d0331a..3e1fe9b6 100644
--- a/packages/neon/neon/lib/src/widgets/cached_image.dart
+++ b/packages/neon/neon/lib/src/widgets/cached_image.dart
@@ -27,46 +27,34 @@ abstract class NeonCachedImage extends StatefulWidget {
 }
 
 class _NeonCachedImageState extends State<NeonCachedImage> {
-  late Future<File> future = widget.getImageFile();
+  Future<Uint8List> _readImage() async {
+    final file = await widget.getImageFile();
+    return file.readAsBytes();
+  }
+
+  late Future<Uint8List> _future = _readImage();
 
   @override
   Widget build(final BuildContext context) => Center(
-        child: FutureBuilder<File>(
-          future: future,
+        child: FutureBuilder<Uint8List>(
+          future: _future,
           builder: (final context, final fileSnapshot) {
-            if (fileSnapshot.hasData) {
-              final content = fileSnapshot.requireData.readAsBytesSync();
-
-              try {
-                // TODO: Is this safe enough?
-                if (widget.isSvgHint || utf8.decode(content).contains('<svg')) {
-                  return SvgPicture.memory(
-                    content,
-                    height: widget.size?.height,
-                    width: widget.size?.width,
-                    fit: widget.fit ?? BoxFit.contain,
-                    colorFilter: widget.svgColor != null ? ColorFilter.mode(widget.svgColor!, BlendMode.srcIn) : null,
-                  );
-                }
-              } catch (_) {
-                // If the data is not UTF-8
-              }
-
-              return Image.memory(
-                content,
-                height: widget.size?.height,
+            if (!fileSnapshot.hasData) {
+              return SizedBox(
                 width: widget.size?.width,
-                fit: widget.fit,
-                gaplessPlayback: true,
+                child: NeonLinearProgressIndicator(
+                  color: widget.iconColor,
+                ),
               );
             }
+
             if (fileSnapshot.hasError) {
               return NeonException(
                 fileSnapshot.error,
                 onRetry: () {
                   setState(() {
                     // ignore: discarded_futures
-                    future = widget.getImageFile();
+                    _future = _readImage();
                   });
                 },
                 onlyIcon: true,
@@ -74,11 +62,30 @@ class _NeonCachedImageState extends State<NeonCachedImage> {
                 color: widget.iconColor ?? Theme.of(context).colorScheme.error,
               );
             }
-            return SizedBox(
+
+            final content = fileSnapshot.requireData;
+
+            try {
+              // TODO: Is this safe enough?
+              if (widget.isSvgHint || utf8.decode(content).contains('<svg')) {
+                return SvgPicture.memory(
+                  content,
+                  height: widget.size?.height,
+                  width: widget.size?.width,
+                  fit: widget.fit ?? BoxFit.contain,
+                  colorFilter: widget.svgColor != null ? ColorFilter.mode(widget.svgColor!, BlendMode.srcIn) : null,
+                );
+              }
+            } catch (_) {
+              // If the data is not UTF-8
+            }
+
+            return Image.memory(
+              content,
+              height: widget.size?.height,
               width: widget.size?.width,
-              child: NeonLinearProgressIndicator(
-                color: widget.iconColor,
-              ),
+              fit: widget.fit,
+              gaplessPlayback: true,
             );
           },
         ),