status-im
/
status-react
mirror of https://github.com/status-im/status-react.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Fix: slide button (#18922) 

* fix: slide button
This commit is contained in:
Omar Basem 2024-03-05 07:50:03 +04:00 committed by GitHub
parent 5d1e1f8005
commit 62f68ff44b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 23 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
src/quo/components/buttons/slide_button/view.cljs
View File

@ -14,28 +14,26 @@
[react-native.reanimated :as reanimated])) [react-native.reanimated :as reanimated]))
(defn drag-gesture (defn drag-gesture
[x-pos gestures-disabled? set-gestures-disabled disabled? track-width sliding-complete? [x-pos disabled? track-width sliding-complete?
set-sliding-complete set-sliding-complete
on-complete reset-fn] on-complete reset-fn]
(let [gestures-enabled? (not (or disabled? gestures-disabled?))] (-> (gesture/gesture-pan)
(-> (gesture/gesture-pan) (gesture/with-test-ID :slide-button-gestures)
(gesture/with-test-ID :slide-button-gestures) (gesture/enabled (not disabled?))
(gesture/enabled gestures-enabled?) (gesture/min-distance 0)
(gesture/min-distance 0) (gesture/on-update (fn [event]
(gesture/on-update (fn [event] (let [x-translation (oops/oget event "translationX")
(let [x-translation (oops/oget event "translationX") clamped-x (utils/clamp-value x-translation 0 track-width)
clamped-x (utils/clamp-value x-translation 0 track-width) reached-end? (>= clamped-x track-width)]
reached-end? (>= clamped-x track-width)] (reanimated/set-shared-value x-pos clamped-x)
(reanimated/set-shared-value x-pos clamped-x) (when (and reached-end? (not sliding-complete?))
(when (and reached-end? (not sliding-complete?)) (set-sliding-complete true)
(set-gestures-disabled true) (when on-complete (on-complete reset-fn))))))
(set-sliding-complete true) (gesture/on-end (fn [event]
(when on-complete (on-complete reset-fn)))))) (let [x-translation (oops/oget event "translationX")
(gesture/on-end (fn [event] reached-end? (>= x-translation track-width)]
(let [x-translation (oops/oget event "translationX") (when (not reached-end?)
reached-end? (>= x-translation track-width)] (animations/reset-track-position x-pos)))))))
(when (not reached-end?)
(animations/reset-track-position x-pos))))))))
(defn view (defn view
"Options "Options
@ -55,14 +53,11 @@
[track-width set-track-width] (rn/use-state nil) [track-width set-track-width] (rn/use-state nil)
[sliding-complete? [sliding-complete?
set-sliding-complete] (rn/use-state false) set-sliding-complete] (rn/use-state false)
[gestures-disabled?
set-gestures-disabled] (rn/use-state disabled?)
on-track-layout (rn/use-callback on-track-layout (rn/use-callback
#(set-track-width (oops/oget % "nativeEvent.layout.width"))) #(set-track-width (oops/oget % "nativeEvent.layout.width")))
reset-fn (rn/use-callback reset-fn (rn/use-callback
(fn [] (fn []
(set-sliding-complete false) (set-sliding-complete false)
(set-gestures-disabled false)
(animations/reset-track-position x-pos))) (animations/reset-track-position x-pos)))
dimensions (rn/use-callback dimensions (rn/use-callback
(partial utils/get-dimensions (partial utils/get-dimensions
@ -77,15 +72,13 @@
[dimensions]) [dimensions])
custom-color (if (= type :danger) :danger customization-color) custom-color (if (= type :danger) :danger customization-color)
gesture (rn/use-memo #(drag-gesture x-pos gesture (rn/use-memo #(drag-gesture x-pos
gestures-disabled?
set-gestures-disabled
disabled? disabled?
(dimensions :usable-track) (dimensions :usable-track)
sliding-complete? sliding-complete?
set-sliding-complete set-sliding-complete
on-complete on-complete
reset-fn) reset-fn)
[gestures-disabled? sliding-complete? disabled?])] [sliding-complete? disabled?])]
[gesture/gesture-detector [gesture/gesture-detector
{:gesture gesture} {:gesture gesture}
[reanimated/view [reanimated/view

5
src/status_im/common/standard_authentication/standard_auth/slide_button/view.cljs
View File

@ -9,7 +9,7 @@
(defn view (defn view
[{:keys [track-text customization-color auth-button-label on-auth-success on-auth-fail [{:keys [track-text customization-color auth-button-label on-auth-success on-auth-fail
auth-button-icon-left size blur? container-style] auth-button-icon-left size blur? container-style disabled?]
:or {container-style {:flex 1}}}] :or {container-style {:flex 1}}}]
(let [theme (quo.theme/use-theme-value) (let [theme (quo.theme/use-theme-value)
auth-method (rf/sub [:auth-method]) auth-method (rf/sub [:auth-method])
@ -31,4 +31,5 @@
:customization-color customization-color :customization-color customization-color
:on-complete on-complete :on-complete on-complete
:track-icon (if biometric-auth? :i/face-id :password) :track-icon (if biometric-auth? :i/face-id :password)
:track-text track-text}])) :track-text track-text
:disabled? disabled?}]))

4
src/status_im/contexts/wallet/create_account/view.cljs
View File

@ -148,9 +148,7 @@
:path @derivation-path :path @derivation-path
:account-name @account-name}]))) :account-name @account-name}])))
:auth-button-label (i18n/label :t/confirm) :auth-button-label (i18n/label :t/confirm)
;; TODO (@rende11) Add this property when sliding button issue will fixed :disabled? (empty? @account-name)
;; https://github.com/status-im/status-mobile/pull/18683#issuecomment-1941564785
;; :disabled? (empty? @account-name)
:container-style (style/slide-button-container bottom)}]])))) :container-style (style/slide-button-container bottom)}]]))))
(defn- view-internal (defn- view-internal