Communities now correctly listed in pending/joined sections. (#14515)

src/status_im2/contexts/communities/home/view.cljs

@@ -46,20 +46,25 @@
     :render-fn                         render-fn}])
 
 (defn segments-community-lists [selected-tab]
-  (let [communities (rf/sub [:communities/community-ids])
+  (let [ids-by-user-involvement (rf/sub [:communities/community-ids-by-user-involvement])
         tab @selected-tab]
     [rn/view {:style {:padding-left     20
                       :padding-right    8
                       :padding-vertical 12}}
      (case tab
        :joined
-       [communities-list communities]
+       [communities-list (:joined ids-by-user-involvement)]
 
        :pending
-       [communities-list communities]
+       [communities-list (:pending ids-by-user-involvement)]
 
        :opened
-       [communities-list communities])]))
+       [communities-list (:opened ids-by-user-involvement)]
+
+       [quo/information-box
+        {:type :error
+         :icon :i/info}
+        (i18n/label :t/error)])]))
 
 (defn home []
   (let [selected-tab (reagent/atom :joined)]

src/status_im2/contexts/communities/overview/style.cljs

@@ -1,17 +1,20 @@
 (ns status-im2.contexts.communities.overview.style
-  (:require [react-native.platform :as platform]
+  (:require [react-native.platform :as platform]))
-            [quo2.foundations.colors :as colors]))
 
 (def preview-user
   {:flex-direction :row
    :align-items    :center
    :margin-top     20})
 
-(def blur-channel-header {:blur-amount 32
+(def blur-channel-header
-                          :blur-type :xlight
+  {:position :absolute
-                          :overlay-color (if platform/ios? colors/white-opa-70 :transparent)
-                          :style {:position :absolute
    :top (if platform/ios? 56 60)
    :height 34
    :width "100%"
-                                  :flex 1}})
+   :flex 1})
+
+(def join-button
+  {:width "100%"
+   :margin-top 20
+   :margin-left :auto
+   :margin-right :auto})

src/status_im2/contexts/communities/overview/view.cljs

@@ -44,7 +44,7 @@
   #(rf/dispatch
     [:bottom-sheet/show-sheet
      {:content
-      (constantly [quo/token-gating
+      (fn [] [quo/token-gating
               {:channel {:name name
                          :community-color (colors/custom-color :pink 50)
                          :emoji emoji
@@ -159,8 +159,27 @@
 
 (def channel-list-component (memoize channel-list-component-fn))
 
+(defn join-community [{:keys [joined can-join? requested-to-join-at community-color] :as community}]
+  (let [node-offline? (and can-join? (not joined) (pos? requested-to-join-at))]
+    [:<>
+     (when-not joined
+       [quo/button
+        {:on-press  #(rf/dispatch [:bottom-sheet/show-sheet
+                                   {:content (fn [] [requests.actions/request-to-join community])
+                                    :content-height 300}])
+         :override-background-color community-color
+         :style style/join-button
+         :before :i/communities}
+        (i18n/label :t/join-open-community)])
+     (when node-offline?
+       [quo/information-box
+        {:type :informative
+         :icon :i/info
+         :style {:margin-top 12}}
+        (i18n/label :t/request-processed-after-node-online)])]))
+
 (defn render-page-content [{:keys [name description locked joined id images
-                                   status tokens tags community-color]
+                                   status tokens tags]
                             :as   community}
                            channel-heights first-channel-height]
   (let [thumbnail-image (get-in images [:thumbnail])]
@@ -192,7 +211,7 @@
                              [:bottom-sheet/show-sheet
                               {:content-height 210
                                :content
-                               (constantly [quo/token-gating
+                               (fn [] [quo/token-gating
                                        {:community {:name name
                                                     :community-color colors/primary-50
                                                     :community-avatar (cond
@@ -238,25 +257,17 @@
         [rn/view {:margin-top 12}]
         [quo/community-tags tags]
         [preview-user-list]
-        (when-not joined
+        [join-community community]]
-          [quo/button
-           {:on-press  #(rf/dispatch [:bottom-sheet/show-sheet
-                                      {:content (constantly [requests.actions/request-to-join community])
-                                       :content-height 300}])
-            :override-background-color community-color
-            :style
-            {:width "100%"
-             :margin-top 20
-             :margin-left :auto
-             :margin-right :auto}
-            :before :i/communities}
-           (i18n/label :t/join-open-community)])]
        [channel-list-component channel-heights first-channel-height]])))
 
 (defn render-sticky-header [channel-heights first-channel-height]
   (fn [scroll-height]
     (when (> scroll-height @first-channel-height)
-      [rn/blur-view style/blur-channel-header
+      [rn/blur-view
+       {:blur-amount 32
+        :blur-type :xlight
+        :overlay-color (if platform/ios? colors/white-opa-70 :transparent)
+        :style style/blur-channel-header}
        [quo/divider-label
         {:label (:label (last (filter (fn [{:keys [height]}]
                                         (>= scroll-height (+ height @first-channel-height)))
@@ -274,7 +285,7 @@
                                                     {:icon :i/options
                                                      :background-color (scroll-page/icon-color)
                                                      :on-press #(rf/dispatch [:bottom-sheet/show-sheet
-                                                                              {:content (constantly [home.actions/actions community])
+                                                                              {:content (fn [] [home.actions/actions community])
                                                                                :content-height 400}])}]}
                            name)]
     (fn []
@@ -288,7 +299,6 @@
 (defn overview []
   (let [community-mock (rf/sub [:get-screen-params :community-overview]) ;TODO stop using mock data and only pass community id
         community (rf/sub [:communities/community (:id community-mock)])]
-
     [rn/view {:style
               {:position :absolute
                :top (if platform/ios? 0 44)

src/status_im2/subs/communities.cljs

@@ -91,8 +91,8 @@
  :<- [:communities]
  (fn [[communities-enabled? search-filter communities]]
    (filterv
-    (fn [{:keys [name joined id]}]
+    (fn [{:keys [name id]}]
-      (and joined
+      (and
        (or communities-enabled?
            (= id constants/status-community-id))
        (or (empty? search-filter)
@@ -105,6 +105,25 @@
  (fn [communities]
    (map :id communities)))
 
+(re-frame/reg-sub
+ :communities/community-ids-by-user-involvement
+ :<- [:communities/communities]
+ ;; Return communities splitted by level of user participation. Some communities user
+ ;; already joined, to some of them join request sent and others were opened one day
+ ;; and their data remained in app-db.
+ ;; Result map has form: {:joined [id1, id2] :pending [id3, id5] :opened [id4]}"
+ (fn [communities]
+   (reduce (fn [acc community]
+             (let [joined? (:joined community)
+                   requested? (pos? (:requested-to-join-at community))
+                   id (:id community)]
+               (cond
+                 joined?    (update acc :joined conj id)
+                 requested? (update acc :pending conj id)
+                 :else      (update acc :opened conj id))))
+           {:joined [] :pending [] :opened []}
+           communities)))
+
 (defn community->home-item [community counts]
   {:name                  (:name community)
    :muted?                (:muted community)

src/status_im2/subs/communities_test.cljs

@@ -74,3 +74,38 @@
     (is (= {:unviewed-messages-count 0
             :unviewed-mentions-count 0}
            (rf/sub [sub-name community-id])))))
+
+(h/deftest-sub :communities/community-ids-by-user-involvement
+  [sub-name]
+  (testing "Empty communities list"
+    (swap! rf-db/app-db assoc :communities
+           {})
+    (is (= {:joined [], :pending [], :opened []}
+           (rf/sub [sub-name]))))
+  (testing "Only opened communities"
+    (swap! rf-db/app-db assoc
+           :communities/enabled? true
+           :communities
+           {"0x1" {:id "0x1" :name "civilized monkeys"}
+            "0x2" {:id "0x2" :name "Civilized rats"}
+            "0x3" {:id "0x3" :name "Civilized dolphins"}})
+    (is (= {:joined [], :pending [], :opened ["0x1" "0x2" "0x3"]}
+           (rf/sub [sub-name]))))
+  (testing "One joined community and two opened ones"
+    (swap! rf-db/app-db assoc
+           :communities/enabled? true
+           :communities
+           {"0x1" {:id "0x1" :name "civilized monkeys" :joined true}
+            "0x2" {:id "0x2" :name "Civilized rats"}
+            "0x3" {:id "0x3" :name "Civilized dolphins"}})
+    (is (= {:joined ["0x1"], :pending [], :opened ["0x2" "0x3"]}
+           (rf/sub [sub-name]))))
+  (testing "One joined community, one open and one pending"
+    (swap! rf-db/app-db assoc
+           :communities/enabled? true
+           :communities
+           {"0x1" {:id "0x1" :name "civilized monkeys" :joined true}
+            "0x2" {:id "0x2" :name "Civilized rats" :requested-to-join-at 1000}
+            "0x3" {:id "0x3" :name "Civilized dolphins"}})
+    (is (= {:joined ["0x1"], :pending ["0x2"], :opened ["0x3"]}
+           (rf/sub [sub-name])))))

translations/en.json

@@ -1123,6 +1123,7 @@
     "repeat-pin": "Repeat new 6-digit passcode",
     "repeat-puk": "Repeat new 12-digit PUK",
     "report-bug-email-template": "1. Issue Description\n{{description}}\n\n\n2. Steps to reproduce\n{{steps}}\n\n\n3. Attach screenshots that can demo the problem, please\n",
+    "request-processed-after-node-online": "Your request will be processed once the community owner node is back online.",
     "request-transaction": "Request transaction",
     "required-field": "Required field",
     "resend-message": "Resend",