Fix for "Jump to" button overlapping Logout button on the Profile screen (#19318)

* Fix for "Jump to" button overlapping Logout button on the Profile screen

* Fix for offsets

* Code style

* Fixes
This commit is contained in:
Alexander 2024-03-21 15:05:49 +01:00 committed by GitHub
parent 1e37765197
commit 51541f7f0a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 24 additions and 12 deletions

View File

@ -1,13 +1,27 @@
(ns status-im.contexts.profile.settings.style (ns status-im.contexts.profile.settings.style
(:require [quo.foundations.colors :as colors])) (:require [quo.foundations.colors :as colors]
[react-native.platform :as platform]
[status-im.contexts.shell.jump-to.constants :as jump-to.constants]))
(defn navigation-wrapper (defn navigation-wrapper
[{:keys [customization-color inset theme]}] [{:keys [customization-color inset theme]}]
{:padding-top inset {:padding-top inset
:background-color (colors/resolve-color customization-color theme 40)}) :background-color (colors/resolve-color customization-color theme 40)})
(def footer-container (def ^:const footer-padding 20)
{:margin-top 8 (def ^:const ios-bottom-offset -10)
:margin-bottom 50
:padding-horizontal 20 (defn footer-container
:padding-vertical 12}) [bottom]
{:padding-horizontal footer-padding
:padding-top footer-padding
:padding-bottom (+ jump-to.constants/floating-shell-button-height
footer-padding
(if platform/ios? ios-bottom-offset bottom))})
(defn floating-shell-button-style
[{:keys [bottom]}]
{:position :absolute
:bottom (if platform/ios?
(+ bottom ios-bottom-offset)
0)})

View File

@ -9,7 +9,6 @@
[status-im.contexts.profile.settings.header.view :as settings.header] [status-im.contexts.profile.settings.header.view :as settings.header]
[status-im.contexts.profile.settings.list-items :as settings.items] [status-im.contexts.profile.settings.list-items :as settings.items]
[status-im.contexts.profile.settings.style :as style] [status-im.contexts.profile.settings.style :as style]
[status-im.contexts.shell.jump-to.constants :as jump-to.constants]
[utils.debounce :as debounce] [utils.debounce :as debounce]
[utils.i18n :as i18n] [utils.i18n :as i18n]
[utils.re-frame :as rf])) [utils.re-frame :as rf]))
@ -29,9 +28,9 @@
(reanimated/set-shared-value scroll-y current-y))) (reanimated/set-shared-value scroll-y current-y)))
(defn- footer (defn- footer
[logout-press] [{:keys [bottom]} logout-press]
[rf/delay-render [rf/delay-render
[rn/view {:style style/footer-container} [rn/view {:style (style/footer-container bottom)}
[quo/logout-button {:on-press logout-press}]]]) [quo/logout-button {:on-press logout-press}]]])
(defn- get-item-layout (defn- get-item-layout
@ -65,7 +64,7 @@
:shows-vertical-scroll-indicator false :shows-vertical-scroll-indicator false
:render-fn settings-item-view :render-fn settings-item-view
:get-item-layout get-item-layout :get-item-layout get-item-layout
:footer [footer logout-press] :footer [footer insets logout-press]
:scroll-event-throttle 16 :scroll-event-throttle 16
:on-scroll #(scroll-handler % scroll-y) :on-scroll #(scroll-handler % scroll-y)
:bounces false}] :bounces false}]
@ -77,8 +76,7 @@
(debounce/throttle-and-dispatch [:shell/navigate-to-jump-to] 500)) (debounce/throttle-and-dispatch [:shell/navigate-to-jump-to] 500))
:customization-color customization-color :customization-color customization-color
:label (i18n/label :t/jump-to)}} :label (i18n/label :t/jump-to)}}
{:position :absolute (style/floating-shell-button-style insets)]]))
:bottom jump-to.constants/floating-shell-button-height}]]))
(defn- internal-view (defn- internal-view
[props] [props]