Fix join communities design review bugs

* fix: join communities design review bugs

* updated design fixes

src/status_im2/common/scroll_page/style.cljs

@@ -67,7 +67,9 @@
     :top           (- (+ picture-radius picture-border-width))
     :left          (- (/ picture-radius 2) picture-border-width)}))
 
-(def display-picture
+(defn display-picture
+  [theme]
   {:border-radius    picture-diameter
    :width            picture-diameter
-   :height        picture-diameter})
+   :height           picture-diameter
+   :background-color (colors/theme-colors colors/white colors/neutral-95 theme)})

src/status_im2/common/scroll_page/view.cljs

@@ -83,7 +83,7 @@
 
 
 (defn f-display-picture
-  [scroll-height cover]
+  [scroll-height cover theme]
   (let [input-range [0 150]
         y           (reanimated/use-shared-value scroll-height)
         animation   (reanimated/interpolate y
@@ -99,12 +99,12 @@
      {:style (style/display-picture-container animation)}
      [rn/image
       {:source cover
-       :style  style/display-picture}]]))
+       :style  (style/display-picture theme)}]]))
 
 (defn scroll-page
   [_ _ _]
   (let [scroll-height (reagent/atom negative-scroll-position-0)]
-    (fn [{:keys [name cover-image logo page-nav-right-section-buttons on-scroll
+    (fn [{:keys [name theme cover-image logo page-nav-right-section-buttons on-scroll
                  collapsed?
                  height top-nav title-colum background-color navigate-back?]}
          sticky-header
@@ -138,5 +138,5 @@
            {:style (style/children-container {:border-radius    (diff-with-max-min @scroll-height 16 0)
                                               :background-color background-color})}
            (when (and (not collapsed?) cover-image)
-             [:f> f-display-picture @scroll-height logo])
+             [:f> f-display-picture @scroll-height logo theme])
            children])]])))

src/status_im2/contexts/communities/actions/community_rules_list/view.cljs

@@ -32,13 +32,13 @@
   [rn/view {:style style/community-rule}
    [quo/text
     {:style  style/community-rule-index
-     :weight :medium
+     :weight :regular
      :size   :paragraph-2}
     (str index ". ")]
    [quo/text
     {:style               style/community-rule-text
      :accessibility-label :communities-rule-index
-     :weight              :medium
+     :weight              :regular
      :size                :paragraph-2}
     (str title ": " content)]])
 

src/status_im2/contexts/communities/actions/generic_menu/view.cljs

@@ -12,7 +12,7 @@
       [quo/text
        {:accessibility-label :communities-join-community
         :weight              :semi-bold
-        :size                :heading-1}
+        :size                :heading-2}
        title]]
      [rn/view {:style style/community-tag}
       [quo/context-tag

src/status_im2/contexts/communities/actions/request_to_join/view.cljs

@@ -2,19 +2,12 @@
   (:require [quo2.core :as quo]
             [react-native.core :as rn]
             [react-native.gesture :as gesture]
-            [reagent.core :as reagent]
             [status-im2.common.password-authentication.view :as password-authentication]
             [status-im2.contexts.communities.actions.community-rules-list.view :as community-rules]
             [status-im2.contexts.communities.actions.request-to-join.style :as style]
             [utils.i18n :as i18n]
             [utils.re-frame :as rf]))
 
-(defn request-to-join-text
-  [open?]
-  (if open?
-    (i18n/label :t/join-open-community)
-    (i18n/label :t/request-to-join)))
-
 (defn join-community-and-navigate-back
   [id]
   (rf/dispatch [:password-authentication/show
@@ -25,13 +18,10 @@
 
 (defn request-to-join
   []
-  (let [agreed-to-rules? (reagent/atom false)]
   (fn []
-      (let [{:keys [permissions
+    (let [{:keys [name
-                    name
                   id
-                    images]} (rf/sub [:get-screen-params])
+                  images]} (rf/sub [:get-screen-params])]
-            open?            (not= 3 (:access permissions))]
       [rn/view {:flex 1}
        [gesture/scroll-view {:style {:flex 1}}
         [rn/view style/page-container
@@ -39,8 +29,8 @@
           [quo/text
            {:accessibility-label :communities-join-community
             :weight              :semi-bold
-              :size                :heading-1}
+            :size                :heading-2}
-             (request-to-join-text open?)]]
+           (i18n/label :t/request-to-join)]]
          [rn/view {:style {:margin-right :auto :margin-top 8}}
           [quo/context-tag
            {:type           :community
@@ -54,12 +44,6 @@
            :size                :paragraph-1}
           (i18n/label :t/community-rules)]
          [community-rules/view community-rules/standard-rules]
-           [quo/disclaimer
-            {:accessibility-label :rules-disclaimer-checkbox
-             :container-style     {:margin-top 20}
-             :on-change           #(swap! agreed-to-rules? not)
-             :checked?            @agreed-to-rules?}
-            (i18n/label :t/accept-community-rules)]
          [rn/view {:style (style/bottom-container)}
           [quo/button
            {:accessibility-label :cancel
@@ -70,11 +54,10 @@
           [quo/button
            {:accessibility-label :join-community-button
             :on-press            #(join-community-and-navigate-back id)
-              :disabled?           (not @agreed-to-rules?)
             :container-style     {:flex 1}}
-             (request-to-join-text open?)]]
+           (i18n/label :t/request-to-join)]]
          [rn/view {:style style/final-disclaimer-container}
           [quo/text
            {:size  :paragraph-2
             :style style/final-disclaimer-text}
-             (i18n/label :t/request-to-join-disclaimer)]]]]]))))
+           (i18n/label :t/request-to-join-disclaimer)]]]]])))

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

