Unable to enter/clear smoothly the data into contacts field #19384 (#19385)

This commit is contained in:
flexsurfer 2024-03-25 15:17:08 +01:00 committed by GitHub
parent 32a4bb1153
commit 06dc9ea1d3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -3,7 +3,6 @@
[quo.core :as quo] [quo.core :as quo]
[react-native.clipboard :as clipboard] [react-native.clipboard :as clipboard]
[react-native.core :as rn] [react-native.core :as rn]
[reagent.core :as reagent]
[status-im.contexts.chat.home.add-new-contact.style :as style] [status-im.contexts.chat.home.add-new-contact.style :as style]
[utils.address :as address] [utils.address :as address]
[utils.debounce :as debounce] [utils.debounce :as debounce]
@ -51,57 +50,66 @@
(defn- search-input (defn- search-input
[] []
(reagent/with-let [input-value (reagent/atom nil) (let [[input-value set-input-value] (rn/use-state nil)
input-ref (atom nil) input-ref (rn/use-ref-atom nil)
clear-input (fn [] on-ref (rn/use-callback #(reset! input-ref %))
(reset! input-value nil) {:keys [scanned]
(rf/dispatch [:contacts/clear-new-identity])) contact-public-key :id} (rf/sub [:contacts/new-identity])
paste-on-input #(clipboard/get-string contact-public-key-or-scanned (or contact-public-key scanned)
(fn [clipboard-text] empty-input? (and (string/blank? input-value)
(reset! input-value clipboard-text) (string/blank? contact-public-key-or-scanned))
(rf/dispatch [:contacts/set-new-identity clear-input (rn/use-callback
{:input clipboard-text}])))] (fn []
(let [{:keys [scanned] contact-public-key :id} (rf/sub [:contacts/new-identity]) (set-input-value nil)
contact-public-key-or-scanned (or contact-public-key scanned) (rf/dispatch [:contacts/clear-new-identity])))
empty-input? (and (string/blank? @input-value) paste-on-input (rn/use-callback
(string/blank? contact-public-key-or-scanned))] (fn []
[rn/view {:style style/input-and-scan-container} (clipboard/get-string
[quo/input (fn [clipboard-text]
{:accessibility-label :enter-contact-code-input (set-input-value clipboard-text)
:ref #(reset! input-ref %) (rf/dispatch [:contacts/set-new-identity
:container-style {:flex 1} {:input clipboard-text}])))))
:auto-capitalize :none on-change-text (rn/use-callback
:multiline? true (fn [new-text]
:blur-on-submit true (set-input-value new-text)
:return-key-type :done (if (string/blank? contact-public-key-or-scanned)
:label (i18n/label :t/ens-or-chat-key) (debounce/debounce-and-dispatch [:contacts/set-new-identity
:placeholder (i18n/label :t/type-some-chat-key) {:input new-text}]
:clearable? (not empty-input?) 600)
:on-clear clear-input (rf/dispatch-sync [:contacts/set-new-identity
:button (when empty-input? {:input new-text}])))
{:on-press paste-on-input [contact-public-key-or-scanned])]
:text (i18n/label :t/paste)}) (rn/use-unmount #(rf/dispatch [:contacts/clear-new-identity]))
;; NOTE: `contact-public-key-or-scanned` has priority over `@input-value`, [rn/view {:style style/input-and-scan-container}
;; we clean it when the input is updated so that it's `nil` and [quo/input
;; `@input-value`is shown. To fastly clean it, we use `dispatch-sync`. {:accessibility-label :enter-contact-code-input
;; This call could be avoided if `::qr-scanner/scan-code` were able to :ref on-ref
;; receive a callback function, not only a re-frame event as callback. :container-style {:flex 1}
:value (or contact-public-key-or-scanned @input-value) :auto-capitalize :none
:on-change-text (fn [new-text] :multiline? true
(reset! input-value new-text) :blur-on-submit true
(as-> [:contacts/set-new-identity {:input new-text}] $ :return-key-type :done
(if (string/blank? contact-public-key-or-scanned) :label (i18n/label :t/ens-or-chat-key)
(debounce/debounce-and-dispatch $ 600) :placeholder (i18n/label :t/type-some-chat-key)
(rf/dispatch-sync $))))}] :clearable? (not empty-input?)
[rn/view {:style style/scan-button-container} :on-clear clear-input
[quo/button :button (when empty-input?
{:type :outline {:on-press paste-on-input
:icon-only? true :text (i18n/label :t/paste)})
:size 40 ;; NOTE: `contact-public-key-or-scanned` has priority over `input-value`,
:on-press #(rf/dispatch [:open-modal :scan-profile-qr-code])} ;; we clean it when the input is updated so that it's `nil` and
:i/scan]]]) ;; `input-value`is shown. To fastly clean it, we use `dispatch-sync`.
(finally ;; This call could be avoided if `::qr-scanner/scan-code` were able to
(rf/dispatch [:contacts/clear-new-identity])))) ;; receive a callback function, not only a re-frame event as callback.
:value (or contact-public-key-or-scanned input-value)
:on-change-text on-change-text}]
[rn/view {:style style/scan-button-container}
[quo/button
{:type :outline
:icon-only? true
:size 40
:on-press #(rf/dispatch [:open-modal :scan-profile-qr-code])}
:i/scan]]]))
(defn- invalid-text (defn- invalid-text
[message] [message]