added tabs and sign message

src/cljs/status_dapp/components.cljs

@@ -1,5 +1,6 @@
 (ns status-dapp.components
-  (:require [status-dapp.react-native-web :as react]))
+  (:require [status-dapp.react-native-web :as react]
+            [re-frame.core :as re-frame]))
 
 (defn button [label on-press]
   [react/touchable-highlight {:on-press on-press}
@@ -12,3 +13,24 @@
    [react/view {:style {:padding 4 :background-color "#4360df99" :border-radius 4}}
     [react/text {:style {:color :white}} label]]
    [react/text {:style {:margin-left 10}} value]])
+
+(defn tab-button [label tab-view current-tab-view]
+  [react/view {:style {:margin-right 10 :opacity (when (not= tab-view current-tab-view) 0.5)}}
+   [button label (when (not= tab-view current-tab-view) #(re-frame/dispatch [:set :tab-view tab-view]))]])
+
+(defn tab-buttons [tab-view]
+  [react/view
+   [react/view {:style {:flex-direction :row :padding 10 :flex-wrap :wrap}}
+    [tab-button "Accounts" :accounts tab-view]
+    [tab-button "Assets" :assets tab-view]
+    [tab-button "Transactions" :transactions tab-view]
+    [tab-button "ETH" :eth tab-view]
+    [tab-button "Version" :version tab-view]
+    [tab-button "About" :about tab-view]]
+   [react/view {:style {:height 1 :margin-top 10 :background-color "#4360df33"}}]])
+
+(defn asset-button [label asset-address]
+  [react/view {:style {:margin-bottom 10}}
+   [button (str "Request " label) #(re-frame/dispatch [:send-transaction {:to       asset-address
+                                                                          :value    0
+                                                                          :gasPrise 150000}])]])

src/cljs/status_dapp/constants.cljs

@@ -6,3 +6,9 @@
    "4" "Testnet Rinkeby"})
 
 (def stt-ropsten-contract "0x34358C45FbA99ef9b78cB501584E8cBFa6f85Cef")
+(def att-ropsten-contract "0x00a8e52df8f4f1f4b67bded9ae6090b35489a973")
+(def hnd-ropsten-contract "0x9e47fb3049f0d9c953f5428ce2e6c3a8321780bf")
+(def lxs-ropsten-contract "0xf29d2dc0687d7d49f57d4a731ac8bfb6edc23473")
+(def adi-ropsten-contract "0xd2a816110c1177478c7e644ae4853d8e80aaec35")
+(def wgn-ropsten-contract "0x65c69bc258afa0906683f42e576b272a95c203dd")
+(def mds-ropsten-contract "0x972b0570d9cd8b7c41aa8349f707ec7356daa825")

src/cljs/status_dapp/db.cljs

@@ -3,4 +3,5 @@
 (def default-db
   {:web3            (when (exists? js/web3) js/web3)
    :web3-async-data {}
-   :view-id         (if (exists? js/web3) :web3 :no-web3)})
+   :view-id         (if (exists? js/web3) :web3 :no-web3)
+   :tab-view        :accounts})

src/cljs/status_dapp/events.cljs

