staged command preview

resources/commands.js

@@ -160,6 +160,18 @@ status.response({
             event: "save-password",
             params: [params.value]
         };
+    },
+    preview: function (params) {
+        return status.components.text(
+            {
+                style: {
+                    marginTop: 5,
+                    marginHorizontal: 0,
+                    fontSize: 14,
+                    fontFamily: "font",
+                    color: "black"
+                }
+            }, "*****");
     }
 });
 

resources/status.js

@@ -25,6 +25,7 @@ Command.prototype.create = function (com) {
     this.color = com.color;
     this.icon = com.icon;
     this.params = com.params || [];
+    this.preview = com.preview;
     this.addToCatalog();
 
     return this;

src/status_im/chat/handlers.cljs

@@ -45,18 +45,18 @@
 (defn invoke-suggestions-handler!
   [{:keys [current-chat-id] :as db} _]
   (let [commands (get-in db [:chats current-chat-id :commands])
-        {:keys [command content]} (get-in db [:chats current-chat-id :command-input])]
-    (let [path   [(if (commands command) :commands :responses)
+        {:keys [command content]} (get-in db [:chats current-chat-id :command-input])
+        path     [(if (commands command) :commands :responses)
                   (:name command)
                   :params
                   0
                   :suggestions]
-          params {:value content}]
-      (j/call current-chat-id
-              path
-              params
-              #(dispatch [:suggestions-handler {:command command
-                                                :content content} %])))))
+        params   {:value content}]
+    (j/call current-chat-id
+            path
+            params
+            #(dispatch [:suggestions-handler {:command command
+                                              :content content} %]))))
 
 (register-handler :set-chat-command-content
   (after invoke-suggestions-handler!)
@@ -67,7 +67,22 @@
   [{:keys [current-chat-id] :as db} text]
   (assoc-in db [:chats current-chat-id :input-text] text))
 
+
+(defn invoke-command-preview!
+  [{:keys [current-chat-id staged-command] :as db} _]
+  (let [commands (get-in db [:chats current-chat-id :commands])
+        {:keys [command content]} staged-command
+        path     [(if (commands command) :commands :responses)
+                  (:name command)
+                  :preview]
+        params   {:value content}]
+    (j/call current-chat-id
+            path
+            params
+            #(dispatch [:command-preview current-chat-id %]))))
+
 (register-handler :stage-command
+  (after invoke-command-preview!)
   (fn [{:keys [current-chat-id] :as db} _]
     (let [db           (update-input-text db nil)
           {:keys [command content]}

src/status_im/chat/views/staged_command.cljs

@@ -1,9 +1,9 @@
 (ns status-im.chat.views.staged-command
   (:require [re-frame.core :refer [subscribe dispatch]]
             [status-im.components.react :refer [view
-                                              image
-                                              text
-                                              touchable-highlight]]
+                                                image
+                                                text
+                                                touchable-highlight]]
             [status-im.resources :as res]
             [status-im.chat.styles.input :as st]))
 
@@ -21,8 +21,7 @@
                              :onPress #(cancel-command-input staged-command)}
         [image {:source res/icon-close-gray
                 :style  st/staged-command-cancel-icon}]]]
-      [text {:style st/staged-command-content}
-       ;; TODO isn't smart
-       (if (= (:command command) :keypair-password)
-         "******"
-         (:content staged-command))]]]))
+      (if-let [preview (:preview staged-command)]
+        preview
+        [text {:style st/staged-command-content}
+         (:content staged-command)])]]))

src/status_im/commands/handlers/jail.cljs

@@ -5,8 +5,6 @@
             [status-im.utils.utils :refer [http-get toast]]
             [status-im.components.jail :as j]
 
-            [status-im.components.react :refer [text scroll-view view
-                                                image touchable-highlight]]
             [status-im.commands.utils :refer [json->cljs generate-hiccup
                                               reg-handler]]))
 
@@ -40,13 +38,25 @@
 (defn suggestions-handler
   [db [_ response-json]]
   (let [response (json->cljs response-json)]
-    (println response)
     (assoc db :current-suggestion (generate-hiccup response))))
 
 (defn suggestions-events-handler!
   [db [[n data]]]
   (case (keyword n)
     :set-value (dispatch [:set-chat-command-content data])
+    ;; todo show error?
+    nil))
+
+(defn command-preview
+  [db [chat-id response-json]]
+  (if-let [response (json->cljs response-json)]
+    (let [path [:chats chat-id :staged-commands]
+          commands-cnt (count (get-in db path))]
+      ;; todo (dec commands-cnt) looks like hack have to find better way to
+      ;; do this
+      (update-in db (conj path (dec commands-cnt)) assoc
+                 :preview (generate-hiccup response)
+                 :preview-string (str response)))
     db))
 
 (reg-handler :init-render-command! init-render-command!)
@@ -55,3 +65,4 @@
 (reg-handler :command-handler! (u/side-effect! command-nadler!))
 (reg-handler :suggestions-handler suggestions-handler)
 (reg-handler :suggestions-event! (u/side-effect! suggestions-events-handler!))
+(reg-handler :command-preview command-preview)

src/status_im/commands/utils.cljs

@@ -1,6 +1,8 @@
 (ns status-im.commands.utils
   (:require [clojure.set :as set]
             [clojure.walk :as w]
+            [status-im.components.react :refer [text scroll-view view
+                                                image touchable-highlight]]
             [re-frame.core :refer [register-handler dispatch trim-v debug]]))
 
 (defn json->cljs [json]

src/status_im/components/jail.cljs

@@ -29,6 +29,7 @@ Command.prototype.create = function (com) {
     this.color = com.color;
     this.icon = com.icon;
     this.params = com.params || [];
+    this.preview = com.preview;
     this.addToCatalog();
 
     return this;