The [Cancel] and [Join] buttons are hidden within 'Join Community' overlay (#14971)

* The [Cancel] and [Join] buttons are hidden within 'Join Community' overlay

* Lint

* Fixes

* Lint fix
This commit is contained in:
Alexander 2023-02-10 13:59:36 +01:00 committed by GitHub
parent d1514ec52d
commit c12cab27f4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 98 additions and 84 deletions

View File

@ -3,8 +3,7 @@
(defn container
[]
{:flex 1
:flex-direction :row
{:flex-direction :row
:background-color (colors/theme-colors colors/neutral-5 colors/neutral-80-opa-40)
:padding 11
:align-self :stretch

View File

@ -31,13 +31,13 @@
:overflow :hidden})
(defn content-style
[insets]
[insets bottom-safe-area-spacing?]
{:position :absolute
:left 0
:right 0
:top 0
:padding-top border-radius
:padding-bottom (:bottom insets)})
:padding-bottom (if bottom-safe-area-spacing? (:bottom insets) 0)})
(defn selected-background
[]

View File

@ -81,23 +81,25 @@
(defn bottom-sheet
[props children]
(let [{on-cancel :on-cancel
disable-drag? :disable-drag?
show-handle? :show-handle?
visible? :visible?
backdrop-dismiss? :backdrop-dismiss?
expandable? :expandable?
selected-item :selected-item
is-initially-expaned? :expanded?
:or {show-handle? true
backdrop-dismiss? true
expandable? false
is-initially-expaned? false}}
(let [{on-cancel :on-cancel
disable-drag? :disable-drag?
show-handle? :show-handle?
visible? :visible?
backdrop-dismiss? :backdrop-dismiss?
expandable? :expandable?
bottom-safe-area-spacing? :bottom-safe-area-spacing?
selected-item :selected-item
is-initially-expanded? :expanded?
:or {show-handle? true
backdrop-dismiss? true
expandable? false
bottom-safe-area-spacing? true
is-initially-expanded? false}}
props
content-height (reagent/atom nil)
show-bottom-sheet? (reagent/atom nil)
keyboard-was-shown? (reagent/atom false)
expanded? (reagent/atom is-initially-expaned?)
expanded? (reagent/atom is-initially-expanded?)
gesture-running? (reagent/atom false)
reset-atoms (fn []
(reset! show-bottom-sheet? nil)
@ -226,7 +228,7 @@
{:behaviour (if platform/ios? :padding :height)
:style {:flex 1}}
[rn/view
{:style (styles/content-style insets)
{:style (styles/content-style insets bottom-safe-area-spacing?)
:on-layout (when-not (and
(some? @content-height)
(> @content-height 0))

View File

@ -36,8 +36,7 @@
:margin-bottom 20})
(def title-container
{:flex 1
:flex-direction :row
{:flex-direction :row
:align-items :center
:justify-content :space-between})
@ -56,10 +55,10 @@
{:flex 1
:margin-right 12})
(def request-button
{:margin-top 32
:margin-bottom 16
:flex 1
(defn bottom-container
[safe-area-insets]
{:padding-top 32
:padding-bottom (:bottom safe-area-insets)
:flex-direction :row
:align-items :center
:justify-content :space-evenly})

View File

@ -1,9 +1,10 @@
(ns status-im2.contexts.communities.menus.request-to-join.view
(:require [quo.react-native :as rn]
[quo2.core :as quo]
(:require [react-native.core :as rn]
[react-native.safe-area :as safe-area]
[reagent.core :as reagent]
[utils.i18n :as i18n]
[status-im2.contexts.communities.menus.request-to-join.style :as style]
[quo2.core :as quo]
[utils.i18n :as i18n]
[utils.re-frame :as rf]
[utils.requests :as requests]))
@ -73,60 +74,72 @@
:render-fn community-rule-item}])
(defn request-to-join
[{:keys [permissions name id images
can-join? can-request-access?
[{:keys [permissions
name
id
images
can-join?
can-request-access?
requested-to-join-at]}]
(let [agreed-to-rules? (reagent/atom false)
is-open? (not= 3 (:access permissions))]
(fn []
[rn/scroll-view {:style style/page-container}
[rn/view
{:style style/title-container}
(let [agreed-to-rules? (reagent/atom false)]
[safe-area/consumer
(fn [insets]
[:f>
(fn []
(let [{window-height :height} (rn/use-window-dimensions)
is-open? (not= 3 (:access permissions))]
[rn/scroll-view {:style {:max-height (- window-height (:top insets))}}
[rn/view style/page-container
[rn/view
{:style style/title-container}
[quo/text
{:accessibility-label :communities-join-community
:weight :semi-bold
:size :heading-1}
(request-to-join-text is-open?)]
[rn/view
{:style style/request-icon}
[quo/icon :i/info]]]
[quo/context-tag
{:style
{:margin-right :auto
:margin-top 8}}
(:thumbnail images) name]
[quo/text
{:style {:margin-top 24}
:accessibility-label :communities-rules-title
:weight :semi-bold
:size :paragraph-1}
(i18n/label :t/community-rules)]
[community-rules-list community-rules]
[quo/text
{:accessibility-label :communities-join-community
:weight :semi-bold
:size :heading-1}
(request-to-join-text is-open?)]
[rn/view
{:style style/request-icon}
[quo/icon :i/info]]]
[quo/context-tag
{:style
{:margin-right :auto
:margin-top 8}}
(:thumbnail images) name]
[quo/text
{:style {:margin-top 24}
:accessibility-label :communities-rules-title
:weight :semi-bold
:size :paragraph-1}
(i18n/label :t/community-rules)]
[quo/disclaimer
{:accessibility-label :rules-disclaimer-checkbox
:container-style {:margin-top 20}
:on-change #(swap! agreed-to-rules? not)}
(i18n/label :t/accept-community-rules)]
[rn/view
{:style style/request-button}
[quo/button
{:accessibility-label :cancel
:on-press #(rf/dispatch [:bottom-sheet/hide])
:type :grey
:style style/cancel-button} (i18n/label :t/cancel)]
[quo/button
{:accessibility-label :join-community-button
:on-press (fn []
(if can-join?
(do
(rf/dispatch [:communities/join id])
(rf/dispatch [:bottom-sheet/hide]))
(do (and can-request-access?
(not (pos? requested-to-join-at))
(requests/can-request-access-again? requested-to-join-at))
(rf/dispatch [:communities/request-to-join id])
(rf/dispatch [:bottom-sheet/hide]))))
:disabled (not @agreed-to-rules?)
:style {:flex 1}} (request-to-join-text is-open?)]]])))
[community-rules-list community-rules]
[quo/disclaimer
{:accessibility-label :rules-disclaimer-checkbox
:container-style {:margin-top 20}
:on-change #(swap! agreed-to-rules? not)}
(i18n/label :t/accept-community-rules)]
[rn/view {:style (style/bottom-container insets)}
[quo/button
{:accessibility-label :cancel
:on-press #(rf/dispatch [:bottom-sheet/hide])
:type :grey
:style style/cancel-button} (i18n/label :t/cancel)]
[quo/button
{:accessibility-label :join-community-button
:on-press (fn []
(if can-join?
(do
(rf/dispatch [:communities/join id])
(rf/dispatch [:bottom-sheet/hide]))
(do (and can-request-access?
(not (pos? requested-to-join-at))
(requests/can-request-access-again?
requested-to-join-at))
(rf/dispatch [:communities/request-to-join id])
(rf/dispatch [:bottom-sheet/hide]))))
:disabled (not @agreed-to-rules?)
:style {:flex 1}} (request-to-join-text is-open?)]]]]))])]))

View File

@ -119,9 +119,10 @@
[quo/button
{:on-press #(rf/dispatch
[:bottom-sheet/show-sheet
{:content (fn [] [join-menu/request-to-join
community])
:content-height 300}])
{:content (fn [] [join-menu/request-to-join
community])
:bottom-safe-area-spacing? false
:content-height 300}])
:accessibility-label :show-request-to-join-screen-button
:override-background-color community-color
:style style/join-button