From a6cd97482cedfd6081cbfd14fda5190509b63f0f Mon Sep 17 00:00:00 2001
From: Parvesh Monu <parvesh.dhullmonu@gmail.com>
Date: Mon, 13 May 2024 20:52:05 +0530
Subject: [PATCH] Fix loading screen for fetching community (#19968)

---
 .../contexts/communities/overview/style.cljs  | 10 +++----
 .../contexts/communities/overview/view.cljs   | 26 ++++++++++++-------
 2 files changed, 21 insertions(+), 15 deletions(-)

diff --git a/src/status_im/contexts/communities/overview/style.cljs b/src/status_im/contexts/communities/overview/style.cljs
index 2807a479e2..37aed68139 100644
--- a/src/status_im/contexts/communities/overview/style.cljs
+++ b/src/status_im/contexts/communities/overview/style.cljs
@@ -21,12 +21,10 @@
    :align-items    :center
    :margin-top     20})
 
-(def fetching-placeholder
-  {:align-items     :center
-   :justify-content :center
-   :flex            1})
-
-(def fetching-text {:color :red})
+(defn fetching-placeholder
+  [top-inset]
+  {:flex       1
+   :margin-top top-inset})
 
 (def blur-channel-header
   {:position :absolute
diff --git a/src/status_im/contexts/communities/overview/view.cljs b/src/status_im/contexts/communities/overview/view.cljs
index 2a4f7372d6..6f718c7d88 100644
--- a/src/status_im/contexts/communities/overview/view.cljs
+++ b/src/status_im/contexts/communities/overview/view.cljs
@@ -6,9 +6,10 @@
     [quo.theme]
     [react-native.blur :as blur]
     [react-native.core :as rn]
+    [react-native.safe-area :as safe-area]
     [reagent.core :as reagent]
     [status-im.common.home.actions.view :as actions]
-    [status-im.common.not-implemented :as not-implemented]
+    [status-im.common.resources :as resources]
     [status-im.common.scroll-page.style :as scroll-page.style]
     [status-im.common.scroll-page.view :as scroll-page]
     [status-im.config :as config]
@@ -369,18 +370,25 @@
 
 (defn- community-fetching-placeholder
   [id]
-  (let [fetching? (rf/sub [:communities/fetching-community id])]
+  (let [theme     (quo.theme/use-theme)
+        top-inset (safe-area/get-top)
+        fetching? (rf/sub [:communities/fetching-community id])]
     [rn/view
-     {:style               style/fetching-placeholder
+     {:style               (style/fetching-placeholder top-inset)
       :accessibility-label (if fetching?
                              :fetching-community-overview
                              :failed-to-fetch-community-overview)}
-     [not-implemented/not-implemented
-      [rn/text
-       {:style style/fetching-text}
-       (if fetching?
-         "Fetching community..."
-         "Failed to fetch community")]]]))
+     [quo/page-nav
+      {:title      "Community Overview"
+       :type       :title
+       :text-align :left
+       :icon-name  :i/close
+       :on-press   #(rf/dispatch [:navigate-back])}]
+     [quo/empty-state
+      {:image           (resources/get-themed-image :cat-in-box theme)
+       :description     (when-not fetching? (i18n/label :t/here-is-a-cat-in-a-box-instead))
+       :title           (if fetching? "Fetching community..." "Failed to fetch community")
+       :container-style {:flex 1 :justify-content :center}}]]))
 
 (defn- community-card-page-view
   [id]