From 6e30d9faa85292e366ea0d641355dd73f3ea9367 Mon Sep 17 00:00:00 2001 From: Ulises Manuel <90291778+ulisesmac@users.noreply.github.com> Date: Fri, 21 Feb 2025 08:40:18 -0600 Subject: [PATCH] fix(communities): Add missing stats (#22143) * fix(communities): Stats not shown in discover page * fix issues in the discover screen related to the theme --- .../community/community_card_view.cljs | 10 +- .../community/community_list_view.cljs | 2 +- .../components/community/community_view.cljs | 9 +- src/quo/components/community/style.cljs | 26 ++-- .../communities/actions/leave/events.cljs | 4 +- .../contexts/communities/discover/view.cljs | 144 +++++++++--------- 6 files changed, 93 insertions(+), 102 deletions(-) diff --git a/src/quo/components/community/community_card_view.cljs b/src/quo/components/community/community_card_view.cljs index ba0aafb3c5..d19f4f72b7 100644 --- a/src/quo/components/community/community_card_view.cljs +++ b/src/quo/components/community/community_card_view.cljs @@ -55,7 +55,7 @@ [rn/view (style/card-view-chat-icon 48 theme) [icon/community-icon {:images images} 48]] (when (= status :gated) - [rn/view (style/permission-tag-styles) + [rn/view style/permission-tag-styles [community-view/permission-tag-container {:locked? locked? :status status @@ -63,10 +63,12 @@ [community-view/community-title {:title name :description description}] - [rn/view {:style (style/card-stats-position)} + [rn/view {:style style/card-stats-position} [community-view/community-stats-column - {:type :card-view}]] - [rn/view {:style (style/community-tags-position)} + {:type :card-view + :members-count (:members-count community) + :active-members-count (:active-members-count community)}]] + [rn/view {:style style/community-tags-position} [community-view/community-tags {:tags tags}]]]]]])) (defn view diff --git a/src/quo/components/community/community_list_view.cljs b/src/quo/components/community/community_list_view.cljs index cf4ad50943..8e03c61df5 100644 --- a/src/quo/components/community/community_list_view.cljs +++ b/src/quo/components/community/community_list_view.cljs @@ -60,7 +60,7 @@ :style {:border-radius 12 :margin-left 12}} props) - [rn/view (merge (style/membership-info-container) style) + [rn/view (merge style/membership-info-container style) [community-icon/community-icon {:images images} 32] [rn/view diff --git a/src/quo/components/community/community_view.cljs b/src/quo/components/community/community_view.cljs index 65c159e125..28565d2ec7 100644 --- a/src/quo/components/community/community_view.cljs +++ b/src/quo/components/community/community_view.cljs @@ -11,11 +11,8 @@ [react-native.gesture :as gesture])) (defn community-stats-column - [{:keys [type members-count active-count]}] - [rn/view - (if (= type :card-view) - (style/card-stats-container) - (style/list-stats-container)) + [{:keys [type members-count active-members-count]}] + [rn/view (if (= type :card-view) style/card-stats-container style/list-stats-container) [community-stat/view {:accessibility-label :stats-members-count :icon :i/group @@ -24,7 +21,7 @@ [community-stat/view {:accessibility-label :stats-active-count :icon :i/active-members - :value active-count}]]) + :value active-members-count}]]) (defn community-tags [{:keys [tags container-style last-item-style]}] diff --git a/src/quo/components/community/style.cljs b/src/quo/components/community/style.cljs index 492d62c6cf..ec94ff9d9f 100644 --- a/src/quo/components/community/style.cljs +++ b/src/quo/components/community/style.cljs @@ -17,24 +17,20 @@ (def detail-container {:flex 1}) -(defn card-stats-container - [] +(def card-stats-container {:flex-direction :row}) -(defn list-stats-container - [] +(def list-stats-container {:flex-direction :row :align-items :center}) -(defn card-stats-position - [] +(def card-stats-position {:position :absolute :top 116 :right 12 :left 12}) -(defn community-tags-position - [] +(def community-tags-position {:position :absolute :top 154 :right 12 @@ -68,8 +64,7 @@ colors/neutral-90 theme)}) -(defn membership-info-container - [] +(def membership-info-container {:flex-direction :row :border-radius 16 :align-items :center @@ -87,8 +82,7 @@ :border-top-left-radius 20 :background-color colors/primary-50-opa-20}) -(defn permission-tag-styles - [] +(def permission-tag-styles {:position :absolute :top 8 :right 8}) @@ -146,10 +140,14 @@ :background-color (colors/theme-colors colors/white colors/neutral-90 theme)}) (def loading-tags-container - {:margin-top 20 :flex-direction :row :align-items :center}) + {:margin-top 20 + :flex-direction :row + :align-items :center}) (def loading-stats-container - {:margin-top 20 :flex-direction :row :align-items :center}) + {:margin-top 20 + :flex-direction :row + :align-items :center}) (defn loading-stat-circle [theme margin-left] diff --git a/src/status_im/contexts/communities/actions/leave/events.cljs b/src/status_im/contexts/communities/actions/leave/events.cljs index a95421f64c..ef73fbdefe 100644 --- a/src/status_im/contexts/communities/actions/leave/events.cljs +++ b/src/status_im/contexts/communities/actions/leave/events.cljs @@ -18,7 +18,9 @@ :params [{:id request-to-join-id}] :on-success #(rf/dispatch [:communities/cancel-request-to-join-success %]) :js-response true - :on-error #(log/error "failed to cancel request to join community" request-to-join-id %)}]})) + :on-error #(log/error "failed to cancel request to join community" + request-to-join-id + %)}]})) (rf/reg-event-fx :communities/left (fn [_ [response-js]] diff --git a/src/status_im/contexts/communities/discover/view.cljs b/src/status_im/contexts/communities/discover/view.cljs index 169e8265f7..bfe6c5f5c8 100644 --- a/src/status_im/contexts/communities/discover/view.cljs +++ b/src/status_im/contexts/communities/discover/view.cljs @@ -34,8 +34,7 @@ (defn screen-title [] - [rn/view - {:style (style/screen-title-container (safe-area/get-top))} + [rn/view {:style (style/screen-title-container (safe-area/get-top))} [quo/text {:accessibility-label :communities-screen-title :weight :semi-bold @@ -95,14 +94,14 @@ (defn featured-list [communities view-type] - (let [view-size (reagent/atom 0) - loaded? (and communities (pos? (count communities)))] + (let [view-size (reagent/atom 0) + set-view-size (fn [e] + (reset! view-size (- (oops/oget e "nativeEvent.layout.width") 40))) + loaded? (and communities (pos? (count communities)))] (fn [] [rn/view {:style style/featured-list-container - :on-layout #(swap! view-size - (fn [_] - (- (oops/oget % "nativeEvent.layout.width") 40)))} + :on-layout set-view-size} (when-not (= @view-size 0) [rn/flat-list {:key-fn :id @@ -132,32 +131,29 @@ [discover-communities-segments selected-tab false]]) (defn other-communities-list - [{:keys [communities communities-ids view-type]}] + [{:keys [communities view-type]}] [rn/view {:style style/other-communities-container} - (if (and communities (pos? (count communities))) - (map-indexed - (fn [inner-index item] - (let [community-id (when communities-ids item) - community (if communities - item - (rf/sub [:communities/home-item community-id])) - cover {:uri (get-in (:images item) [:banner :uri])}] - [rn/view - {:key (str inner-index (:id community)) - :margin-bottom 16} - (if (= view-type :card-view) - [quo/community-card-view-item - {:community (assoc community :cover cover) - :on-press #(rf/dispatch [:communities/navigate-to-community-overview (:id community)])}] - - [quo/community-list - {:on-press (fn [] - (rf/dispatch [:dismiss-keyboard]) - (rf/dispatch [:communities/navigate-to-community-overview - (:id community)])) - :on-long-press #(js/alert "TODO: to be implemented")} - community])])) - (if communities communities communities-ids)) + (if (seq communities) + (map-indexed (fn [inner-index {community-id :id :as community}] + (let [cover {:uri (-> community :images :banner :uri)}] + [rn/view + {:key (str inner-index community-id) + :style {:margin-bottom 16}} + (if (= view-type :card-view) + [quo/community-card-view-item + {:community (assoc community + :cover cover + :members-count (count (:members community))) + :on-press #(rf/dispatch [:communities/navigate-to-community-overview + community-id])}] + [quo/community-list + {:on-press (fn [] + (rf/dispatch [:dismiss-keyboard]) + (rf/dispatch [:communities/navigate-to-community-overview + community-id])) + :on-long-press #(js/alert "TODO: to be implemented")} + community])])) + communities) [:<> [rn/view {:margin-bottom 16} [quo/community-card-view-item {:loading? true}]] [rn/view {:margin-bottom 16} [quo/community-card-view-item {:loading? true}]] @@ -168,8 +164,9 @@ [rn/view {:style {:flex 1}} (case @selected-tab :all - (other-communities-list {:communities (rf/sub [:communities/other-contract-communities]) - :view-type view-type}) + [other-communities-list + {:communities (rf/sub [:communities/other-contract-communities]) + :view-type view-type}] :open [:<>] @@ -183,60 +180,55 @@ (i18n/label :t/error)])]) (defn render-communities - [selected-tab - featured-communities-count - featured-communities - view-type] - (fn [] - [rn/view - [discover-communities-header - {:selected-tab selected-tab - :view-type view-type - :featured-communities-count featured-communities-count - :featured-communities featured-communities}] - [communities-lists selected-tab view-type]])) + [{:keys [selected-tab featured-communities-count featured-communities view-type]}] + [rn/view + [discover-communities-header + {:selected-tab selected-tab + :view-type view-type + :featured-communities-count featured-communities-count + :featured-communities featured-communities}] + [communities-lists selected-tab view-type]]) (defn render-sticky-header [{:keys [selected-tab scroll-height]}] - (fn [] - (when (> @scroll-height 360) - [rn/view - {:style (style/blur-tabs-header (safe-area/get-top))} - [discover-communities-segments selected-tab true]]))) + (when (> @scroll-height 360) + [rn/view + {:style (style/blur-tabs-header (safe-area/get-top))} + [discover-communities-segments selected-tab true]])) (defn discover-screen-content - [featured-communities theme] - (let [view-type (reagent/atom :card-view) - selected-tab (reagent/atom :all) - scroll-height (reagent/atom 0) - featured-communities-count (count featured-communities)] + [] + (let [view-type (reagent/atom :card-view) + selected-tab (reagent/atom :all) + scroll-height (reagent/atom 0)] (fn [] - [scroll-page/scroll-page - {:on-scroll #(reset! scroll-height %) - :page-nav-props {:background :blur} - :navigate-back? :true - :height (if (> @scroll-height 360) - 208 - 148) - :background-color (colors/theme-colors colors/white colors/neutral-95 theme) - :sticky-header [render-sticky-header - {:selected-tab selected-tab - :scroll-height scroll-height}]} - - [render-communities - selected-tab - featured-communities-count - featured-communities - @view-type]]))) + (let [theme (quo.theme/use-theme) + featured-communities (rf/sub [:communities/featured-contract-communities]) + featured-communities-count (count featured-communities)] + [scroll-page/scroll-page + {:on-scroll #(reset! scroll-height %) + :page-nav-props {:background :blur} + :navigate-back? :true + :height (if (> @scroll-height 360) + 208 + 148) + :background-color (colors/theme-colors colors/white colors/neutral-95 theme) + :sticky-header [render-sticky-header + {:selected-tab selected-tab + :scroll-height scroll-height}]} + [render-communities + {:selected-tab selected-tab + :featured-communities-count featured-communities-count + :featured-communities featured-communities + :view-type @view-type}]])))) (defn view [] - (let [theme (quo.theme/use-theme) - featured-communities (rf/sub [:communities/featured-contract-communities])] + (let [theme (quo.theme/use-theme)] (rn/use-mount #(rf/dispatch [:fetch-contract-communities])) [rn/view {:style (style/discover-screen-container (colors/theme-colors colors/white colors/neutral-95 theme))} - [discover-screen-content featured-communities theme]])) + [discover-screen-content]]))