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 rendering blink

This commit is contained in:
Ulises M 2024-11-19 15:04:31 -06:00
parent 2114cf5574
commit 0173e9ce8e
No known key found for this signature in database
GPG Key ID: 5A15782EB758534E
2 changed files with 42 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
src/status_im/contexts/chat/messenger/composer/mentions/style.cljs
View File

@ -2,29 +2,38 @@
(:require
[quo.foundations.colors :as colors]
[react-native.platform :as platform]
[react-native.reanimated :as reanimated]
[status-im.contexts.chat.messenger.composer.constants :as constants]))
(defn shadow
[theme]
(if platform/ios?
{:shadow-radius (colors/theme-colors 30 50 theme)
:shadow-opacity (colors/theme-colors 0.1 0.7 theme)
:shadow-color colors/neutral-100
:shadow-offset {:width 0 :height (colors/theme-colors 8 12 theme)}}
{:elevation 10}))
(defn- add-shadow
[theme styles]
(cond-> styles
platform/ios? (assoc :shadow-radius (colors/theme-colors 30 50 theme)
:shadow-opacity (colors/theme-colors 0.1 0.7 theme)
:shadow-color colors/neutral-100
:shadow-offset {:width 0 :height (colors/theme-colors 8 12 theme)})
:else (assoc :elevation 10)))
(defn inner
[top theme]
(add-shadow theme
{:position :absolute
:top (- (+ 8 top))
:left 8
:right 8
:border-radius 16
:z-index 4
:max-height constants/mentions-max-height
:background-color (colors/theme-colors colors/white colors/neutral-95 theme)}))
(defn container
[opacity top theme]
(reanimated/apply-animations-to-style
{:opacity opacity}
(merge
{:position :absolute
:top (- (+ 8 top))
:left 8
:right 8
:border-radius 16
:z-index 4
:max-height constants/mentions-max-height
:background-color (colors/theme-colors colors/white colors/neutral-95 theme)}
(shadow theme))))
[{:opacity opacity}
(add-shadow theme
{:position :absolute
:top (- (+ 8 top))
:left 8
:right 8
:border-radius 16
:z-index 4
:max-height constants/mentions-max-height
:background-color (colors/theme-colors colors/white colors/neutral-95 theme)})])

25
src/status_im/contexts/chat/messenger/composer/mentions/view.cljs
View File

@ -1,14 +1,14 @@
(ns status-im.contexts.chat.messenger.composer.mentions.view
(:require
[quo.theme]
[react-native.core :as rn]
[react-native.reanimated :as reanimated]
[react-native.safe-area :as safe-area]
[status-im.common.contact-list-item.view :as contact-list-item]
[status-im.contexts.chat.messenger.composer.constants :as constants]
[status-im.contexts.chat.messenger.composer.mentions.style :as style]
[status-im.contexts.chat.messenger.messages.constants :as messages.constants]
[utils.re-frame :as rf]))
[quo.theme]
[react-native.core :as rn]
[react-native.reanimated :as reanimated]
[react-native.safe-area :as safe-area]
[status-im.common.contact-list-item.view :as contact-list-item]
[status-im.contexts.chat.messenger.composer.constants :as constants]
[status-im.contexts.chat.messenger.composer.mentions.style :as style]
[status-im.contexts.chat.messenger.messages.constants :as messages.constants]
[utils.re-frame :as rf]))
(defn mention-item
[user]
@ -35,10 +35,9 @@
(set-suggestions-state suggestions)
(js/setTimeout #(set-suggestions-state suggestions) 300))
(reanimated/animate opacity (if suggestions? 1 0)))
[suggestions?])
[reanimated/view
{:style (style/container opacity top theme)}
[rn/flat-list
[suggestions])
[reanimated/view {:style (style/container opacity top theme)}
[reanimated/flat-list
{:keyboard-should-persist-taps :always
:data (vals suggestions-state)
:key-fn :key