From 37cfac27b802a93760e94455e28d35e530eff2aa Mon Sep 17 00:00:00 2001
From: Alex <alex.tran1502@gmail.com>
Date: Mon, 13 Feb 2023 06:29:45 -0600
Subject: [PATCH] fix(mobile): Remove unsplash placeholder image and style
 empty places, objects (#1742)

---
 mobile/assets/i18n/en-US.json                 |  2 -
 .../search/ui/thumbnail_with_info.dart        | 54 ++++++++++++-------
 .../lib/modules/search/views/search_page.dart |  9 ++--
 3 files changed, 37 insertions(+), 28 deletions(-)

diff --git a/mobile/assets/i18n/en-US.json b/mobile/assets/i18n/en-US.json
index 815e79603d..5cf57275ff 100644
--- a/mobile/assets/i18n/en-US.json
+++ b/mobile/assets/i18n/en-US.json
@@ -145,8 +145,6 @@
   "profile_drawer_settings": "Settings",
   "profile_drawer_sign_out": "Sign Out",
   "search_bar_hint": "Search your photos",
-  "search_page_no_objects": "No Objects Info Available",
-  "search_page_no_places": "No Places Info Available",
   "search_page_places": "Places",
   "search_page_things": "Things",
   "search_result_page_new_search_hint": "New Search",
diff --git a/mobile/lib/modules/search/ui/thumbnail_with_info.dart b/mobile/lib/modules/search/ui/thumbnail_with_info.dart
index 211a72d71f..932d7f8ec9 100644
--- a/mobile/lib/modules/search/ui/thumbnail_with_info.dart
+++ b/mobile/lib/modules/search/ui/thumbnail_with_info.dart
@@ -7,18 +7,21 @@ class ThumbnailWithInfo extends StatelessWidget {
   const ThumbnailWithInfo({
     Key? key,
     required this.textInfo,
-    required this.imageUrl,
+    this.imageUrl,
+    this.noImageIcon,
     required this.onTap,
   }) : super(key: key);
 
   final String textInfo;
-  final String imageUrl;
+  final String? imageUrl;
   final Function onTap;
+  final IconData? noImageIcon;
 
   @override
   Widget build(BuildContext context) {
     var box = Hive.box(userInfoBox);
-
+    var isDarkMode = Theme.of(context).brightness == Brightness.dark;
+    var textAndIconColor = isDarkMode ? Colors.grey[100] : Colors.grey[700];
     return GestureDetector(
       onTap: () {
         onTap();
@@ -31,26 +34,37 @@ class ThumbnailWithInfo extends StatelessWidget {
             alignment: Alignment.bottomCenter,
             children: [
               Container(
-                foregroundDecoration: BoxDecoration(
-                  borderRadius: BorderRadius.circular(10),
-                  color: Colors.black26,
-                ),
-                child: ClipRRect(
-                  borderRadius: BorderRadius.circular(10),
-                  child: CachedNetworkImage(
-                    width: 250,
-                    height: 250,
-                    fit: BoxFit.cover,
-                    imageUrl: imageUrl,
-                    httpHeaders: {
-                      "Authorization": "Bearer ${box.get(accessTokenKey)}"
-                    },
+                decoration: BoxDecoration(
+                  borderRadius: BorderRadius.circular(25),
+                  color: isDarkMode ? Colors.grey[900] : Colors.grey[100],
+                  border: Border.all(
+                    color: isDarkMode ? Colors.grey[800]! : Colors.grey[400]!,
+                    width: 1,
                   ),
                 ),
+                child: imageUrl != null
+                    ? ClipRRect(
+                        borderRadius: BorderRadius.circular(20),
+                        child: CachedNetworkImage(
+                          width: 250,
+                          height: 250,
+                          fit: BoxFit.cover,
+                          imageUrl: imageUrl!,
+                          httpHeaders: {
+                            "Authorization": "Bearer ${box.get(accessTokenKey)}"
+                          },
+                        ),
+                      )
+                    : Center(
+                        child: Icon(
+                          noImageIcon ?? Icons.not_listed_location,
+                          color: textAndIconColor,
+                        ),
+                      ),
               ),
               Positioned(
-                bottom: 8,
-                left: 10,
+                bottom: 12,
+                left: 14,
                 child: SizedBox(
                   width: MediaQuery.of(context).size.width / 3,
                   child: Text(
@@ -58,7 +72,7 @@ class ThumbnailWithInfo extends StatelessWidget {
                     style: const TextStyle(
                       color: Colors.white,
                       fontWeight: FontWeight.bold,
-                      fontSize: 14,
+                      fontSize: 12,
                     ),
                   ),
                 ),
diff --git a/mobile/lib/modules/search/views/search_page.dart b/mobile/lib/modules/search/views/search_page.dart
index 14c8202d2e..f5a1e57ee2 100644
--- a/mobile/lib/modules/search/views/search_page.dart
+++ b/mobile/lib/modules/search/views/search_page.dart
@@ -85,9 +85,7 @@ class SearchPage extends HookConsumerWidget {
                     itemCount: 1,
                     itemBuilder: ((context, index) {
                       return ThumbnailWithInfo(
-                        imageUrl:
-                            'https://images.unsplash.com/photo-1612178537253-bccd437b730e?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxzZWFyY2h8NXx8Ymxhbmt8ZW58MHx8MHx8&auto=format&fit=crop&w=700&q=60',
-                        textInfo: 'search_page_no_places'.tr(),
+                        textInfo: '',
                         onTap: () {},
                       );
                     }),
@@ -140,9 +138,8 @@ class SearchPage extends HookConsumerWidget {
                     itemCount: 1,
                     itemBuilder: ((context, index) {
                       return ThumbnailWithInfo(
-                        imageUrl:
-                            'https://images.unsplash.com/photo-1612178537253-bccd437b730e?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxzZWFyY2h8NXx8Ymxhbmt8ZW58MHx8MHx8&auto=format&fit=crop&w=700&q=60',
-                        textInfo: 'search_page_no_objects'.tr(),
+                        textInfo: '',
+                        noImageIcon: Icons.signal_cellular_no_sim_sharp,
                         onTap: () {},
                       );
                     }),