parent
972e1eee01
commit
2d92b515b8
|
@ -16,6 +16,7 @@
|
||||||
[utils.re-frame :as rf]))
|
[utils.re-frame :as rf]))
|
||||||
|
|
||||||
(defn send-message
|
(defn send-message
|
||||||
|
"Minimize composer, animate-out background overlay, clear input and flush state"
|
||||||
[{:keys [sending-images? sending-links?]}
|
[{:keys [sending-images? sending-links?]}
|
||||||
{:keys [text-value focused? maximized?]}
|
{:keys [text-value focused? maximized?]}
|
||||||
{:keys [height saved-height last-height opacity background-y container-opacity]}
|
{:keys [height saved-height last-height opacity background-y container-opacity]}
|
||||||
|
@ -47,6 +48,7 @@
|
||||||
(let [{:keys [text-value]} state
|
(let [{:keys [text-value]} state
|
||||||
customization-color (rf/sub [:profile/customization-color])]
|
customization-color (rf/sub [:profile/customization-color])]
|
||||||
(rn/use-effect (fn []
|
(rn/use-effect (fn []
|
||||||
|
;; Handle send button opacity animation and z-index when input content changes
|
||||||
(if (or (seq @text-value) images?)
|
(if (or (seq @text-value) images?)
|
||||||
(when (or (not= @z-index 1) (not= (reanimated/get-shared-value btn-opacity) 1))
|
(when (or (not= @z-index 1) (not= (reanimated/get-shared-value btn-opacity) 1))
|
||||||
(reset! z-index 1)
|
(reset! z-index 1)
|
||||||
|
|
|
@ -14,6 +14,7 @@
|
||||||
[utils.re-frame :as rf]))
|
[utils.re-frame :as rf]))
|
||||||
|
|
||||||
(defn focus
|
(defn focus
|
||||||
|
"Animate to the `saved-height`, display background-overlay if needed, and set cursor position"
|
||||||
[{:keys [input-ref] :as props}
|
[{:keys [input-ref] :as props}
|
||||||
{:keys [text-value focused? lock-selection? saved-cursor-position]}
|
{:keys [text-value focused? lock-selection? saved-cursor-position]}
|
||||||
{:keys [height saved-height last-height opacity background-y container-opacity]
|
{:keys [height saved-height last-height opacity background-y container-opacity]
|
||||||
|
@ -36,6 +37,7 @@
|
||||||
(reset! show-floating-scroll-down-button? false))
|
(reset! show-floating-scroll-down-button? false))
|
||||||
|
|
||||||
(defn blur
|
(defn blur
|
||||||
|
"Save the current height, minimize the composer, animate-out the background, and save cursor position"
|
||||||
[{:keys [text-value focused? lock-selection? cursor-position saved-cursor-position gradient-z-index
|
[{:keys [text-value focused? lock-selection? cursor-position saved-cursor-position gradient-z-index
|
||||||
maximized? recording?]}
|
maximized? recording?]}
|
||||||
{:keys [height saved-height last-height gradient-opacity container-opacity opacity background-y]}
|
{:keys [height saved-height last-height gradient-opacity container-opacity opacity background-y]}
|
||||||
|
@ -67,6 +69,7 @@
|
||||||
(rf/dispatch [:chat.ui/set-input-maximized false])))))
|
(rf/dispatch [:chat.ui/set-input-maximized false])))))
|
||||||
|
|
||||||
(defn content-size-change
|
(defn content-size-change
|
||||||
|
"Save new text height, expand composer if possible, show background overlay if needed"
|
||||||
[event
|
[event
|
||||||
{:keys [maximized? lock-layout? text-value]}
|
{:keys [maximized? lock-layout? text-value]}
|
||||||
{:keys [height saved-height opacity background-y]}
|
{:keys [height saved-height opacity background-y]}
|
||||||
|
@ -101,6 +104,7 @@
|
||||||
(reset! lock-layout? (> lines 2)))))
|
(reset! lock-layout? (> lines 2)))))
|
||||||
|
|
||||||
(defn scroll
|
(defn scroll
|
||||||
|
"Hide or show top gradient while scroll"
|
||||||
[event
|
[event
|
||||||
{:keys [scroll-y]}
|
{:keys [scroll-y]}
|
||||||
{:keys [gradient-z-index focused?]}
|
{:keys [gradient-z-index focused?]}
|
||||||
|
@ -116,12 +120,10 @@
|
||||||
(js/setTimeout #(reset! gradient-z-index 0) 300))))
|
(js/setTimeout #(reset! gradient-z-index 0) 300))))
|
||||||
|
|
||||||
(defn change-text
|
(defn change-text
|
||||||
|
"Update `text-value`, update cursor selection, find links, find mentions"
|
||||||
[text
|
[text
|
||||||
{:keys [input-ref record-reset-fn]}
|
{:keys [input-ref record-reset-fn]}
|
||||||
{:keys [text-value cursor-position recording?]}]
|
{:keys [text-value cursor-position recording?]}]
|
||||||
(debounce/debounce-and-dispatch [:link-preview/unfurl-urls text]
|
|
||||||
constants/unfurl-debounce-ms)
|
|
||||||
|
|
||||||
(reset! text-value text)
|
(reset! text-value text)
|
||||||
(reagent/next-tick #(when @input-ref
|
(reagent/next-tick #(when @input-ref
|
||||||
(.setNativeProps ^js @input-ref
|
(.setNativeProps ^js @input-ref
|
||||||
|
@ -131,11 +133,14 @@
|
||||||
(@record-reset-fn)
|
(@record-reset-fn)
|
||||||
(reset! recording? false))
|
(reset! recording? false))
|
||||||
(rf/dispatch [:chat.ui/set-chat-input-text text])
|
(rf/dispatch [:chat.ui/set-chat-input-text text])
|
||||||
|
(debounce/debounce-and-dispatch [:link-preview/unfurl-urls text]
|
||||||
|
constants/unfurl-debounce-ms)
|
||||||
(if (string/ends-with? text "@")
|
(if (string/ends-with? text "@")
|
||||||
(rf/dispatch [:mention/on-change-text text])
|
(rf/dispatch [:mention/on-change-text text])
|
||||||
(debounce/debounce-and-dispatch [:mention/on-change-text text] 300)))
|
(debounce/debounce-and-dispatch [:mention/on-change-text text] 300)))
|
||||||
|
|
||||||
(defn selection-change
|
(defn selection-change
|
||||||
|
"A method that handles our custom selector for `B I U`"
|
||||||
[event
|
[event
|
||||||
{:keys [input-ref selection-event selection-manager]}
|
{:keys [input-ref selection-event selection-manager]}
|
||||||
{:keys [lock-selection? cursor-position first-level? menu-items]}]
|
{:keys [lock-selection? cursor-position first-level? menu-items]}]
|
||||||
|
|
|
@ -20,6 +20,7 @@
|
||||||
(async-storage/set-item! :kb-default-height (str height)))))
|
(async-storage/set-item! :kb-default-height (str height)))))
|
||||||
|
|
||||||
(defn handle-emoji-kb-ios
|
(defn handle-emoji-kb-ios
|
||||||
|
"Opening emoji KB on iOS while maximized will cause a flicker up and down. This method handles that."
|
||||||
[event
|
[event
|
||||||
{:keys [emoji-kb-extra-height]}
|
{:keys [emoji-kb-extra-height]}
|
||||||
{:keys [text-value]}
|
{:keys [text-value]}
|
||||||
|
|
|
@ -144,7 +144,7 @@
|
||||||
(+ base bottom-content-height))
|
(+ base bottom-content-height))
|
||||||
(+ constants/actions-container-height (:bottom insets) (- curr-height cursor-pos) 18)))))
|
(+ constants/actions-container-height (:bottom insets) (- curr-height cursor-pos) 18)))))
|
||||||
|
|
||||||
(defn init-props
|
(defn init-non-reactive-state
|
||||||
[]
|
[]
|
||||||
{:input-ref (atom nil)
|
{:input-ref (atom nil)
|
||||||
:selectable-input-ref (atom nil)
|
:selectable-input-ref (atom nil)
|
||||||
|
@ -160,7 +160,7 @@
|
||||||
:selection-event (atom nil)
|
:selection-event (atom nil)
|
||||||
:selection-manager (rn/selectable-text-input-manager)})
|
:selection-manager (rn/selectable-text-input-manager)})
|
||||||
|
|
||||||
(defn init-state
|
(defn init-reactive-state
|
||||||
[]
|
[]
|
||||||
{:text-value (reagent/atom "")
|
{:text-value (reagent/atom "")
|
||||||
:cursor-position (reagent/atom 0)
|
:cursor-position (reagent/atom 0)
|
||||||
|
|
|
@ -36,15 +36,19 @@
|
||||||
theme]} props state]
|
theme]} props state]
|
||||||
(let [{:keys [chat-screen-loaded?]
|
(let [{:keys [chat-screen-loaded?]
|
||||||
:as subscriptions} (utils/init-subs)
|
:as subscriptions} (utils/init-subs)
|
||||||
content-height (reagent/atom (or (:input-content-height
|
content-height (reagent/atom (or (:input-content-height ; Actual text height
|
||||||
subscriptions)
|
subscriptions)
|
||||||
constants/input-height))
|
constants/input-height))
|
||||||
{:keys [keyboard-shown]} (hooks/use-keyboard)
|
{:keys [keyboard-shown]} (hooks/use-keyboard)
|
||||||
max-height (utils/calc-max-height subscriptions
|
max-height (utils/calc-max-height subscriptions ; Max allowed height for the
|
||||||
|
; composer view
|
||||||
window-height
|
window-height
|
||||||
@(:kb-height state)
|
@(:kb-height state)
|
||||||
insets)
|
insets)
|
||||||
lines (utils/calc-lines (- @content-height constants/extra-content-offset))
|
lines (utils/calc-lines (- @content-height constants/extra-content-offset)) ; Current
|
||||||
|
; lines
|
||||||
|
; count
|
||||||
|
;; Maximum number of lines that can be displayed when composer in maximized
|
||||||
max-lines (utils/calc-lines max-height)
|
max-lines (utils/calc-lines max-height)
|
||||||
animations (utils/init-animations
|
animations (utils/init-animations
|
||||||
subscriptions
|
subscriptions
|
||||||
|
@ -59,6 +63,7 @@
|
||||||
:lines lines
|
:lines lines
|
||||||
:max-lines max-lines}
|
:max-lines max-lines}
|
||||||
show-bottom-gradient? (utils/show-bottom-gradient? state dimensions)
|
show-bottom-gradient? (utils/show-bottom-gradient? state dimensions)
|
||||||
|
;; Cursor position, needed to determine where to display the mentions view
|
||||||
cursor-pos (utils/cursor-y-position-relative-to-container
|
cursor-pos (utils/cursor-y-position-relative-to-container
|
||||||
props
|
props
|
||||||
state)]
|
state)]
|
||||||
|
@ -146,7 +151,7 @@
|
||||||
(let [window-height (:height (rn/get-window))
|
(let [window-height (:height (rn/get-window))
|
||||||
theme (quo.theme/use-theme-value)
|
theme (quo.theme/use-theme-value)
|
||||||
opacity (reanimated/use-shared-value 0)
|
opacity (reanimated/use-shared-value 0)
|
||||||
background-y (reanimated/use-shared-value (- window-height))
|
background-y (reanimated/use-shared-value (- window-height)) ; Y position of background overlay
|
||||||
blur-height (reanimated/use-shared-value (+ constants/composer-default-height
|
blur-height (reanimated/use-shared-value (+ constants/composer-default-height
|
||||||
(:bottom insets)))
|
(:bottom insets)))
|
||||||
extra-params {:insets insets
|
extra-params {:insets insets
|
||||||
|
@ -157,10 +162,11 @@
|
||||||
:opacity opacity
|
:opacity opacity
|
||||||
:background-y background-y
|
:background-y background-y
|
||||||
:theme theme}
|
:theme theme}
|
||||||
props (utils/init-props)
|
props (utils/init-non-reactive-state)
|
||||||
state (utils/init-state)]
|
state (utils/init-reactive-state)]
|
||||||
[rn/view (when platform/ios? {:style {:z-index 1}})
|
[rn/view (when platform/ios? {:style {:z-index 1}})
|
||||||
[reanimated/view {:style (style/background opacity background-y window-height)}]
|
[reanimated/view {:style (style/background opacity background-y window-height)}] ; background
|
||||||
|
; overlay
|
||||||
[sub-view/blur-view
|
[sub-view/blur-view
|
||||||
{:layout-height blur-height
|
{:layout-height blur-height
|
||||||
:focused? (:focused? state)
|
:focused? (:focused? state)
|
||||||
|
|
|
@ -57,10 +57,10 @@
|
||||||
(defn view
|
(defn view
|
||||||
[]
|
[]
|
||||||
(rf/dispatch [:wallet/get-wallet-token])
|
(rf/dispatch [:wallet/get-wallet-token])
|
||||||
|
(let [selected-tab (reagent/atom (:id (first tabs-data)))]
|
||||||
(fn []
|
(fn []
|
||||||
(let [accounts (rf/sub [:profile/wallet-accounts])
|
(let [accounts (rf/sub [:profile/wallet-accounts])
|
||||||
top (safe-area/get-top)
|
top (safe-area/get-top)
|
||||||
selected-tab (reagent/atom (:id (first tabs-data)))
|
|
||||||
loading? (rf/sub [:wallet/tokens-loading?])
|
loading? (rf/sub [:wallet/tokens-loading?])
|
||||||
balances (rf/sub [:wallet/balances])
|
balances (rf/sub [:wallet/balances])
|
||||||
profile (rf/sub [:profile/profile])
|
profile (rf/sub [:profile/profile])
|
||||||
|
@ -72,7 +72,8 @@
|
||||||
[rn/view {:style style/overview-container}
|
[rn/view {:style style/overview-container}
|
||||||
[quo/wallet-overview (temp/wallet-overview-state networks)]]
|
[quo/wallet-overview (temp/wallet-overview-state networks)]]
|
||||||
[rn/pressable
|
[rn/pressable
|
||||||
{:on-long-press #(rf/dispatch [:show-bottom-sheet {:content temp/wallet-temporary-navigation}])}
|
{:on-long-press #(rf/dispatch [:show-bottom-sheet
|
||||||
|
{:content temp/wallet-temporary-navigation}])}
|
||||||
[quo/wallet-graph {:time-frame :empty}]]
|
[quo/wallet-graph {:time-frame :empty}]]
|
||||||
[rn/flat-list
|
[rn/flat-list
|
||||||
{:style style/accounts-list
|
{:style style/accounts-list
|
||||||
|
@ -96,4 +97,4 @@
|
||||||
:key :assets-list
|
:key :assets-list
|
||||||
:content-container-style {:padding-horizontal 8}}]
|
:content-container-style {:padding-horizontal 8}}]
|
||||||
:collectibles [collectibles/view]
|
:collectibles [collectibles/view]
|
||||||
[activity/view])])))
|
[activity/view])]))))
|
||||||
|
|
Loading…
Reference in New Issue