|
3 | 3 | [quo.core :as quo] |
4 | 4 | [react-native.clipboard :as clipboard] |
5 | 5 | [react-native.core :as rn] |
6 | | - [reagent.core :as reagent] |
7 | 6 | [status-im.contexts.chat.home.add-new-contact.style :as style] |
8 | 7 | [utils.address :as address] |
9 | 8 | [utils.debounce :as debounce] |
|
51 | 50 |
|
52 | 51 | (defn- search-input |
53 | 52 | [] |
54 | | - (reagent/with-let [input-value (reagent/atom nil) |
55 | | - input-ref (atom nil) |
56 | | - clear-input (fn [] |
57 | | - (reset! input-value nil) |
58 | | - (rf/dispatch [:contacts/clear-new-identity])) |
59 | | - paste-on-input #(clipboard/get-string |
60 | | - (fn [clipboard-text] |
61 | | - (reset! input-value clipboard-text) |
62 | | - (rf/dispatch [:contacts/set-new-identity |
63 | | - {:input clipboard-text}])))] |
64 | | - (let [{:keys [scanned] contact-public-key :id} (rf/sub [:contacts/new-identity]) |
65 | | - contact-public-key-or-scanned (or contact-public-key scanned) |
66 | | - empty-input? (and (string/blank? @input-value) |
67 | | - (string/blank? contact-public-key-or-scanned))] |
68 | | - [rn/view {:style style/input-and-scan-container} |
69 | | - [quo/input |
70 | | - {:accessibility-label :enter-contact-code-input |
71 | | - :ref #(reset! input-ref %) |
72 | | - :container-style {:flex 1} |
73 | | - :auto-capitalize :none |
74 | | - :multiline? true |
75 | | - :blur-on-submit true |
76 | | - :return-key-type :done |
77 | | - :label (i18n/label :t/ens-or-chat-key) |
78 | | - :placeholder (i18n/label :t/type-some-chat-key) |
79 | | - :clearable? (not empty-input?) |
80 | | - :on-clear clear-input |
81 | | - :button (when empty-input? |
82 | | - {:on-press paste-on-input |
83 | | - :text (i18n/label :t/paste)}) |
84 | | - ;; NOTE: `contact-public-key-or-scanned` has priority over `@input-value`, |
85 | | - ;; we clean it when the input is updated so that it's `nil` and |
86 | | - ;; `@input-value`is shown. To fastly clean it, we use `dispatch-sync`. |
87 | | - ;; This call could be avoided if `::qr-scanner/scan-code` were able to |
88 | | - ;; receive a callback function, not only a re-frame event as callback. |
89 | | - :value (or contact-public-key-or-scanned @input-value) |
90 | | - :on-change-text (fn [new-text] |
91 | | - (reset! input-value new-text) |
92 | | - (as-> [:contacts/set-new-identity {:input new-text}] $ |
93 | | - (if (string/blank? contact-public-key-or-scanned) |
94 | | - (debounce/debounce-and-dispatch $ 600) |
95 | | - (rf/dispatch-sync $))))}] |
96 | | - [rn/view {:style style/scan-button-container} |
97 | | - [quo/button |
98 | | - {:type :outline |
99 | | - :icon-only? true |
100 | | - :size 40 |
101 | | - :on-press #(rf/dispatch [:open-modal :scan-profile-qr-code])} |
102 | | - :i/scan]]]) |
103 | | - (finally |
104 | | - (rf/dispatch [:contacts/clear-new-identity])))) |
| 53 | + (let [[input-value set-input-value] (rn/use-state nil) |
| 54 | + input-ref (rn/use-ref-atom nil) |
| 55 | + on-ref (rn/use-callback #(reset! input-ref %)) |
| 56 | + {:keys [scanned] |
| 57 | + contact-public-key :id} (rf/sub [:contacts/new-identity]) |
| 58 | + contact-public-key-or-scanned (or contact-public-key scanned) |
| 59 | + empty-input? (and (string/blank? input-value) |
| 60 | + (string/blank? contact-public-key-or-scanned)) |
| 61 | + clear-input (rn/use-callback |
| 62 | + (fn [] |
| 63 | + (set-input-value nil) |
| 64 | + (rf/dispatch [:contacts/clear-new-identity]))) |
| 65 | + paste-on-input (rn/use-callback |
| 66 | + (fn [] |
| 67 | + (clipboard/get-string |
| 68 | + (fn [clipboard-text] |
| 69 | + (set-input-value clipboard-text) |
| 70 | + (rf/dispatch [:contacts/set-new-identity |
| 71 | + {:input clipboard-text}]))))) |
| 72 | + on-change-text (rn/use-callback |
| 73 | + (fn [new-text] |
| 74 | + (set-input-value new-text) |
| 75 | + (if (string/blank? contact-public-key-or-scanned) |
| 76 | + (debounce/debounce-and-dispatch [:contacts/set-new-identity |
| 77 | + {:input new-text}] |
| 78 | + 600) |
| 79 | + (rf/dispatch-sync [:contacts/set-new-identity |
| 80 | + {:input new-text}]))) |
| 81 | + [contact-public-key-or-scanned])] |
| 82 | + (rn/use-unmount #(rf/dispatch [:contacts/clear-new-identity])) |
| 83 | + [rn/view {:style style/input-and-scan-container} |
| 84 | + [quo/input |
| 85 | + {:accessibility-label :enter-contact-code-input |
| 86 | + :ref on-ref |
| 87 | + :container-style {:flex 1} |
| 88 | + :auto-capitalize :none |
| 89 | + :multiline? true |
| 90 | + :blur-on-submit true |
| 91 | + :return-key-type :done |
| 92 | + :label (i18n/label :t/ens-or-chat-key) |
| 93 | + :placeholder (i18n/label :t/type-some-chat-key) |
| 94 | + :clearable? (not empty-input?) |
| 95 | + :on-clear clear-input |
| 96 | + :button (when empty-input? |
| 97 | + {:on-press paste-on-input |
| 98 | + :text (i18n/label :t/paste)}) |
| 99 | + ;; NOTE: `contact-public-key-or-scanned` has priority over `input-value`, |
| 100 | + ;; we clean it when the input is updated so that it's `nil` and |
| 101 | + ;; `input-value`is shown. To fastly clean it, we use `dispatch-sync`. |
| 102 | + ;; This call could be avoided if `::qr-scanner/scan-code` were able to |
| 103 | + ;; receive a callback function, not only a re-frame event as callback. |
| 104 | + :value (or contact-public-key-or-scanned input-value) |
| 105 | + :on-change-text on-change-text}] |
| 106 | + [rn/view {:style style/scan-button-container} |
| 107 | + [quo/button |
| 108 | + {:type :outline |
| 109 | + :icon-only? true |
| 110 | + :size 40 |
| 111 | + :on-press #(rf/dispatch [:open-modal :scan-profile-qr-code])} |
| 112 | + :i/scan]]])) |
105 | 113 |
|
106 | 114 | (defn- invalid-text |
107 | 115 | [message] |
|
0 commit comments