@@ -1,7 +1,8 @@
 (ns status-dapp.events
   (:require [re-frame.core :as re-frame]
             [status-dapp.db :as db]
-            [day8.re-frame.http-fx]))
+            [day8.re-frame.http-fx]
+            [ajax.core :as ajax]))
 
 (defn set-web3-value [key]
   (fn [error result]
@@ -68,20 +69,28 @@
 
 (re-frame/reg-fx
   :call-set-contract-fx
-  (fn [[web3 address accounts]]
+  (fn [[web3 address]]
-    (set! (.-defaultAccount (.-eth web3)) (first accounts))
     (let [contract (.at (.contract (.-eth web3) abi) address)]
       (.set contract 10 #(println "Callback set contract" %1 %2)))))
 
 (re-frame/reg-fx
   :call-get-contract-fx
-  (fn [[web3 address accounts]]
+  (fn [[web3 address]]
-    (set! (.-defaultAccount (.-eth web3)) (first accounts))
     (let [contract (.at (.contract (.-eth web3) abi) address)]
       (.get contract #(do
                         (println "Callback get contract" (js/JSON.stringify %2))
                         (re-frame/dispatch [:set-in [:contract :value] (str (js->clj %2))]))))))
 
+(re-frame/reg-fx
+  :sign-message-fx
+  (fn [[web3 account]]
+    (.sendAsync
+      (.-currentProvider web3)
+      (clj->js {:method "personal_sign"
+                :params [(.toHex web3 "Kudos to Andrey!") account]
+                :from   account})
+      #(println "Sign message CB " %1 %2))))
+
 (re-frame/reg-event-db
   :set
   (fn [db [_ k v]]
@@ -135,15 +144,15 @@
 
 (re-frame/reg-event-fx
   :contract-call-set
-  (fn [{{:keys [web3 contract web3-async-data]} :db} _]
+  (fn [{{:keys [web3 contract]} :db} _]
     (when (and web3 contract)
-      {:call-set-contract-fx [web3 (:address contract) (:accounts web3-async-data)]})))
+      {:call-set-contract-fx [web3 (:address contract)]})))
 
 (re-frame/reg-event-fx
   :contract-call-get
-  (fn [{{:keys [web3 contract web3-async-data]} :db} _]
+  (fn [{{:keys [web3 contract]} :db} _]
     (when (and web3 contract)
-      {:call-get-contract-fx [web3 (:address contract) (:accounts web3-async-data)]})))
+      {:call-get-contract-fx [web3 (:address contract)]})))
 
 (re-frame/reg-event-fx
   :good-request-ropsten-eth
@@ -158,9 +167,9 @@
 (re-frame/reg-event-fx
   :request-ropsten-eth
   (fn [_ [_ address]]
-    (js/alert "Requested")
     {:http-xhrio {:method          :get
                   :uri             (str "http://51.15.45.169:3001/donate/" address)
+                  :response-format (ajax/json-response-format {:keywords? true})
                   :on-success      [:good-request-ropsten-eth]
                   :on-failure      [:bad-request-ropsten-eth]}}))
 
@@ -186,3 +195,8 @@
     (waiting-for-mining web3 tx-hash)
     {:db (assoc db :contract {:tx-hash tx-hash
                               :mining? true})}))
+
+(re-frame/reg-event-fx
+  :sign-message
+  (fn [{{:keys [web3 web3-async-data]} :db} _]
+    {:sign-message-fx [web3 (first (:accounts web3-async-data))]}))

src/cljs/status_dapp/views.cljs

@@ -10,14 +10,11 @@
    [react/text {:style {:font-weight :bold}}
     "Can't find web3 library"]])
 
-(defn send-transaction [from]
-  (re-frame/dispatch [:send-transaction {:from     from
-                                         :to       constants/stt-ropsten-contract
-                                         :value    0
-                                         :gasPrise 150000}]))
-
 (defview contract-panel [accounts]
-  (letsubs [{:keys [tx-hash mining? address value]} [:get :contract]]
+  (letsubs [{:keys [tx-hash address value]} [:get :contract]]
+    [react/view
+     [react/view {:style {:margin-bottom 10}}
+      [ui/button "Sign message" #(re-frame/dispatch [:sign-message])]]
      (cond
 
        address
@@ -35,38 +32,63 @@
         [react/text {:selectable true} (str "Mining new contract in tx: " tx-hash)]]
 
        :else
-      [ui/button "Deploy simple contract" #(re-frame/dispatch [:deploy-contract (str (first accounts))])])))
+       [ui/button "Deploy simple contract" #(re-frame/dispatch [:deploy-contract (str (first accounts))])])]))
-
 
 (defview web3-view []
   (letsubs [{:keys [api node network ethereum whisper accounts syncing gas-price
                     default-account default-block]}
             [:get :web3-async-data]
+            tab-view [:get :tab-view]
             balances [:get :balances]]
+    [react/view {:style {:flex 1}}
+     [ui/tab-buttons tab-view]
      [react/scroll-view {:style {:flex 1}}
       [react/view {:style {:flex 1 :padding 10}}
-      [react/view {:style {:flex-direction :row}}
+
-       ;[ui/button "Request Ropsten ETH" #(re-frame/dispatch [:request-ropsten-eth (str (first accounts))])]
+       (when (= :assets tab-view)
-       ;[react/view {:style {:width 5}}]
+         [react/view
-       (when (= "3" network)
+          ;;TODO CORS
-         [ui/button "Request 1000 STT" #(send-transaction (str (first accounts)))])]
+          ;;[ui/button "Request Ropsten ETH" #(re-frame/dispatch [:request-ropsten-eth (str (first accounts))])]
-      [contract-panel accounts]
+          ;;[react/view {:style {:width 5}}]
+          (if (= "3" network)
+            [react/view
+             [ui/asset-button "STT" constants/stt-ropsten-contract]
+             [ui/asset-button "ATT" constants/att-ropsten-contract]
+             [ui/asset-button "HND" constants/hnd-ropsten-contract]
+             [ui/asset-button "LXS" constants/lxs-ropsten-contract]
+             [ui/asset-button "ADI" constants/adi-ropsten-contract]
+             [ui/asset-button "WGN" constants/wgn-ropsten-contract]
+             [ui/asset-button "MDS" constants/mds-ropsten-contract]]
+            [react/text "Assets supported only in Ropsten Testnet"])])
+
+       (when (= :transactions tab-view)
+         [contract-panel accounts])
+
+       (when (= :version tab-view)
+         [react/view
           [react/text {:style {:font-weight :bold :margin-top 20}} "Version"]
           [ui/label "api" api]
           [ui/label "node" node]
           [ui/label "network" (str network " (" (or (constants/chains network) "Unknown") ")")]
           [ui/label "ethereum" ethereum]
-      [ui/label "whisper" whisper]
+          [ui/label "whisper" whisper]])
+
+       (when (= :accounts tab-view)
+         [react/view
           [react/text {:style {:font-weight :bold :margin-top 20}} "Accounts"]
-      [ui/label "defaultAccount" default-account]
+          [ui/label "defaultAccount" ""]
+          [react/text default-account]
           [ui/label "accounts" ""]
           (for [account accounts]
             ^{:key account}
             [react/view
              [react/text account]
-         (if (get balances account)
+             [ui/button "Get balance" #(re-frame/dispatch [:get-balance account])]
-           [react/text (str "Balance: " (get balances account) " wei")]
+             (when (get balances account)
-           [ui/button "Get balance" #(re-frame/dispatch [:get-balance account])])])
+               [react/text (str "Balance: " (get balances account) " wei")])])])
+
+       (when (= :eth tab-view)
+         [react/view
           [react/text {:style {:font-weight :bold :margin-top 20}} "Eth"]
           [ui/label "defaultBlock" default-block]
           (if syncing
@@ -77,7 +99,12 @@
              [ui/label "highestBlock" (.-highestBlock syncing)]]
             [ui/label "isSyncing" "false"])
           (when gas-price
-        [ui/label "gasPrice" (str (.toString gas-price 10) " wei")])]]))
+            [ui/label "gasPrice" (str (.toString gas-price 10) " wei")])])
+
+       (when (= :about tab-view)
+         [react/view
+          [react/text "Simple DApp"]
+          [react/text "Sources: https://github.com/status-im/status-dapp"]])]]]))
 
 (defview main []
   (letsubs [view-id [:get :view-id]]