Non-atomic send button, leads to sending multiple transactions if tapping fast (#667)

src/status_im/chat/handlers/commands.cljs

@@ -113,14 +113,18 @@
       (when-not error
         (let [{:keys [errors validationHandler parameters]} (:returned result)]
           (cond errors
-                (dispatch [::add-validation-errors chat-id errors])
+                (do
+                  (dispatch [:set-chat-ui-props :sending-disabled? false])
+                  (dispatch [::add-validation-errors chat-id errors]))
 
                 validationHandler
-                (dispatch [::validation-handler!
-                           command-input
-                           chat-id
-                           validationHandler
-                           parameters])
+                (do
+                  (dispatch [:set-chat-ui-props :sending-disabled? false])
+                  (dispatch [::validation-handler!
+                             command-input
+                             chat-id
+                             validationHandler
+                             parameters]))
 
                 :else (if handler
                         (handler)
@@ -285,4 +289,6 @@
       (let [suggestions-trigger (keyword (:suggestions-trigger command))]
         (if (= :on-send suggestions-trigger)
           (dispatch [:invoke-commands-suggestions!])
-          (dispatch [:validate-command]))))))
+          (do
+            (dispatch [:set-chat-ui-props :sending-disabled? true])
+            (dispatch [:validate-command])))))))

src/status_im/chat/handlers/send_message.cljs

@@ -85,6 +85,7 @@
 
               :else
               (dispatch [:prepare-command! chat-id params'])))))
+      (dispatch [:set-chat-ui-props :sending-disabled? false])
       (when-not (s/blank? message)
         (dispatch [::prepare-message params])))))
 
@@ -107,6 +108,7 @@
                                (cu/check-author-direction db chat-id))]
         (log/debug "Handler data: " request handler-data (dissoc params :commands :command-message))
         (dispatch [:update-message-overhead! chat-id network-status])
+        (dispatch [:set-chat-ui-props :sending-disabled? false])
         (dispatch [::send-command! add-to-chat-id (assoc params :command command') hidden-params])
         (when (cu/console? chat-id)
           (dispatch `[:console-respond-command params]))
@@ -191,6 +193,7 @@
                           (assoc message' :to chat-id :message-type :user-message))
             params'     (assoc params :message message'')]
         (dispatch [:update-message-overhead! chat-id network-status])
+        (dispatch [:set-chat-ui-props :sending-disabled? false])
         (dispatch [::add-message params'])
         (dispatch [::save-message! params'])))))
 

src/status_im/chat/views/message_input.cljs

@@ -28,10 +28,12 @@
    :editable          (not disable?)
    :on-submit-editing plain-message/send})
 
-(defn command-input-options [icon-width disable?]
+(defn command-input-options [icon-width disable? sending-disabled?]
   {:style             (st-response/command-input icon-width disable?)
    :on-change-text    (when-not disable? command/set-input-message)
-   :on-submit-editing #(dispatch [:send-command!])})
+   :on-submit-editing (fn []
+                        (when-not sending-disabled?
+                          (dispatch [:send-command!])))})
 
 (defview message-input [input-options set-layout-size]
   [input-message [:get-chat-input-text]
@@ -55,12 +57,12 @@
                  :default-value          (or input-message "")}
                 input-options)])
 
-(defview command-input [input-options {:keys [fullscreen]}]
+(defview command-input [input-options {:keys [fullscreen]} sending-disabled?]
   [input-command [:get-chat-command-content]
    icon-width [:command-icon-width]
    disable? [:get :disable-input]]
   [text-input (merge
-                (command-input-options icon-width disable?)
+                (command-input-options icon-width disable? sending-disabled?)
                 {:auto-focus          (not fullscreen)
                  :blur-on-submit      false
                  :accessibility-label :input
@@ -79,7 +81,8 @@
         input-message        (subscribe [:get-chat-input-text])
         valid-plain-message? (subscribe [:valid-plain-message?])
         component            (r/current-component)
-        set-layout-size      #(r/set-state component {:height %})]
+        set-layout-size      #(r/set-state component {:height %})
+        sending-disabled?    (subscribe [:chat-ui-props :sending-disabled?])]
     (r/create-class
       {:get-initial-state
        plain-message-get-initial-state
@@ -96,7 +99,7 @@
              [plain-message/commands-button height #(set-layout-size 0)]
              [view (st/message-input-container height)
               (if @command?
-                [command-input input-options @command]
+                [command-input input-options @command @sending-disabled?]
                 [message-input input-options set-layout-size])]
              [plain-message/smile-button height]
              (when (or (and @command? (not (str/blank? @input-command)))
@@ -104,8 +107,10 @@
                (let [on-press (if @command?
                                 #(dispatch [:send-command!])
                                 plain-message/send)]
-                 [send-button {:on-press #(do (dispatch [:set-chat-ui-props :show-emoji? false])
-                                              (on-press %))}]))
+                 [send-button {:on-press (fn [e]
+                                           (when-not @sending-disabled?
+                                             (dispatch [:set-chat-ui-props :show-emoji? false])
+                                             (on-press e)))}]))
              (when (and @command? (= :command (:type @command)))
                [command/command-icon @command])]]))})))