Add loading indicator when community is fetching

Signed-off-by: andrey <motor4ik@gmail.com>

src/status_im/chat/models/link_preview.cljs

@@ -3,6 +3,7 @@
             [status-im.utils.fx :as fx]
             [status-im.multiaccounts.update.core :as multiaccounts.update]
             [status-im.ethereum.json-rpc :as json-rpc]
+            [status-im.communities.core :as models.communities]
             [taoensso.timbre :as log]))
 
 (fx/defn enable
@@ -27,13 +28,37 @@
                #{})
              {})))
 
+(defn community-resolved [db community-id]
+  (update db :communities/resolve-community-info dissoc community-id))
+
+(defn community-failed-to-resolve [db community-id]
+  (update db :communities/resolve-community-info dissoc community-id))
+
+(defn community-resolving [db community-id]
+  (assoc-in db [:communities/resolve-community-info community-id] true))
+
+(fx/defn handle-community-failed-to-resolve
+  {:events [::community-failed-to-resolve]}
+  [{:keys [db]} community-id]
+  {:db (community-failed-to-resolve db community-id)})
+
+(fx/defn handle-community-resolved
+  {:events [::community-resolved]}
+  [{:keys [db] :as cofx} community-id community]
+  (fx/merge cofx
+            {:db (community-resolved db community-id)}
+            (models.communities/handle-community community)))
+
 (fx/defn resolve-community-info
   {:events [::resolve-community-info]}
-  [cofx community-id]
+  [{:keys [db]} community-id]
-  {::json-rpc/call [{:method     (json-rpc/call-ext-method "requestCommunityInfoFromMailserver")
+  {:db (community-resolving db community-id)
+   ::json-rpc/call [{:method     (json-rpc/call-ext-method "requestCommunityInfoFromMailserver")
                      :params     [community-id]
-                     :on-success #()
+                     :on-success #(re-frame/dispatch [::community-resolved community-id %])
-                     :on-error   #(log/error "Failed to request community info from mailserver")}]})
+                     :on-error   #(do
+                                    (re-frame/dispatch [::community-failed-to-resolve community-id])
+                                    (log/error "Failed to request community info from mailserver"))}]})
 
 (fx/defn load-link-preview-data
   {:events [::load-link-preview-data]}
@@ -82,4 +107,3 @@
   [{:keys [db]} whitelist]
   {:db (assoc db :link-previews-whitelist
               whitelist)})
-

src/status_im/communities/core.cljs

@@ -81,6 +81,10 @@
                db
                chat-ids)})
 
+(fx/defn handle-community
+  [{:keys [db]} {:keys [id] :as community}]
+  {:db (assoc-in db [:communities id] (<-rpc community))})
+
 (fx/defn handle-communities
   {:events [::fetched]}
   [{:keys [db]} communities]

src/status_im/subs.cljs

@@ -238,6 +238,7 @@
 (reg-root-key-sub :communities/requests-to-join :communities/requests-to-join)
 (reg-root-key-sub :communities/community-id-input :communities/community-id-input)
 (reg-root-key-sub :communities/enabled? :communities/enabled?)
+(reg-root-key-sub :communities/resolve-community-info :communities/resolve-community-info)
 
 (reg-root-key-sub :activity.center/notifications :activity.center/notifications)
 (reg-root-key-sub :activity.center/notifications-count :activity.center/notifications-count)
@@ -260,6 +261,12 @@
      raw-communities
      [])))
 
+(re-frame/reg-sub
+ :communities/fetching-community
+ :<- [:communities/resolve-community-info]
+ (fn [info [_ id]]
+   (get info id)))
+
 (re-frame/reg-sub
  :communities/section-list
  :<- [:communities]

src/status_im/ui/screens/communities/community.cljs

@@ -4,11 +4,13 @@
             [status-im.ui.components.toolbar :as toolbar]
             [quo.core :as quo]
             [status-im.constants :as constants]
+            [status-im.chat.models.link-preview :as link-preview]
             [status-im.utils.handlers :refer [>evt <sub]]
             [status-im.i18n.i18n :as i18n]
             [status-im.utils.datetime :as datetime]
             [status-im.communities.core :as communities]
             [status-im.ui.components.list.views :as list]
+            [status-im.ui.components.react :as components.react]
             [status-im.ui.screens.home.views.inner-item :as inner-item]
             [status-im.ui.screens.chat.photos :as photos]
             [status-im.react-native.resources :as resources]
@@ -240,10 +242,18 @@
       :data                         chats
       :render-fn                    channel-preview-item}]))
 
-(defn unknown-community []
+(defn unknown-community [community-id]
-  [rn/view {:style {:flex 1}}
+  (let [fetching (<sub [:communities/fetching-community community-id])]
-   [topbar/topbar {:title  (i18n/label :t/not-found)}]
+    [:<> {:style {:flex 1}}
-   [blank-page (i18n/label :t/community-info-not-found)]])
+     [topbar/topbar {:title  (if fetching (i18n/label :t/fetching-community) (i18n/label :t/not-found))}]
+     [rn/view {:style {:padding 16 :flex 1 :flex-direction :row :align-items :center :justify-content :center}}
+
+      [quo/button {:on-press (when-not fetching #(>evt [::link-preview/resolve-community-info community-id]))
+                   :disabled fetching
+                   :color :secondary}
+       (if fetching
+         [components.react/small-loading-indicator]
+         (i18n/label :t/fetch-community))]]]))
 
 (defn community-edit []
   (let [{:keys [community-id]} (<sub [:get-screen-params])]
@@ -319,4 +329,4 @@
                  :center       [quo/button {:on-press #(>evt [::communities/join id])
                                             :type     :secondary}
                                 (i18n/label :t/follow)]}]))]
-          [unknown-community])))))
+          [unknown-community community-id])))))

translations/en.json

@@ -1325,6 +1325,8 @@
     "welcome-blank-message": "Your chats will appear here. To start new chats press the ⊕ button",
     "welcome-community-blank-message": "Your chats will appear here. To start new chats click on the 3 dots above and select \"Create a channel\"",
     "welcome-blank-community-message": "Your communities will appear here.",
+    "fetch-community": "Fetch community",
+    "fetching-community": "Fetching community...",
     "seed-phrase-placeholder": "Seed phrase...",
     "word-count": "Word count",
     "word-n": "Word #{{number}}",