@@ -2,6 +2,7 @@
   (:require [utils.i18n :as i18n]
             [oops.core :as oops]
             [quo2.core :as quo]
+            [quo2.theme :as quo.theme]
             [quo2.foundations.colors :as colors]
             [react-native.core :as rn]
             [reagent.core :as reagent]
@@ -198,7 +199,7 @@
        [discover-communities-segments selected-tab true]])))
 
 (defn discover-screen-content
-  [featured-communities]
+  [featured-communities theme]
   (let [view-type                  (reagent/atom :card-view)
         selected-tab               (reagent/atom :all)
         scroll-height              (reagent/atom 0)
@@ -206,6 +207,7 @@
     (fn []
       [scroll-page/scroll-page
        {:name             (i18n/label :t/discover-communities)
+        :theme            theme
         :on-scroll        #(reset! scroll-height %)
         :background-color (colors/theme-colors
                            colors/white
@@ -223,14 +225,18 @@
         featured-communities
         @view-type]])))
 
-(defn discover
+(defn f-view-internal
-  []
+  [{:keys [theme]}]
-  (rf/dispatch [:fetch-contract-communities])
+  (let [featured-communities (rf/sub [:communities/featured-contract-communities])]
-  (fn []
-    (let [featured-communities (rf/sub
-                                [:communities/featured-contract-communities])]
     [rn/view
      {:style (style/discover-screen-container (colors/theme-colors
                                                colors/white
                                                colors/neutral-95))}
-       [discover-screen-content featured-communities]])))
+     [discover-screen-content featured-communities theme]]))
+
+
+(defn- internal-discover-view
+  [params]
+  [:f> f-view-internal params])
+
+(def view (quo.theme/with-theme internal-discover-view))

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

@@ -99,12 +99,6 @@
                (map #(channel-chat-item community-id community-color %))
                chats))]))])
 
-(defn request-to-join-text
-  [is-open?]
-  (if is-open?
-    (i18n/label :t/join-open-community)
-    (i18n/label :t/request-to-join-community)))
-
 (defn get-access-type
   [access]
   (case access
@@ -173,13 +167,11 @@
         (i18n/label :t/join-open-community)]])))
 
 (defn join-community
-  [{:keys [joined can-join? color permissions token-permissions] :as community}
+  [{:keys [joined color permissions token-permissions] :as community}
    pending?]
   (let [access-type     (get-access-type (:access permissions))
         unknown-access? (= access-type :unknown-access)
-        invite-only?    (= access-type :invite-only)
+        invite-only?    (= access-type :invite-only)]
-        is-open?        (= access-type :open)
-        node-offline?   (and can-join? (not joined) pending?)]
     [:<>
      (when-not (or joined pending? invite-only? unknown-access?)
        (if (seq token-permissions)
@@ -189,20 +181,14 @@
            :accessibility-label :show-request-to-join-screen-button
            :customization-color color
            :icon-left           :i/communities}
-          (request-to-join-text is-open?)]))
+          (i18n/label :t/request-to-join-community)]))
 
-     (when (and (not (or joined pending? token-permissions)) (not (or is-open? node-offline?)))
+     (when (not (or joined pending? token-permissions))
        [quo/text
         {:size   :paragraph-2
+         :weight :regular
          :style  style/review-notice}
-        (i18n/label :t/community-admins-will-review-your-request)])
+        (i18n/label :t/community-admins-will-review-your-request)])]))
-
-     (when node-offline?
-       [quo/information-box
-        {:type  :informative
-         :icon  :i/info
-         :style {:margin-top 12}}
-        (i18n/label :t/request-processed-after-node-online)])]))
 
 (defn status-tag
   [pending? joined]

src/status_im2/navigation/screens.cljs

@@ -102,7 +102,7 @@
      :component find-sync-code/view}
 
     {:name      :discover-communities
-     :component communities.discover/discover}
+     :component communities.discover/view}
 
     {:name      :community-overview
      :component communities.overview/overview}

translations/en.json

@@ -1209,7 +1209,7 @@
     "request-processed-after-node-online": "Community control node is offline. Request will be processed once it's back online.",
     "request-to-join-disclaimer": "Joining the community will reveal your public addresses to the owner",
     "request-to-join": "Request to join",
-    "request-to-join-community": "Request to join Community",
+    "request-to-join-community": "Request to join community",
     "requested-to-join-community": "You requested to join “{{community}}”",
     "request-transaction": "Request transaction",
     "required-field": "Required field",