diff --git a/src/status_im/contexts/communities/actions/community_options/view.cljs b/src/status_im/contexts/communities/actions/community_options/view.cljs index dd28f209d7..2632b5838b 100644 --- a/src/status_im/contexts/communities/actions/community_options/view.cljs +++ b/src/status_im/contexts/communities/actions/community_options/view.cljs @@ -25,12 +25,12 @@ {:community-id id}])}) (defn view-rules - [id] + [id intro-message] {:icon :i/bullet-list :right-icon :i/chevron-right :accessibility-label :view-community-rules :on-press #(rf/dispatch [:show-bottom-sheet - {:content (fn [] [see-rules/view id])}]) + {:content (fn [] [see-rules/view id intro-message])}]) :label (i18n/label :t/view-community-rules)}) (defn view-token-gating @@ -131,9 +131,9 @@ request-id])}])}) (defn not-joined-options - [id token-gated? pending?] + [id token-gated? pending? intro-message] [[(when-not token-gated? (view-members id)) - (when-not token-gated? (view-rules id)) + (when-not token-gated? (view-rules id intro-message)) (invite-contacts id) (when token-gated? (view-token-gating id)) (when (and pending? (ff/enabled? ::ff/community.edit-account-selection)) @@ -142,19 +142,19 @@ (share-community id)]]) (defn join-request-sent-options - [id token-gated? request-id] - [(conj (first (not-joined-options id token-gated? request-id)) + [id token-gated? request-id intro-message] + [(conj (first (not-joined-options id token-gated? request-id intro-message)) (assoc (cancel-request-to-join id request-id) :add-divider? true))]) (defn banned-options - [id token-gated?] + [id token-gated? intro-message] (let [pending? false] - (not-joined-options id token-gated? pending?))) + (not-joined-options id token-gated? pending? intro-message))) (defn joined-options - [id token-gated? muted? muted-till color] + [id token-gated? muted? muted-till color intro-message] [[(view-members id) - (view-rules id) + (view-rules id intro-message) (when token-gated? (view-token-gating id)) (when (ff/enabled? ::ff/community.edit-account-selection) (edit-shared-addresses id)) @@ -167,9 +167,9 @@ [(assoc (leave-community id color) :add-divider? true)]]) (defn owner-options - [id token-gated? muted? muted-till] + [id token-gated? muted? muted-till intro-message] [[(view-members id) - (view-rules id) + (view-rules id intro-message) (when token-gated? (view-token-gating id)) (mark-as-read id) (mute-community id muted? muted-till) @@ -181,14 +181,15 @@ (defn get-context-drawers [{:keys [id]}] (let [{:keys [token-permissions admin joined - muted banList muted-till color]} (rf/sub [:communities/community id]) - request-id (rf/sub [:communities/my-pending-request-to-join id])] + muted banList muted-till color + intro-message]} (rf/sub [:communities/community id]) + request-id (rf/sub [:communities/my-pending-request-to-join id])] (cond - admin (owner-options id token-permissions muted muted-till) - joined (joined-options id token-permissions muted muted-till color) - request-id (join-request-sent-options id token-permissions request-id) - banList (banned-options id token-permissions) - :else (not-joined-options id token-permissions request-id)))) + admin (owner-options id token-permissions muted muted-till intro-message) + joined (joined-options id token-permissions muted muted-till color intro-message) + request-id (join-request-sent-options id token-permissions request-id intro-message) + banList (banned-options id token-permissions intro-message) + :else (not-joined-options id token-permissions request-id intro-message)))) (defn community-options-bottom-sheet [id] diff --git a/src/status_im/contexts/communities/actions/community_rules_list/style.cljs b/src/status_im/contexts/communities/actions/community_rules_list/style.cljs index 3428630a76..213e42d9ca 100644 --- a/src/status_im/contexts/communities/actions/community_rules_list/style.cljs +++ b/src/status_im/contexts/communities/actions/community_rules_list/style.cljs @@ -3,8 +3,7 @@ (def community-rule {:flex-direction :row :flex 1 - :align-items :flex-start - :margin-top 16}) + :align-items :flex-start}) (def community-rule-index {:margin-left 4}) diff --git a/src/status_im/contexts/communities/actions/generic_menu/style.cljs b/src/status_im/contexts/communities/actions/generic_menu/style.cljs index d9f6512054..b57e99e314 100644 --- a/src/status_im/contexts/communities/actions/generic_menu/style.cljs +++ b/src/status_im/contexts/communities/actions/generic_menu/style.cljs @@ -1,10 +1,16 @@ (ns status-im.contexts.communities.actions.generic-menu.style) -(def container - {:flex 1 - :margin-left 20 - :margin-right 20 - :margin-bottom 20}) +(defn container + [max-height] + {:flex 1 + :max-height max-height + :margin-left 20 + :margin-right 20}) + +(defn scroll-view-style + [max-height] + {:margin-bottom 12 + :max-height max-height}) (def inner-container {:display :flex @@ -14,4 +20,4 @@ (def community-tag {:margin-right :auto - :margin-top 8}) + :margin-top 4}) diff --git a/src/status_im/contexts/communities/actions/generic_menu/view.cljs b/src/status_im/contexts/communities/actions/generic_menu/view.cljs index d7c29b10ab..4521be3266 100644 --- a/src/status_im/contexts/communities/actions/generic_menu/view.cljs +++ b/src/status_im/contexts/communities/actions/generic_menu/view.cljs @@ -1,24 +1,49 @@ (ns status-im.contexts.communities.actions.generic-menu.view (:require + [oops.core :as oops] [quo.core :as quo] [react-native.core :as rn] + [react-native.gesture :as gesture] + [react-native.safe-area :as safe-area] [status-im.contexts.communities.actions.generic-menu.style :as style] [utils.re-frame :as rf])) (defn view [{:keys [id title]} children] - (let [{:keys [name images]} (rf/sub [:communities/community id])] - [rn/view {:style style/container} - [rn/view {:style style/inner-container} - [quo/text - {:accessibility-label :communities-join-community - :weight :semi-bold - :size :heading-2} - title]] - [rn/view {:style style/community-tag} - [quo/context-tag - {:type :community - :size 24 - :community-logo (:thumbnail images) - :community-name name}]] - children])) + (let [{:keys [name images]} (rf/sub [:communities/community id]) + [content-height set-content-height] (rn/use-state 0) + [sheet-header-height set-header-height] (rn/use-state 0) + insets (safe-area/get-insets) + {window-height :height} (rn/get-window) + sheet-max-height (- window-height (:top insets)) + max-height (- sheet-max-height sheet-header-height)] + [rn/view {:style (style/container max-height)} + [rn/view + {:style {:padding-bottom 12} + :on-layout (fn [event] + (set-header-height (oops/oget + event + "nativeEvent.layout.height")))} + [rn/view {:style style/inner-container} + [quo/text + {:accessibility-label :communities-join-community + :weight :semi-bold + :size :heading-2} + title]] + [rn/view {:style style/community-tag} + [quo/context-tag + {:type :community + :size 24 + :community-logo (:thumbnail images) + :community-name name}]]] + [gesture/scroll-view + {:scroll-enabled (> content-height max-height) + :scroll-event-throttle 16 + :style (style/scroll-view-style max-height) + :shows-vertical-scroll-indicator false} + [rn/view + {:on-layout (fn [event] + (set-content-height (oops/oget + event + "nativeEvent.layout.height")))} + children]]])) diff --git a/src/status_im/contexts/communities/actions/see_rules/view.cljs b/src/status_im/contexts/communities/actions/see_rules/view.cljs index 3e680e5557..1078117852 100644 --- a/src/status_im/contexts/communities/actions/see_rules/view.cljs +++ b/src/status_im/contexts/communities/actions/see_rules/view.cljs @@ -1,13 +1,21 @@ (ns status-im.contexts.communities.actions.see-rules.view (:require + [quo.core :as quo] + [react-native.core :as rn] [status-im.contexts.communities.actions.community-rules-list.view :as community-rules] [status-im.contexts.communities.actions.generic-menu.view :as generic-menu] [utils.i18n :as i18n])) (defn view - [id] + [id intro-message] [generic-menu/view {:id id :title (i18n/label :t/community-rules)} - - [community-rules/view community-rules/standard-rules]]) + [rn/view {:style {:padding-top 8}} + (if (empty? intro-message) + [community-rules/view community-rules/standard-rules] + [quo/text + {:accessibility-label :communities-rules + :weight :regular + :size :paragraph-2} + intro-message])]])