[#16066] bottom sheet height (#16285)

This commit is contained in:
Ulises Manuel Cárdenas 2023-06-19 07:22:45 -06:00 committed by GitHub
parent 2b465cb980
commit 428616332b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 33 additions and 27 deletions

View File

@ -26,15 +26,17 @@
:style {:color (colors/theme-colors colors/neutral-100
colors/white
(when shell? :dark))}
:weight :semi-bold} title]
:weight :semi-bold}
title]
[rn/view {:style style/content :accessibility-label :documentation-drawer-content}
content]
(when show-button?
[button/button
(merge {:size 24
(cond-> {:size 24
:type (if shell? :blur-bg-outline :outline)
:on-press on-press-button
:accessibility-label :documentation-drawer-button
:after button-icon}
(when shell? {:override-theme :dark})) button-label])]])
shell? (assoc :override-theme :dark))
button-label])]])

View File

@ -16,7 +16,8 @@
(defn sheet
[{:keys [top bottom]} window-height override-theme padding-bottom-override shell?]
{:position :absolute
:max-height (- window-height top 20)
:max-height (cond-> window-height
platform/ios? (- top))
:z-index 1
:bottom 0
:left 0

View File

@ -1,14 +1,14 @@
(ns status-im2.common.bottom-sheet.view
(:require [utils.re-frame :as rf]
[react-native.core :as rn]
(:require [oops.core :as oops]
[quo2.foundations.colors :as colors]
[react-native.reanimated :as reanimated]
[status-im2.common.bottom-sheet.style :as style]
[react-native.gesture :as gesture]
[oops.core :as oops]
[react-native.hooks :as hooks]
[react-native.blur :as blur]
[reagent.core :as reagent]))
[react-native.core :as rn]
[react-native.gesture :as gesture]
[react-native.hooks :as hooks]
[react-native.reanimated :as reanimated]
[reagent.core :as reagent]
[status-im2.common.bottom-sheet.style :as style]
[utils.re-frame :as rf]))
(def duration 450)
(def timing-options #js {:duration duration})
@ -62,9 +62,12 @@
translate-y (reanimated/use-shared-value window-height)
sheet-gesture (get-sheet-gesture translate-y bg-opacity window-height on-close)]
(rn/use-effect
#(if hide? (hide translate-y bg-opacity window-height on-close) (show translate-y bg-opacity))
#(if hide?
(hide translate-y bg-opacity window-height on-close)
(show translate-y bg-opacity))
[hide?])
(hooks/use-back-handler #(do (when (fn? on-close)
(hooks/use-back-handler (fn []
(when (fn? on-close)
(on-close))
(rf/dispatch [:hide-bottom-sheet])
true))
@ -86,8 +89,8 @@
padding-bottom-override
shell?))
:on-layout #(reset! sheet-height (oops/oget % "nativeEvent" "layout" "height"))}
(when shell? [blur/ios-view {:style style/shell-bg}])
(when shell?
[blur/ios-view {:style style/shell-bg}])
(when selected-item
[rn/view
[rn/view {:style (style/selected-item override-theme window-height @sheet-height insets)}

View File

@ -33,7 +33,9 @@
(defn show-new-account-options
[]
(rf/dispatch [:show-bottom-sheet {:content new-account-options}]))
(rf/dispatch [:show-bottom-sheet
{:content new-account-options
:shell? true}]))
(defn delete-profile-confirmation
[key-uid context]

View File

@ -82,9 +82,7 @@
{:style {:position :relative :flex 1}
:keyboard-vertical-offset (- (max 20 (:bottom insets)))}
(when sheet
[:f>
bottom-sheet/f-view
{:insets insets :hide? hide?}
[:f> bottom-sheet/f-view {:insets insets :hide? hide?}
sheet])]]))))
(def toasts (reagent/reactify-component toasts/toasts))