updated community rules to display the actual rules

* updated community rules to display the actual rules

* updated scroll behaviours on community rules inside the bottom sheet

* added standard rules for communities without rules

* fix android scroll issues

Author: jo-mut

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]

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})

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})

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]]]))

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])]])