From 181a0783fd777428922646d312fbe41571e455df Mon Sep 17 00:00:00 2001
From: Grant Skinner <grant@gskinner.com>
Date: Mon, 26 Sep 2022 16:41:58 -0600
Subject: [PATCH] Improve loading state UI of search tiles

---
 .../artifact_search/widgets/_result_tile.dart | 23 +++++++++++--------
 1 file changed, 13 insertions(+), 10 deletions(-)

diff --git a/lib/ui/screens/artifact/artifact_search/widgets/_result_tile.dart b/lib/ui/screens/artifact/artifact_search/widgets/_result_tile.dart
index 29c35ce7..e14b1c22 100644
--- a/lib/ui/screens/artifact/artifact_search/widgets/_result_tile.dart
+++ b/lib/ui/screens/artifact/artifact_search/widgets/_result_tile.dart
@@ -8,15 +8,13 @@ class _ResultTile extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    final Widget content = Container(
-      color: $styles.colors.black,
-      width: double.infinity,
-      child: AppImage(
-        key: ValueKey(data.id),
-        image: NetworkImage(data.imageUrl),
-        fit: BoxFit.cover,
-        scale: 0.5,
-      ),
+    final Widget image = AppImage(
+      key: ValueKey(data.id),
+      image: NetworkImage(data.imageUrl),
+      fit: BoxFit.cover,
+      scale: 0.5,
+      distractor: true,
+      color: $styles.colors.greyMedium.withOpacity(0.2),
     );
 
     return AspectRatio(
@@ -26,7 +24,12 @@ class _ResultTile extends StatelessWidget {
         child: AppBtn.basic(
           semanticLabel: data.title,
           onPressed: () => onPressed(data),
-          child: content,
+          child: Container(
+            color: $styles.colors.black,
+            width: double.infinity, // force image to fill area
+            height: double.infinity,
+            child: image,
+          ),
         ),
       ),
     );