Fix join communities design review bugs
* fix: join communities design review bugs * updated design fixes
This commit is contained in:
parent
741e40094b
commit
7d1098b5b3
|
@ -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)})
|
||||
|
|
|
@ -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])]])))
|
||||
|
|
|
@ -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)]])
|
||||
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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
|
||||
name
|
||||
(let [{:keys [name
|
||||
id
|
||||
images]} (rf/sub [:get-screen-params])
|
||||
open? (not= 3 (:access permissions))]
|
||||
images]} (rf/sub [:get-screen-params])]
|
||||
[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}
|
||||
(request-to-join-text open?)]]
|
||||
:size :heading-2}
|
||||
(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)]]]]])))
|
||||
|
|
|
@ -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
|
||||
[]
|
||||
(rf/dispatch [:fetch-contract-communities])
|
||||
(fn []
|
||||
(let [featured-communities (rf/sub
|
||||
[:communities/featured-contract-communities])]
|
||||
(defn f-view-internal
|
||||
[{:keys [theme]}]
|
||||
(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))
|
||||
|
|
|
@ -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)
|
||||
is-open? (= access-type :open)
|
||||
node-offline? (and can-join? (not joined) pending?)]
|
||||
invite-only? (= access-type :invite-only)]
|
||||
[:<>
|
||||
(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)])
|
||||
|
||||
(when node-offline?
|
||||
[quo/information-box
|
||||
{:type :informative
|
||||
:icon :i/info
|
||||
:style {:margin-top 12}}
|
||||
(i18n/label :t/request-processed-after-node-online)])]))
|
||||
(i18n/label :t/community-admins-will-review-your-request)])]))
|
||||
|
||||
(defn status-tag
|
||||
[pending? joined]
|
||||
|
|
|
@ -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}
|
||||
|
|
|
@ -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",
|
||||
|
|
Loading…
Reference in New Issue