[ISSUE #3651] change console to look like a dev tool

- rename "Console" to "Status Console"
- hide console dapp badge in home screen
- change icon to something terminal-y
- change empty screen text for console chat

Signed-off-by: Andrey Shovkoplyas <motor4ik@gmail.com>

ios/StatusIm/Images.xcassets/console.imageset/Contents.json

@@ -1,23 +0,0 @@
-{
-  "images" : [
-    {
-      "idiom" : "universal",
-      "filename" : "console.png",
-      "scale" : "1x"
-    },
-    {
-      "idiom" : "universal",
-      "filename" : "console-1.png",
-      "scale" : "2x"
-    },
-    {
-      "idiom" : "universal",
-      "filename" : "console-2.png",
-      "scale" : "3x"
-    }
-  ],
-  "info" : {
-    "version" : 1,
-    "author" : "xcode"
-  }
-}

src/status_im/chat/console.cljs

@@ -1,7 +1,7 @@
 (ns status-im.chat.console
   (:require [status-im.ui.components.styles :refer [default-chat-color]]
             [status-im.utils.random :as random]
-            [status-im.constants :as const]
+            [status-im.constants :as constants]
             [status-im.i18n :as i18n]
             [clojure.string :as string]))
 
@@ -9,29 +9,29 @@
                         :or   {message-id (random/id)}}]
   {:message-id   message-id
    :outgoing     false
-   :chat-id      const/console-chat-id
+   :chat-id      constants/console-chat-id
-   :from         const/console-chat-id
+   :from         constants/console-chat-id
    :to           "me"
    :content      content
    :content-type content-type})
 
 (def chat
-  {:chat-id      const/console-chat-id
+  {:chat-id      constants/console-chat-id
-   :name         (string/capitalize const/console-chat-id)
+   :name         (i18n/label :t/status-console)
    :color        default-chat-color
    :group-chat   false
    :is-active    true
    :unremovable? true
    :timestamp    (.getTime (js/Date.))
-   :photo-path   const/console-chat-id
+   :photo-path   (str "contacts://" constants/console-chat-id)
-   :contacts     [{:identity         const/console-chat-id
+   :contacts     [{:identity         constants/console-chat-id
                    :text-color       "#FFFFFF"
                    :background-color "#AB7967"}]})
 
 (def contact
-  {:whisper-identity const/console-chat-id
+  {:whisper-identity constants/console-chat-id
-   :name             (string/capitalize const/console-chat-id)
+   :name             (i18n/label :t/status-console)
-   :photo-path       const/console-chat-id
+   :photo-path       (str "contacts://" constants/console-chat-id)
    :dapp?            true
    :unremovable?     true
    :bot-url          "local://console-bot"

src/status_im/chat/screen.cljs

@@ -2,6 +2,7 @@
   (:require-macros [status-im.utils.views :refer [defview letsubs]])
   (:require [clojure.string :as string]
             [re-frame.core :as re-frame]
+            [status-im.constants :as constants]
             [status-im.i18n :as i18n]
             [status-im.chat.styles.screen :as style]
             [status-im.utils.platform :as platform]
@@ -92,11 +93,14 @@
 
 (defview messages-view [group-chat]
   (letsubs [messages           [:get-current-chat-messages]
-            current-public-key [:get-current-public-key]]
+            current-public-key [:get-current-public-key]
+            chat-id            [:get-current-chat-id]]
     (if (empty? messages)
       [react/view style/empty-chat-container
        [react/text {:style style/empty-chat-text}
-        (i18n/label :t/empty-chat-description)]]
+        (if (= chat-id constants/console-chat-id)
+          (i18n/label :t/empty-chat-description-console)
+          (i18n/label :t/empty-chat-description))]]
       [list/flat-list {:data                      messages
                        :key-fn                    #(or (:message-id %) (:value %))
                        :render-fn                 (fn [message]

src/status_im/chat/views/message/message.cljs

@@ -20,7 +20,8 @@
             [status-im.i18n :as i18n]
             [status-im.ui.components.colors :as colors]
             [clojure.string :as string]
-            [status-im.chat.events.console :as console]))
+            [status-im.chat.events.console :as console]
+            [status-im.react-native.resources :as resources]))
 
 (def window-width (:width (react/get-dimensions "window")))
 
@@ -244,9 +245,13 @@
 
 (defn- photo [from photo-path]
   [react/view
-   [react/image {:source {:uri (if (string/blank? photo-path)
+   [react/image {:source (if (string/starts-with? photo-path "contacts://")
-                                 (identicon/identicon from)
+                           (->> (string/replace photo-path #"contacts://" "")
-                                 photo-path)}
+                                (keyword)
+                                (get resources/contacts))
+                           {:uri (if (string/blank? photo-path)
+                                   (identicon/identicon from)
+                                   photo-path)})
                  :style  style/photo}]])
 
 (defview member-photo [from]

src/status_im/react_native/resources.cljs

@@ -15,7 +15,8 @@
    :ethlance           (js/require "./resources/images/contacts/ethlance.png")
    :commiteth          (js/require "./resources/images/contacts/commiteth.png")
    :etherplay          (js/require "./resources/images/contacts/etherplay.png")
-   :ethcro             (js/require "./resources/images/contacts/ethcro.png")})
+   :ethcro             (js/require "./resources/images/contacts/ethcro.png")
+   :console            (js/require "./resources/images/contacts/console.png")})
 
 (def assets
   {:ethereum (js/require "./resources/images/assets/ethereum.png")})
@@ -25,4 +26,4 @@
    :empty-recent    (js/require "./resources/images/ui/empty-recent.png")
    :analytics-image (js/require "./resources/images/ui/analytics-image.png")
    :welcome-image   (js/require "./resources/images/ui/welcome-image.png")
-   :lock            (js/require "./resources/images/ui/lock.png")})
+   :lock            (js/require "./resources/images/ui/lock.png")})

src/status_im/translations/en.cljs

@@ -29,6 +29,8 @@
    :camera-access-error                  "To grant the required camera permission, please go to your system settings and make sure that Status > Camera is selected."
    :photos-access-error                  "To grant the required photos permission, please go to your system settings and make sure that Status > Photos is selected."
 
+   :status-console                       "Status Console"
+
    ;;sign in
    :intro-text                           "Status is an open source decentralized chat and Ethereum browser"
    :intro-text-description               "Status is built with the help of the community to help you use all the benefits of decentralized web in your mobile phone"
@@ -214,6 +216,7 @@
    :public-group-topic                   "Topic"
    :set-a-topic                          "Set a topic"
    :empty-chat-description               "There are no messages \nin this chat yet"
+   :empty-chat-description-console       "Look under the hood! Console is a javascript runtime environment that exposes the whole web3 API. Type \"web3.\" to get started."
 
    ;;discover
    :discover                             "Discover"

src/status_im/ui/components/chat_icon/screen.cljs

@@ -49,7 +49,7 @@
        [dapp-badge styles])
      [pending-contact-badge chat-id styles]]))
 
-(defn chat-icon-view-chat-list [chat-id group-chat name color online]
+(defn chat-icon-view-chat-list [chat-id group-chat name color online & [hide-dapp?]]
   [chat-icon-view chat-id group-chat name online
    {:container              styles/container-chat-list
     :online-view-wrapper    styles/online-view-wrapper
@@ -62,7 +62,8 @@
     :size                   40
     :chat-icon              styles/chat-icon-chat-list
     :default-chat-icon      (styles/default-chat-icon-chat-list color)
-    :default-chat-icon-text styles/default-chat-icon-text}])
+    :default-chat-icon-text styles/default-chat-icon-text}
+   hide-dapp?])
 
 (defn chat-icon-view-action [chat-id group-chat name online]
   ^{:key chat-id}
@@ -167,4 +168,4 @@
                         edit?                     :edit?}]
   (let [color components.styles/default-chat-color
         size  56]
-    [profile-icon-view photo-path name color edit? size]))
+    [profile-icon-view photo-path name color edit? size]))

src/status_im/ui/screens/home/views/inner_item.cljs

@@ -87,11 +87,12 @@
                                                  public-key unremovable? :as chat]}]
   (letsubs [last-message [:get-last-message chat-id]]
     (let [name (or (i18n/get-contact-translated chat-id :name name)
-                (gfycat/generate-gfy public-key))]
+                   (gfycat/generate-gfy public-key))
+          hide-dapp? (= chat-id const/console-chat-id)]
       [react/touchable-highlight {:on-press #(re-frame/dispatch [:navigate-to-chat chat-id])}
        [react/view styles/chat-container
         [react/view styles/chat-icon-container
-         [chat-icon.screen/chat-icon-view-chat-list chat-id group-chat name color online]]
+         [chat-icon.screen/chat-icon-view-chat-list chat-id group-chat name color online hide-dapp?]]
         [react/view styles/chat-info-container
          [react/view styles/item-upper-container
           [chat-list-item-name name group-chat public? public-key]

test/cljs/status_im/test/contacts/events.cljs

@@ -53,8 +53,8 @@
 
 (def console-contact
   {:whisper-identity "console"
-   :name             "Console"
+   :name             "status-console"
-   :photo-path       "console"
+   :photo-path       "contacts://console"
    :dapp?            true
    :unremovable?     true
    :bot-url          "local://console-bot"