diff --git a/android/app/src/main/res/drawable-hdpi/icon_add.png b/android/app/src/main/res/drawable-hdpi/icon_add.png old mode 100644 new mode 100755 index 60ab6e1281..4e3f4cc71d Binary files a/android/app/src/main/res/drawable-hdpi/icon_add.png and b/android/app/src/main/res/drawable-hdpi/icon_add.png differ diff --git a/android/app/src/main/res/drawable-hdpi/icon_add_white.png b/android/app/src/main/res/drawable-hdpi/icon_add_white.png new file mode 100644 index 0000000000..60ab6e1281 Binary files /dev/null and b/android/app/src/main/res/drawable-hdpi/icon_add_white.png differ diff --git a/android/app/src/main/res/drawable-xhdpi/icon_add.png b/android/app/src/main/res/drawable-xhdpi/icon_add.png old mode 100644 new mode 100755 index be85af38f4..88136956c2 Binary files a/android/app/src/main/res/drawable-xhdpi/icon_add.png and b/android/app/src/main/res/drawable-xhdpi/icon_add.png differ diff --git a/android/app/src/main/res/drawable-xhdpi/icon_add_white.png b/android/app/src/main/res/drawable-xhdpi/icon_add_white.png new file mode 100644 index 0000000000..be85af38f4 Binary files /dev/null and b/android/app/src/main/res/drawable-xhdpi/icon_add_white.png differ diff --git a/android/app/src/main/res/drawable-xxhdpi/icon_add.png b/android/app/src/main/res/drawable-xxhdpi/icon_add.png old mode 100644 new mode 100755 index 2780585768..ce0b329d94 Binary files a/android/app/src/main/res/drawable-xxhdpi/icon_add.png and b/android/app/src/main/res/drawable-xxhdpi/icon_add.png differ diff --git a/android/app/src/main/res/drawable-xxhdpi/icon_add_white.png b/android/app/src/main/res/drawable-xxhdpi/icon_add_white.png new file mode 100644 index 0000000000..2780585768 Binary files /dev/null and b/android/app/src/main/res/drawable-xxhdpi/icon_add_white.png differ diff --git a/android/app/src/main/res/drawable-xxxhdpi/icon_add.png b/android/app/src/main/res/drawable-xxxhdpi/icon_add_white.png similarity index 100% rename from android/app/src/main/res/drawable-xxxhdpi/icon_add.png rename to android/app/src/main/res/drawable-xxxhdpi/icon_add_white.png diff --git a/ios/StatusIm.xcodeproj/project.pbxproj b/ios/StatusIm.xcodeproj/project.pbxproj index 2d2fa4155b..f4a980e461 100644 --- a/ios/StatusIm.xcodeproj/project.pbxproj +++ b/ios/StatusIm.xcodeproj/project.pbxproj @@ -19,7 +19,6 @@ 139FDEF61B0652A700C62182 /* libRCTWebSocket.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 139FDEF41B06529B00C62182 /* libRCTWebSocket.a */; }; 13B07FBC1A68108700A75B9A /* AppDelegate.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.m */; }; 13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB11A68108700A75B9A /* LaunchScreen.xib */; }; - 13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; }; 13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; }; 146834051AC3E58100842450 /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 146834041AC3E56700842450 /* libReact.a */; }; 2028DFF91D4275B600227DCD /* SF-UI-Display-Medium.otf in Resources */ = {isa = PBXBuildFile; fileRef = 2028DFF51D4275B600227DCD /* SF-UI-Display-Medium.otf */; }; @@ -51,6 +50,7 @@ A6AF670051B842249D520C7B /* Foundation.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 7ED174A34D7D42358313368B /* Foundation.ttf */; }; AD5063BC2B2A4C52ACE0A0B4 /* libUdpSockets.a in Frameworks */ = {isa = PBXBuildFile; fileRef = A96279092BEC4C4B93914F48 /* libUdpSockets.a */; }; AE97D4B08C9F4821B8E9C50B /* Ionicons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 359B076A658B4FBAB5128B03 /* Ionicons.ttf */; }; + B2F2D1BC1D9D531B00B7B453 /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = B2F2D1BB1D9D531B00B7B453 /* Images.xcassets */; }; B45B40B471414274A7A83185 /* libRCTContacts.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 3384AFA9609A409B81928AD5 /* libRCTContacts.a */; }; BA68A2377A20496EA737000D /* libz.tbd in Frameworks */ = {isa = PBXBuildFile; fileRef = 4E586E1B0E544F64AA9F5BD1 /* libz.tbd */; }; C3EE9AEA6F77464588FBAA64 /* FontAwesome.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 7B5870D9ED504F32B6A09C35 /* FontAwesome.ttf */; }; @@ -287,7 +287,6 @@ 13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = StatusIm/AppDelegate.h; sourceTree = ""; }; 13B07FB01A68108700A75B9A /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = AppDelegate.m; path = StatusIm/AppDelegate.m; sourceTree = ""; }; 13B07FB21A68108700A75B9A /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.xib; name = Base; path = Base.lproj/LaunchScreen.xib; sourceTree = ""; }; - 13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = StatusIm/Images.xcassets; sourceTree = ""; }; 13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = StatusIm/Info.plist; sourceTree = ""; }; 13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = StatusIm/main.m; sourceTree = ""; }; 146833FF1AC3E56700842450 /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = "../node_modules/react-native/React/React.xcodeproj"; sourceTree = ""; }; @@ -332,6 +331,7 @@ 9ED2F4601D9D577B00B36508 /* SF-UI-Text-Bold.otf */ = {isa = PBXFileReference; lastKnownFileType = file; path = "SF-UI-Text-Bold.otf"; sourceTree = ""; }; 9F1854E6D9654226B1FC8308 /* RCTCamera.xcodeproj */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = "wrapper.pb-project"; name = RCTCamera.xcodeproj; path = "../node_modules/react-native-camera/ios/RCTCamera.xcodeproj"; sourceTree = ""; }; A96279092BEC4C4B93914F48 /* libUdpSockets.a */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = archive.ar; path = libUdpSockets.a; sourceTree = ""; }; + B2F2D1BB1D9D531B00B7B453 /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = StatusIm/Images.xcassets; sourceTree = ""; }; B3B19223008342D096AA356E /* Octicons.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = Octicons.ttf; path = "../node_modules/react-native-vector-icons/Fonts/Octicons.ttf"; sourceTree = ""; }; C2A4E93F6B154AEFA3485B45 /* libTcpSockets.a */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = archive.ar; path = libTcpSockets.a; sourceTree = ""; }; CD48A32459B64E96843BB238 /* libRealmReact.a */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = archive.ar; path = libRealmReact.a; sourceTree = ""; }; @@ -465,10 +465,10 @@ 13B07FAE1A68108700A75B9A /* StatusIm */ = { isa = PBXGroup; children = ( + B2F2D1BB1D9D531B00B7B453 /* Images.xcassets */, 008F07F21AC5B25A0029DE68 /* main.jsbundle */, 13B07FAF1A68108700A75B9A /* AppDelegate.h */, 13B07FB01A68108700A75B9A /* AppDelegate.m */, - 13B07FB51A68108700A75B9A /* Images.xcassets */, 13B07FB61A68108700A75B9A /* Info.plist */, 13B07FB11A68108700A75B9A /* LaunchScreen.xib */, 13B07FB71A68108700A75B9A /* main.m */, @@ -1099,7 +1099,6 @@ 9ED2F4611D9D579900B36508 /* SF-UI-Text-Bold.otf in Resources */, 9ED2F45E1D9D535A00B36508 /* SF-UI-Text-Regular.otf in Resources */, 9ED2F45F1D9D535A00B36508 /* SF-UI-Text-Medium.otf in Resources */, - 13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */, 13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */, 2028DFFA1D4275B600227DCD /* SF-UI-Display-Regular.otf in Resources */, 2028DFF91D4275B600227DCD /* SF-UI-Display-Medium.otf in Resources */, @@ -1109,6 +1108,7 @@ 82E689BAF9FB43C8AC6FF1CA /* EvilIcons.ttf in Resources */, C3EE9AEA6F77464588FBAA64 /* FontAwesome.ttf in Resources */, A6AF670051B842249D520C7B /* Foundation.ttf in Resources */, + B2F2D1BC1D9D531B00B7B453 /* Images.xcassets in Resources */, AE97D4B08C9F4821B8E9C50B /* Ionicons.ttf in Resources */, 0F942CF509F74CCDB5CB35B0 /* MaterialIcons.ttf in Resources */, EF2B5857B4A34E0C9707FB3F /* Octicons.ttf in Resources */, diff --git a/ios/StatusIm/Images.xcassets/icon_add.imageset/icon_add.png b/ios/StatusIm/Images.xcassets/icon_add.imageset/icon_add.png index 2780585768..ce0b329d94 100644 Binary files a/ios/StatusIm/Images.xcassets/icon_add.imageset/icon_add.png and b/ios/StatusIm/Images.xcassets/icon_add.imageset/icon_add.png differ diff --git a/ios/StatusIm/Images.xcassets/icon_add_white.imageset/Contents.json b/ios/StatusIm/Images.xcassets/icon_add_white.imageset/Contents.json new file mode 100644 index 0000000000..32c01ec112 --- /dev/null +++ b/ios/StatusIm/Images.xcassets/icon_add_white.imageset/Contents.json @@ -0,0 +1,21 @@ +{ + "images" : [ + { + "idiom" : "universal", + "filename" : "icon_add.png", + "scale" : "1x" + }, + { + "idiom" : "universal", + "scale" : "2x" + }, + { + "idiom" : "universal", + "scale" : "3x" + } + ], + "info" : { + "version" : 1, + "author" : "xcode" + } +} \ No newline at end of file diff --git a/ios/StatusIm/Images.xcassets/icon_add_white.imageset/icon_add.png b/ios/StatusIm/Images.xcassets/icon_add_white.imageset/icon_add.png new file mode 100644 index 0000000000..2780585768 Binary files /dev/null and b/ios/StatusIm/Images.xcassets/icon_add_white.imageset/icon_add.png differ diff --git a/src/status_im/accounts/login/screen.cljs b/src/status_im/accounts/login/screen.cljs index cea8d015ea..532dfdd88d 100644 --- a/src/status_im/accounts/login/screen.cljs +++ b/src/status_im/accounts/login/screen.cljs @@ -9,17 +9,15 @@ touchable-highlight get-dimensions]] [status-im.components.status-bar :refer [status-bar]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] + [status-im.components.toolbar.styles :refer [toolbar-title-container + toolbar-title-text]] [status-im.components.text-field.view :refer [text-field]] [status-im.components.styles :refer [color-purple color-white icon-search icon-back icon-qr - toolbar-background1 - toolbar-title-container - toolbar-title-text - button-input-container button-input white-form-text-input]] [status-im.qr-scanner.views.scan-button :refer [scan-button]] @@ -75,8 +73,8 @@ :style icon-back} :handler #(dispatch [:navigate-back])} :custom-content [toolbar-title] - :action {:image {:style icon-search} - :handler #()}}] + :actions [{:image {:style icon-search} + :handler #()}]}] [view st/form-container [view st/form-container-inner [address-input (or address "")] diff --git a/src/status_im/accounts/login/styles.cljs b/src/status_im/accounts/login/styles.cljs index 5bdf58ac0a..d3ed4c7afa 100644 --- a/src/status_im/accounts/login/styles.cljs +++ b/src/status_im/accounts/login/styles.cljs @@ -1,8 +1,5 @@ (ns status-im.accounts.login.styles - (:require [status-im.components.styles :refer [text1-color - color-white - toolbar-background2 - online-color]])) + (:require [status-im.components.styles :refer [color-white]])) (defn screen-container [height] diff --git a/src/status_im/accounts/recover/screen.cljs b/src/status_im/accounts/recover/screen.cljs index 9a4ee36134..98979e36ab 100644 --- a/src/status_im/accounts/recover/screen.cljs +++ b/src/status_im/accounts/recover/screen.cljs @@ -8,15 +8,15 @@ linear-gradient touchable-highlight]] [status-im.components.status-bar :refer [status-bar]] - [status-im.components.toolbar :refer [toolbar]] [status-im.components.text-field.view :refer [text-field]] + [status-im.components.toolbar.view :refer [toolbar]] + [status-im.components.toolbar.styles :refer [toolbar-gradient + toolbar-title-container + toolbar-title-text]] [status-im.components.styles :refer [color-purple color-white icon-back icon-search - toolbar-title-container - toolbar-title-text - toolbar-gradient button-input]] [status-im.components.react :refer [linear-gradient]] [status-im.i18n :refer [label]] @@ -83,8 +83,8 @@ :style icon-back} :handler #(dispatch [:navigate-back])} :custom-content [toolbar-title] - :action {:image {:style icon-search} - :handler #()}}] + :actions [{:image {:style icon-search} + :handler #()}]}] [linear-gradient {:locations [0 0.6 1] :colors gradient-colors :style toolbar-gradient}] diff --git a/src/status_im/accounts/recover/styles.cljs b/src/status_im/accounts/recover/styles.cljs index b75680ffe0..773dded88b 100644 --- a/src/status_im/accounts/recover/styles.cljs +++ b/src/status_im/accounts/recover/styles.cljs @@ -1,13 +1,10 @@ (ns status-im.accounts.recover.styles - (:require [status-im.components.styles :refer [text1-color - color-white - toolbar-background2 - online-color]])) + (:require [status-im.components.styles :refer [color-white]])) (def screen-container - {:flex 1 - :color :white + {:flex 1 + :color :white :background-color color-white}) (def gradient-background @@ -19,19 +16,19 @@ (def recover-explain-container {:padding-horizontal 35 - :padding-top 20 - :justify-content :center}) + :padding-top 20 + :justify-content :center}) (def recover-explain-text - {:color "#838c93de" - :font-size 16 + {:color "#838c93de" + :font-size 16 :line-height 20 - :text-align :center}) + :text-align :center}) (def form-container - {:flex 1 - :flex-direction "row" - :justifyContent "center"}) + {:flex 1 + :flex-direction "row" + :justifyContent "center"}) (def form-container-inner {:flex 1 @@ -48,10 +45,10 @@ {:flex 1}) (defn recover-button [valid-form?] - {:backgroundColor (if valid-form? "#7099e6" :gray) - :color :white - :flex 1 - :alignItems :center + {:backgroundColor (if valid-form? "#7099e6" :gray) + :color :white + :flex 1 + :alignItems :center :paddingVertical 16 :paddingHorizontal 28}) @@ -60,7 +57,7 @@ :fontSize 16}) (def input-style - {:color "#323232" + {:color "#323232" :font-size 12}) (def scan-label diff --git a/src/status_im/accounts/screen.cljs b/src/status_im/accounts/screen.cljs index 5e6737b27f..c1142a8a5a 100644 --- a/src/status_im/accounts/screen.cljs +++ b/src/status_im/accounts/screen.cljs @@ -10,19 +10,16 @@ linear-gradient touchable-highlight]] [status-im.components.status-bar :refer [status-bar]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] [status-im.components.styles :refer [color-purple color-white icon-search icon-back icon-qr icon-plus - toolbar-background1 - toolbar-title-container - toolbar-title-text - button-input-container - button-input white-form-text-input]] + [status-im.components.toolbar.styles :refer [toolbar-title-container + toolbar-title-text]] [status-im.utils.listview :as lw] [status-im.accounts.views.account :refer [account-view]] [status-im.i18n :refer [label]] @@ -68,8 +65,8 @@ :style icon-back} :handler (if show-back? #(dispatch [:navigate-back]) nil)} :custom-content [toolbar-title] - :action {:image {:style icon-search} - :handler #()}}] + :actions [{:image {:style icon-search} + :handler #()}]}] [list-view {:dataSource (lw/to-datasource accounts) :enableEmptySections true :renderRow render-row @@ -86,7 +83,7 @@ [touchable-highlight {:on-press create-account :accessibility-label :create-account} [view st/add-account-button - [image {:source {:uri :icon_add} + [image {:source {:uri :icon_add_white} :style st/icon-plus}] [text {:style st/add-account-text :font :default} diff --git a/src/status_im/accounts/styles.cljs b/src/status_im/accounts/styles.cljs index 643d0fd2f3..98f22f224c 100644 --- a/src/status_im/accounts/styles.cljs +++ b/src/status_im/accounts/styles.cljs @@ -1,8 +1,5 @@ (ns status-im.accounts.styles - (:require [status-im.components.styles :refer [text1-color - color-white - toolbar-background2 - online-color]] + (:require [status-im.components.styles :refer [color-white]] [status-im.components.react :as r])) @@ -82,11 +79,11 @@ :bottom 0}) (def add-account-button-container - {:flex 1 + {:flex 1 :paddingVertical 16 :paddingHorizontal 28 - :justifyContent :center - :alignItems :center}) + :justifyContent :center + :alignItems :center}) (def add-account-button {:flexDirection :row}) @@ -104,15 +101,15 @@ :marginLeft 8}) (def recover-button-container - {:flex 1}) + {:flex 1}) (def recover-button - {:flex 1 - :alignItems :center + {:flex 1 + :alignItems :center :paddingVertical 16 :paddingHorizontal 28}) (def recover-button-text - {:flex 1 - :color color-white + {:flex 1 + :color color-white :fontSize 16}) diff --git a/src/status_im/android/platform.cljs b/src/status_im/android/platform.cljs index 0fa98adab9..08dcdaa03c 100644 --- a/src/status_im/android/platform.cljs +++ b/src/status_im/android/platform.cljs @@ -39,4 +39,8 @@ (def platform-specific {:component-styles component-styles :fonts fonts - :list-selection-fn show-dialog}) + :list-selection-fn show-dialog + :chats {:action-button? true + :new-chat-in-toolbar? false} + :contacts {:action-button? true + :new-contact-in-toolbar? false}}) diff --git a/src/status_im/chat/handlers.cljs b/src/status_im/chat/handlers.cljs index 1052ba3a25..a39b2d4042 100644 --- a/src/status_im/chat/handlers.cljs +++ b/src/status_im/chat/handlers.cljs @@ -248,7 +248,8 @@ [{:keys [loaded-chats] :as db} _] (let [chats (->> loaded-chats (map (fn [{:keys [chat-id] :as chat}] - [chat-id chat])) + (let [last-message (messages/get-last-message chat-id)] + [chat-id (assoc chat :last-message last-message)]))) (into {})) ids (set (keys chats))] @@ -275,7 +276,8 @@ db' (assoc db :current-chat-id chat-id)] (dispatch [:load-requests! chat-id]) (dispatch [:load-commands! chat-id]) - (if (seq messages) + (if (and (seq messages) + (not= (count messages) 1)) db' (-> db' load-messages! diff --git a/src/status_im/chat/handlers/receive_message.cljs b/src/status_im/chat/handlers/receive_message.cljs index c05181b614..494489eb2e 100644 --- a/src/status_im/chat/handlers/receive_message.cljs +++ b/src/status_im/chat/handlers/receive_message.cljs @@ -38,7 +38,8 @@ message' (assoc (->> message (cu/check-author-direction previous-message) (check-preview)) - :chat-id chat-id')] + :chat-id chat-id' + :timestamp (.getTime (js/Date.)))] (store-message message') (when-not exists? (dispatch [:add-chat chat-id' (when group-chat? {:group-chat true})])) diff --git a/src/status_im/chat/screen.cljs b/src/status_im/chat/screen.cljs index 56c2d36cab..9da618f41e 100644 --- a/src/status_im/chat/screen.cljs +++ b/src/status_im/chat/screen.cljs @@ -17,7 +17,7 @@ [status-im.utils.datetime :as time] [status-im.utils.platform :refer [platform-specific]] [status-im.components.invertible-scroll-view :refer [invertible-scroll-view]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] [status-im.chat.views.message :refer [chat-message]] [status-im.chat.views.suggestions :refer [suggestion-container]] [status-im.chat.views.response :refer [response-view]] @@ -107,7 +107,7 @@ [text {:style st/members :font :medium} (let [cnt (inc (count @contacts))] - (label-pluralize cnt :t/members))]] + (label-pluralize cnt :t/members-active))]] [text {:style st/last-activity :font :default} (online-text @contact @chat-id)])]))) diff --git a/src/status_im/chat/styles/screen.cljs b/src/status_im/chat/styles/screen.cljs index d975c822bb..c9fd35af25 100644 --- a/src/status_im/chat/styles/screen.cljs +++ b/src/status_im/chat/styles/screen.cljs @@ -6,8 +6,8 @@ selected-message-color separator-color text1-color - text2-color - toolbar-background1]])) + text2-color]] + [status-im.components.toolbar.styles :refer [toolbar-background1]])) (def chat-view {:flex 1 diff --git a/src/status_im/chats_list/screen.cljs b/src/status_im/chats_list/screen.cljs index 11f9f0d187..9683860905 100644 --- a/src/status_im/chats_list/screen.cljs +++ b/src/status_im/chats_list/screen.cljs @@ -13,55 +13,77 @@ [status-im.components.action-button :refer [action-button action-button-item]] [status-im.components.drawer.view :refer [open-drawer]] - [status-im.components.styles :refer [color-blue - toolbar-background1 - toolbar-background2]] + [status-im.components.styles :refer [color-blue]] [status-im.components.status-bar :refer [status-bar]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] + [status-im.components.toolbar.styles :refer [toolbar-background1 + toolbar-background2]] [status-im.components.icons.custom-icons :refer [ion-icon]] + [status-im.components.react :refer [linear-gradient]] [status-im.i18n :refer [label]] [status-im.chats-list.styles :as st] - [status-im.components.styles :as cst] + [status-im.utils.platform :refer [platform-specific]] [status-im.components.tabs.bottom-gradient :refer [bottom-gradient]] [status-im.components.tabs.styles :refer [tabs-height]])) (defview chats-list-toolbar [] [chats-scrolled? [:get :chats-scrolled?]] - [toolbar {:nav-action {:image {:source {:uri :icon_hamburger} - :style st/hamburger-icon} - :handler open-drawer} - :title (label :t/chats) - :background-color (if chats-scrolled? - toolbar-background1 - toolbar-background2) - ;; TODO implement search - :action {:image {:source {:uri :icon_search} - :style st/search-icon} - :handler (fn [])}}]) + (let [new-chat? (get-in platform-specific [:chats :new-chat-in-toolbar?]) + actions (cond->> [{:image {:source {:uri :icon_search} + :style st/toolbar-icon} + :handler (fn [])}] + new-chat? + (into [{:image {:source {:uri :icon_add} + :style st/toolbar-icon} + :handler #(dispatch [:navigate-forget :group-contacts :people])}]))] + [toolbar {:nav-action {:image {:source {:uri :icon_hamburger} + :style st/hamburger-icon} + :handler open-drawer} + :title (label :t/chats) + :style (get-in platform-specific [:component-styles :toolbar]) + :background-color (if chats-scrolled? + toolbar-background1 + toolbar-background2) + :actions actions}])) + +(defn chats-action-button [] + [view {:style (st/action-buttons-container false 0) + :pointerEvents :box-none} + [action-button {:buttonColor color-blue + :offsetY 16 + :offsetX 16} + [action-button-item + {:title (label :t/new-chat) + :buttonColor :#9b59b6 + :onPress #(dispatch [:navigate-forget :group-contacts :people])} + [ion-icon {:name :md-create + :style st/create-icon}]] + [action-button-item + {:title (label :t/new-group-chat) + :buttonColor :#1abc9c + :onPress #(dispatch [:navigate-to :new-group])} + [ion-icon {:name :md-person + :style st/person-stalker-icon}]]]]) + +(defn chat-shadow-item [] + [view {:height 3} + [linear-gradient {:style {:height 3} + :colors st/gradient-top-bottom-shadow}]]) (defview chats-list [] [chats [:get :chats]] [view st/chats-container [chats-list-toolbar] - [list-view {:dataSource (to-datasource chats) - :renderRow (fn [row _ _] - (list-item [chat-list-item row])) - :style st/list-container}] - [view {:style (st/action-buttons-container false 0) - :pointerEvents :box-none} - [action-button {:buttonColor color-blue - :offsetY 16 - :offsetX 16} - [action-button-item - {:title (label :t/new-chat) - :buttonColor :#9b59b6 - :onPress #(dispatch [:navigate-forget :group-contacts :people])} - [ion-icon {:name :md-create - :style st/create-icon}]] - [action-button-item - {:title (label :t/new-group-chat) - :buttonColor :#1abc9c - :onPress #(dispatch [:navigate-to :new-group])} - [ion-icon {:name :md-person - :style st/person-stalker-icon}]]]] + [list-view {:dataSource (to-datasource chats) + :renderRow (fn [row _ _] + (list-item [chat-list-item row])) + :renderFooter #(list-item [chat-shadow-item]) + :renderSeparator #(list-item + (when (< %2 (- (count chats) 1)) + ^{:key (str "separator-" %2)} + [view st/chat-separator-wrapper + [view st/chat-separator-item]])) + :style st/list-container}] + (when (get-in platform-specific [:chats :action-button?]) + [chats-action-button]) [bottom-gradient]]) diff --git a/src/status_im/chats_list/styles.cljs b/src/status_im/chats_list/styles.cljs index d230f45ae9..5d9920a262 100644 --- a/src/status_im/chats_list/styles.cljs +++ b/src/status_im/chats_list/styles.cljs @@ -1,64 +1,83 @@ (ns status-im.chats-list.styles (:require [status-im.components.styles :refer [color-white + color-light-gray + color-separator color-blue - online-color text1-color text2-color new-messages-count-color]] [status-im.components.tabs.styles :refer [tabs-height]])) +(def gradient-top-bottom-shadow + ["rgba(24, 52, 76, 0.165)" + "rgba(24, 52, 76, 0.03)" + "rgba(24, 52, 76, 0.01)"]) + +(def chat-separator-wrapper + {:background-color color-white + :height 0.5 + :padding-left 74}) + +(def chat-separator-item + {:border-bottom-width 0.5 + :border-bottom-color color-separator}) + (def chat-container - {:flexDirection :row - :paddingVertical 15 - :paddingHorizontal 16 - :height 90}) + {:flex-direction :row + :background-color color-white + :height 94}) (def chat-icon-container - {:marginTop -2 - :marginLeft -4 - :width 48 - :height 48}) + {:margin-top -2 + :margin-left -4 + :padding 16 + :width 48 + :height 48}) (def item-container - {:flexDirection :column - :marginLeft 12 - :flex 1}) + {:flex-direction :column + :margin-left 30 + :padding-top 16 + :padding-right 16 + :flex 1}) (def name-view - {:flexDirection :row}) + {:flex-direction :row}) (def name-text - {:marginTop -2.5 - :color text1-color - :fontSize 14}) + {:color text1-color + :font-size 14}) (def group-icon - {:marginTop 4 - :marginLeft 8 - :width 14 - :height 9}) + {:margin-top 5 + :margin-left 8 + :width 14 + :height 9}) (def memebers-text - {:marginTop -0.5 + {:marginTop 2 :marginLeft 4 :fontSize 12 :color text2-color}) (def last-message-text - {:marginTop 7 - :marginRight 40 - :color text1-color - :fontSize 14 - :lineHeight 20}) + {:margin-top 5 + :margin-right 40 + :color text1-color + :fontSize 14 + :lineHeight 20}) + +(def last-message-text-no-messages + (merge last-message-text + {:color text2-color})) (def status-container - {:flexDirection :row - :position :absolute - :top 0 - :right 0}) + {:flex-direction :row + :top 18 + :right 16}) (def status-image - {:marginTop 6 + {:marginTop 4 :width 9 :height 7}) @@ -69,44 +88,43 @@ (def new-messages-container {:position :absolute - :top 36 - :right 0 + :top 54 + :right 16 :width 24 :height 24 :backgroundColor new-messages-count-color :borderRadius 50}) (def new-messages-text - {:top 4 - :left 0 - :fontSize 10 - :color color-blue - :textAlign :center}) + {:top 5 + :left 0 + :fontSize 10 + :color color-blue + :textAlign :center}) (def hamburger-icon {:width 16 :height 12}) -(def search-icon +(def toolbar-icon {:width 17 :height 17}) (def chats-container - {:flex 1 - :backgroundColor :white}) + {:flex 1}) (def list-container - {:backgroundColor :white}) + {:background-color color-light-gray}) (def create-icon {:fontSize 20 :height 22 - :color :white}) + :color color-white}) (def person-stalker-icon {:fontSize 20 :height 22 - :color :white}) + :color color-white}) (defn action-buttons-container [animation? offset-y] ;; todo fix overlaying of parent view diff --git a/src/status_im/chats_list/views/chat_list_item.cljs b/src/status_im/chats_list/views/chat_list_item.cljs index 028d50db2f..ddd650816f 100644 --- a/src/status_im/chats_list/views/chat_list_item.cljs +++ b/src/status_im/chats_list/views/chat_list_item.cljs @@ -7,10 +7,10 @@ [status-im.chats-list.views.inner-item :refer [chat-list-item-inner-view]])) (defn chat-list-item [[chat-id chat]] - [touchable-highlight - {:on-press #(dispatch [:navigate-to :chat chat-id])} - [view [chat-list-item-inner-view (merge chat - ;; TODO stub data - {:chat-id chat-id - :new-messages-count 3 - :online true})]]]) + [touchable-highlight {:on-press #(dispatch [:navigate-to :chat chat-id])} + [view + [chat-list-item-inner-view (merge chat + ;; TODO stub data + {:chat-id chat-id + :new-messages-count 3 + :online true})]]]) diff --git a/src/status_im/chats_list/views/inner_item.cljs b/src/status_im/chats_list/views/inner_item.cljs index b82c4bfc31..179d62a2b4 100644 --- a/src/status_im/chats_list/views/inner_item.cljs +++ b/src/status_im/chats_list/views/inner_item.cljs @@ -4,22 +4,64 @@ [status-im.components.chat-icon.screen :refer [chat-icon-view-chat-list]] [status-im.chats-list.styles :as st] [status-im.utils.utils :refer [truncate-str]] - [status-im.i18n :refer [label]] + [status-im.i18n :refer [label label-pluralize]] [status-im.utils.datetime :as time] + [status-im.constants :refer [console-chat-id]] [clojure.string :as str])) -(defview chat-list-item-inner-view - [{:keys [chat-id name color new-messages-count - online group-chat contacts] :as chat}] +(defn message-content [{:keys [content] :as message}] + (let [content (if message + (if (string? content) + content + (:content content)))] + (if (str/blank? content) + [text {:style st/last-message-text-no-messages} + (label :t/no-messages)] + [text {:style st/last-message-text + :number-of-lines 2} + content]))) + +(defview message-status [{:keys [chat-id contacts]} + {:keys [message-id message-status user-statuses message-type outgoing] :as msg}] + [app-db-message-status-value [:get-in [:message-statuses message-id :status]]] + (let [delivery-status (get-in user-statuses [chat-id :status])] + (when (and outgoing + (or (some #(= (keyword %) :seen) [delivery-status + message-status + app-db-message-status-value]) + (and (= (keyword message-type) :group-user-message) + (and (= (count user-statuses) (count contacts)) + (every? (fn [[_ {:keys [status]}]] + (= (keyword status) :seen)) user-statuses))) + (= chat-id console-chat-id))) + [image {:source {:uri :icon_ok_small} + :style st/status-image}]))) + +(defn message-timestamp [{:keys [timestamp]}] + (when timestamp + [text {:style st/datetime-text} + (time/to-short-str timestamp)])) + +(defview unviewed-indicator [chat-id] [unviewed-messages [:unviewed-messages-count chat-id]] - (let [last-message (first (:messages chat)) - name (or name chat-id)] + (when (pos? unviewed-messages) + [view st/new-messages-container + [text {:style st/new-messages-text + :font :medium} + unviewed-messages]])) + +(defn chat-list-item-inner-view [{:keys [chat-id name color last-message + online group-chat contacts] :as chat}] + (let [last-message (or (first (:messages chat)) + last-message) + name (or name chat-id)] [view st/chat-container [view st/chat-icon-container [chat-icon-view-chat-list chat-id group-chat name color online]] [view st/item-container [view st/name-view - [text {:style st/name-text} + [text {:style st/name-text + :font :medium} (if (str/blank? name) (label :t/user-anonymous) (truncate-str name 30))] @@ -27,29 +69,11 @@ [icon :group st/group-icon]) (when group-chat [text {:style st/memebers-text} - (if (< 0 (count contacts)) - (str (inc (count contacts)) " members") - "1 member")])] - [text {:style st/last-message-text - :numberOfLines 2} - (when last-message - (let [content (:content last-message)] - (if (string? content) - content - (:content content))))]] + (label-pluralize (inc (count contacts)) :t/members)])] + [message-content last-message]] [view (when last-message [view st/status-container - ;; TODO currently there is not :delivery-status in last-message - (when (:delivery-status last-message) - [image {:source (if (= (keyword (:delivery-status last-message)) :seen) - {:uri :icon_ok_small} - ;; todo change icon - {:uri :icon_ok_small}) - :style st/status-image}]) - (when (:timestamp last-message) - [text {:style st/datetime-text} - (time/to-short-str (:timestamp last-message))])]) - (when (pos? unviewed-messages) - [view st/new-messages-container - [text {:style st/new-messages-text} unviewed-messages]])]])) + [message-status chat last-message] + [message-timestamp last-message]]) + [unviewed-indicator chat-id]]])) diff --git a/src/status_im/components/carousel/styles.cljs b/src/status_im/components/carousel/styles.cljs index ea520b7aa6..174b58a897 100644 --- a/src/status_im/components/carousel/styles.cljs +++ b/src/status_im/components/carousel/styles.cljs @@ -1,12 +1,4 @@ -(ns status-im.components.carousel.styles - (:require [status-im.components.styles :refer [color-white - chat-background - online-color - selected-message-color - separator-color - text1-color - text2-color - toolbar-background1]])) +(ns status-im.components.carousel.styles) (def scroll-view-container {:flex 1}) diff --git a/src/status_im/components/chat_icon/styles.cljs b/src/status_im/components/chat_icon/styles.cljs index 43c3adc4ef..ebdd548eba 100644 --- a/src/status_im/components/chat_icon/styles.cljs +++ b/src/status_im/components/chat_icon/styles.cljs @@ -1,20 +1,14 @@ (ns status-im.components.chat-icon.styles (:require [status-im.components.styles :refer [color-white - chat-background - online-color - selected-message-color - separator-color - text1-color - text2-color - toolbar-background1]])) + online-color]])) (defn default-chat-icon [color] {:margin 4 - :width 36 - :height 36 + :width 40 + :height 40 :alignItems :center :justifyContent :center - :borderRadius 18 + :borderRadius 20 :backgroundColor color}) (defn default-chat-icon-chat-list [color] @@ -40,9 +34,9 @@ (def chat-icon {:margin 4 - :borderRadius 18 - :width 36 - :height 36}) + :borderRadius 20 + :width 40 + :height 40}) (def chat-icon-chat-list (merge chat-icon diff --git a/src/status_im/components/styles.cljs b/src/status_im/components/styles.cljs index 4cbdbcb3f4..66ac82dee9 100644 --- a/src/status_im/components/styles.cljs +++ b/src/status_im/components/styles.cljs @@ -12,6 +12,7 @@ (def color-light-blue-transparent "#bbc4cb32") (def color-light-gray "#EEF2F5") (def color-red "red") +(def color-separator "#D6D6D6") (def text1-color color-black) (def text1-disabled-color "#555555") @@ -24,12 +25,8 @@ (def chat-background color-light-gray) (def selected-message-color "#E4E9ED") (def separator-color "#0000001f") -(def toolbar-background1 color-white) -(def toolbar-background2 color-light-gray) (def default-chat-color color-purple) -(def toolbar-height 56) - (def flex {:flex 1}) @@ -71,36 +68,18 @@ :height 18}) (def icon-close - {:width 12 + {:width 12 :height 12}) -(def form-text-input - {:marginLeft -4 - :fontSize 14 - :color text1-color}) - (def white-form-text-input {:marginLeft -4 :fontSize 14 :color color-white}) -(def toolbar-title-container - {:flex 1 - :alignItems :center - :justifyContent :center}) - -(def toolbar-title-text - {:margin-top -2.5 - :color text1-color - :font-size 16}) - (def button-input-container {:flex 1 :flexDirection :row}) (def button-input {:flex 1 - :flexDirection :column}) - -(def toolbar-gradient - {:height 4}) \ No newline at end of file + :flexDirection :column}) \ No newline at end of file diff --git a/src/status_im/components/tabs/styles.cljs b/src/status_im/components/tabs/styles.cljs index 2428217666..8ceb227e88 100644 --- a/src/status_im/components/tabs/styles.cljs +++ b/src/status_im/components/tabs/styles.cljs @@ -1,12 +1,5 @@ (ns status-im.components.tabs.styles - (:require [status-im.components.styles :refer [color-white - chat-background - online-color - selected-message-color - separator-color - text1-color - text2-color - toolbar-background1]])) + (:require [status-im.components.styles :refer [color-white]])) (def tabs-height 60) (def tab-height 56) diff --git a/src/status_im/components/toolbar.cljs b/src/status_im/components/toolbar.cljs deleted file mode 100644 index 51cbc33bf9..0000000000 --- a/src/status_im/components/toolbar.cljs +++ /dev/null @@ -1,61 +0,0 @@ -(ns status-im.components.toolbar - (:require [re-frame.core :refer [subscribe dispatch]] - [status-im.components.react :refer [view - text-input - icon - text - image - touchable-highlight]] - [status-im.components.styles :refer [color-white - color-purple - text1-color - text2-color - toolbar-background1 - toolbar-title-container - toolbar-title-text - icon-back - toolbar-height]])) - -(defn toolbar [{title :title - nav-action :nav-action - hide-nav? :hide-nav? - action :action - custom-action :custom-action - background-color :background-color - custom-content :custom-content - style :style}] - (let [style (merge {:flexDirection :row - :backgroundColor (or background-color toolbar-background1) - :height toolbar-height - :elevation 2} style)] - [view {:style style} - (when (not hide-nav?) - (if nav-action - [touchable-highlight {:on-press (:handler nav-action)} - [view {:width 56 - :height 56 - :alignItems :center - :justifyContent :center} - [image (:image nav-action)]]] - [touchable-highlight {:on-press #(dispatch [:navigate-back]) - :accessibility-label :navigate-back} - [view {:width 56 - :height 56 - :alignItems :center - :justifyContent :center} - [image {:source {:uri :icon_back} - :style icon-back}]]])) - (or custom-content - [view {:style toolbar-title-container} - [text {:style toolbar-title-text - :font :medium} - title]]) - custom-action - (when action - [touchable-highlight {:on-press (:handler action)} - [view {:width 56 - :height 56 - :alignItems :center - :justifyContent :center} - [image (:image action)]]])])) - diff --git a/src/status_im/components/toolbar/styles.cljs b/src/status_im/components/toolbar/styles.cljs new file mode 100644 index 0000000000..14e256d289 --- /dev/null +++ b/src/status_im/components/toolbar/styles.cljs @@ -0,0 +1,54 @@ +(ns status-im.components.toolbar.styles + (:require [status-im.components.styles :refer [text1-color + color-white + color-light-gray]])) + +(def toolbar-background1 color-white) +(def toolbar-background2 color-light-gray) + +(def toolbar-height 56) +(def toolbar-icon-width 32) +(def toolbar-icon-spacing 8) + +(def toolbar-gradient + {:height 4}) + +(defn toolbar [background-color] + {:flexDirection :row + :backgroundColor (or background-color toolbar-background1) + :height toolbar-height + :elevation 2}) + +(defn toolbar-nav-actions-container [actions] + {:width (if (and actions (> (count actions) 0)) + (-> (+ toolbar-icon-width toolbar-icon-spacing) + (* (count actions)) + (+ toolbar-icon-spacing))) + :flex-direction "row"}) + +(def toolbar-nav-action + {:width toolbar-height + :height toolbar-height + :align-items :center + :justify-content :center}) + +(def toolbar-title-container + {:flex 1 + :alignItems :center + :justifyContent :center}) + +(def toolbar-title-text + {:margin-top -2.5 + :color text1-color + :font-size 16}) + +(def toolbar-actions-container + {:flex-direction "row" + :margin-left 8}) + +(def toolbar-action + {:width toolbar-icon-width + :height toolbar-height + :margin-right toolbar-icon-spacing + :align-items :center + :justify-content :center}) \ No newline at end of file diff --git a/src/status_im/components/toolbar/view.cljs b/src/status_im/components/toolbar/view.cljs new file mode 100644 index 0000000000..db98861020 --- /dev/null +++ b/src/status_im/components/toolbar/view.cljs @@ -0,0 +1,47 @@ +(ns status-im.components.toolbar.view + (:require [re-frame.core :refer [subscribe dispatch]] + [status-im.components.react :refer [view + text-input + icon + text + image + touchable-highlight]] + [status-im.components.styles :refer [icon-back]] + [status-im.components.toolbar.styles :as st])) + +(defn toolbar [{title :title + nav-action :nav-action + hide-nav? :hide-nav? + actions :actions + custom-action :custom-action + background-color :background-color + custom-content :custom-content + style :style}] + (let [style (merge (st/toolbar background-color) style)] + [view {:style style} + [view (st/toolbar-nav-actions-container actions) + (when (not hide-nav?) + (if nav-action + [touchable-highlight {:on-press (:handler nav-action)} + [view st/toolbar-nav-action + [image (:image nav-action)]]] + [touchable-highlight {:on-press #(dispatch [:navigate-back]) + :accessibility-label :navigate-back} + [view st/toolbar-nav-action + [image {:source {:uri :icon_back} + :style icon-back}]]]))] + (or custom-content + [view {:style st/toolbar-title-container} + [text {:style st/toolbar-title-text + :font :medium} + title]]) + [view st/toolbar-actions-container + (if actions + (for [{action-image :image + action-handler :handler} actions] + ^{:key (str "action-" action-image)} + [touchable-highlight {:on-press action-handler} + [view st/toolbar-action + [image action-image]]]) + custom-action)]])) + diff --git a/src/status_im/contacts/screen.cljs b/src/status_im/contacts/screen.cljs index 3d675f1219..729bd55492 100644 --- a/src/status_im/contacts/screen.cljs +++ b/src/status_im/contacts/screen.cljs @@ -14,29 +14,35 @@ action-button-item]] [status-im.contacts.views.contact :refer [contact-extended-view on-press]] [status-im.components.status-bar :refer [status-bar]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] + [status-im.components.toolbar.styles :refer [toolbar-background2]] [status-im.components.drawer.view :refer [open-drawer]] [status-im.components.icons.custom-icons :refer [ion-icon]] [status-im.components.styles :refer [color-blue hamburger-icon icon-search - create-icon - toolbar-background2]] + create-icon]] [status-im.components.tabs.bottom-gradient :refer [bottom-gradient]] [status-im.contacts.styles :as st] [status-im.i18n :refer [label]] - [status-im.components.styles :as cst])) + [status-im.utils.platform :refer [platform-specific]])) (defn contact-list-toolbar [] - [toolbar {:nav-action {:image {:source {:uri :icon_hamburger} - :style hamburger-icon} - :handler open-drawer} - :title (label :t/contacts) - :background-color toolbar-background2 - :style {:elevation 0} - :action {:image {:source {:uri :icon_search} - :style icon-search} - :handler (fn [])}}]) + (let [new-contact? (get-in platform-specific [:contacts :new-contact-in-toolbar?]) + actions (cond->> [{:image {:source {:uri :icon_search} + :style icon-search} + :handler (fn [])}] + new-contact? + (into [{:image {:source {:uri :icon_add} + :style icon-search} + :handler #(dispatch [:navigate-to :new-contact])}]))] + [toolbar {:nav-action {:image {:source {:uri :icon_hamburger} + :style hamburger-icon} + :handler open-drawer} + :title (label :t/contacts) + :background-color toolbar-background2 + :style {:elevation 0} + :actions actions}])) (def contacts-limit 10) @@ -68,6 +74,18 @@ [view [text {:style st/show-all-text} (label :t/show-all)]]]])]) +(defn contacts-action-button [] + [view st/buttons-container + [action-button {:buttonColor color-blue + :offsetY 16 + :offsetX 16} + [action-button-item + {:title (label :t/new-contact) + :buttonColor :#9b59b6 + :onPress #(dispatch [:navigate-to :new-contact])} + [ion-icon {:name :md-create + :style create-icon}]]]]) + (defn contact-list [] (let [contacts (subscribe [:get-added-contacts-with-limit contacts-limit]) contacts-count (subscribe [:added-contacts-count]) @@ -88,26 +106,18 @@ [contact-group @contacts @contacts-count - (label :t/contacs-group-dapps) + (label :t/contacts-group-dapps) :dapps true @click-handler] [contact-group @contacts @contacts-count - (label :t/contacs-group-people) + (label :t/contacts-group-people) :people false @click-handler]] [view st/empty-contact-groups [react/icon :group_big st/empty-contacts-icon] [text {:style st/empty-contacts-text} (label :t/no-contacts)]]) - [view st/buttons-container - [action-button {:buttonColor color-blue - :offsetY 16 - :offsetX 16} - [action-button-item - {:title (label :t/new-contact) - :buttonColor :#9b59b6 - :onPress #(dispatch [:navigate-to :new-contact])} - [ion-icon {:name :md-create - :style create-icon}]]]] + (when (get-in platform-specific [:contacts :action-button?]) + [contacts-action-button]) [bottom-gradient]]))) diff --git a/src/status_im/contacts/styles.cljs b/src/status_im/contacts/styles.cljs index 9274b44037..fbe4fac600 100644 --- a/src/status_im/contacts/styles.cljs +++ b/src/status_im/contacts/styles.cljs @@ -4,13 +4,14 @@ text3-color text5-color color-white - toolbar-background2 - online-color - color-gray2]])) + color-black + color-light-gray + color-separator + color-gray2]] + [status-im.components.toolbar.styles :refer [toolbar-background2]])) (def contacts-list-container - {:flex 1 - :backgroundColor :white}) + {:flex 1}) (def toolbar-shadow {:height 2 @@ -35,7 +36,7 @@ :color color-gray2}) (def contacts-list - {:backgroundColor :white}) + {:backgroundColor color-white}) (def contact-group {:flexDirection :column}) @@ -97,8 +98,8 @@ :letterSpacing 0.5}) (def contact-container - {:flexDirection :row - :backgroundColor color-white}) + {:flex-direction :row + :background-color color-white}) (def letter-container {:paddingTop 11 @@ -106,13 +107,41 @@ :width 56}) (def letter-text - {:fontSize 24 - :color text3-color}) + {:fontSize 24 + :color text3-color}) (def contact-photo-container {:marginTop 4 :marginLeft 12}) +(def option-inner-container + {:flex 1 + :flex-direction :row + :height 56 + :background-color color-white + :border-bottom-color color-separator + :border-bottom-width 0.5}) + +(def option-inner + {:width 48 + :height 48 + :margin-top 4 + :margin-left 12}) + +(def option-inner-image + {:width 24 + :height 18 + :top 16 + :left 13}) + +(def spacing-top + {:background-color color-white + :height 8}) + +(def spacing-bottom + {:background-color color-white + :height 8}) + (def contact-inner-container {:flex 1 :flexDirection :row @@ -126,13 +155,13 @@ :justifyContent :center}) (def name-text - {:fontSize 16 - :color text1-color}) + {:fontSize 15 + :color text1-color}) (def info-text - {:marginTop 1 - :fontSize 12 - :color text2-color}) + {:marginTop 1 + :fontSize 12 + :color text2-color}) (def more-btn {:width 56 @@ -147,8 +176,8 @@ ; new contact (def contact-form-container - {:flex 1 - :color :white + {:flex 1 + :color :white :backgroundColor :white}) (def gradient-background @@ -163,21 +192,21 @@ :margin-top 16}) (def address-explication-container - {:flex 1 - :margin-top 30 - :paddingLeft 16 + {:flex 1 + :margin-top 30 + :paddingLeft 16 :paddingRight 16}) (def address-explication {:textAlign :center - :color "#838c93de"}) + :color "#838c93de"}) (def buttons-container {:position :absolute - :bottom 0 - :right 0 - :width 200 - :height 170}) + :bottom 0 + :right 0 + :width 200 + :height 170}) (def qr-input {:margin-right 42}) diff --git a/src/status_im/contacts/subs.cljs b/src/status_im/contacts/subs.cljs index 9dad03f958..68aa8cf448 100644 --- a/src/status_im/contacts/subs.cljs +++ b/src/status_im/contacts/subs.cljs @@ -9,8 +9,12 @@ (reaction @contacts)))) (defn sort-contacts [contacts] - (sort-by :name #(compare (clojure.string/lower-case %1) - (clojure.string/lower-case %2)) (vals contacts))) + (->> (vals contacts) + (sort (fn [c1 c2] + (let [name1 (or (:name c1) (:address c1) (:whisper-identity c1)) + name2 (or (:name c2) (:address c2) (:whisper-identity c2))] + (compare (clojure.string/lower-case name1) + (clojure.string/lower-case name2))))))) (register-sub :all-added-contacts (fn [db _] diff --git a/src/status_im/contacts/views/contact.cljs b/src/status_im/contacts/views/contact.cljs index 913f8a04b3..3056eb92cb 100644 --- a/src/status_im/contacts/views/contact.cljs +++ b/src/status_im/contacts/views/contact.cljs @@ -5,20 +5,14 @@ [status-im.contacts.styles :as st] [status-im.contacts.views.contact-inner :refer [contact-inner-view]])) -(defn letter-view [letter] - [view st/letter-container - (when letter - [text {:style st/letter-text} letter])]) - (defn on-press [whisper-identity] #(dispatch [:start-chat whisper-identity])) -(defview contact-with-letter-view [{:keys [whisper-identity letter] :as contact}] +(defview contact-view [{:keys [whisper-identity] :as contact}] [chat [:get-chat whisper-identity]] [touchable-highlight {:onPress (on-press whisper-identity)} [view st/contact-container - [letter-view letter] [contact-inner-view contact]]]) (defview contact-extended-view [{:keys [whisper-identity] :as contact} info click-handler more-click-handler] diff --git a/src/status_im/contacts/views/contact_list.cljs b/src/status_im/contacts/views/contact_list.cljs index 0b4638cf5b..069cb6f531 100644 --- a/src/status_im/contacts/views/contact_list.cljs +++ b/src/status_im/contacts/views/contact_list.cljs @@ -6,50 +6,68 @@ touchable-highlight list-view list-item]] - [status-im.contacts.views.contact :refer [contact-with-letter-view on-press]] + [status-im.contacts.views.contact :refer [contact-view on-press]] [status-im.components.status-bar :refer [status-bar]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] + [status-im.components.toolbar.styles :refer [toolbar-background1]] [status-im.components.drawer.view :refer [drawer-view open-drawer]] - [status-im.components.styles :refer [color-blue - hamburger-icon - icon-search - create-icon - toolbar-background1]] + [status-im.components.styles :refer [icon-search]] [status-im.contacts.styles :as st] [status-im.utils.listview :as lw] [status-im.i18n :refer [label]] - [status-im.components.styles :as cst])) + [status-im.utils.platform :refer [platform-specific]])) + +(defn new-group-chat-view [] + [touchable-highlight + {:on-press #(dispatch [:navigate-to :new-group])} + [view st/contact-container + [view st/option-inner-container + [view st/option-inner + [image {:source {:uri :icon_menu_group} + :style st/option-inner-image}]] + [view st/info-container + [text {:style st/name-text} + (label :t/new-group-chat)]]]]]) (defn render-row [click-handler] (fn [row _ _] - (list-item [contact-with-letter-view row - (or click-handler - (let [whisper-identity (:whisper-identity row)] - (on-press whisper-identity)))]))) + (list-item + [contact-view row + (or click-handler + (let [whisper-identity (:whisper-identity row)] + (on-press whisper-identity)))]))) (defview contact-list-toolbar [] [group [:get :contacts-group]] [view [status-bar] [toolbar {:title (label (if (= group :dapps) - :t/contacs-group-dapps - :t/contacs-group-people)) + :t/contacts-group-dapps + :t/contacts-group-new-chat)) :background-color toolbar-background1 - :action {:image {:source {:uri :icon_search} - :style icon-search} - :handler (fn [])}}]]) + :style (get-in platform-specific [:component-styles :toolbar]) + :actions [{:image {:source {:uri :icon_search} + :style icon-search} + :handler (fn [])}]}]]) (defview contact-list [] [contacts [:contacts-with-letters] + group [:get :contacts-group] click-handler [:get :contacts-click-handler]] - (let [click-handler click-handler] + (let [show-new-group-chat? (and (= group :people) + (get-in platform-specific [:chats :new-chat-in-toolbar?]))] [drawer-view [view st/contacts-list-container [contact-list-toolbar] - ;; todo what if there is no contacts, should we show some information - ;; about this? + ;; todo add stub (when contacts [list-view {:dataSource (lw/to-datasource contacts) :enableEmptySections true :renderRow (render-row click-handler) + :renderHeader #(list-item + [view + (if show-new-group-chat? + [new-group-chat-view]) + [view st/spacing-top]]) + :renderFooter #(list-item [view st/spacing-bottom]) :style st/contacts-list}])]])) diff --git a/src/status_im/contacts/views/new_contact.cljs b/src/status_im/contacts/views/new_contact.cljs index b92f7edc20..71a35d953e 100644 --- a/src/status_im/contacts/views/new_contact.cljs +++ b/src/status_im/contacts/views/new_contact.cljs @@ -11,19 +11,14 @@ [status-im.components.text-field.view :refer [text-field]] [status-im.utils.identicon :refer [identicon]] [status-im.components.status-bar :refer [status-bar]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] + [status-im.components.toolbar.styles :refer [toolbar-title-container + toolbar-title-text]] [status-im.utils.utils :refer [log http-post]] - [status-im.components.styles :refer [color-purple - color-white - icon-search + [status-im.components.styles :refer [icon-search icon-back - icon-qr - toolbar-background1 - toolbar-title-container - toolbar-title-text button-input-container - button-input - form-text-input]] + button-input]] [status-im.qr-scanner.views.scan-button :refer [scan-button]] [status-im.i18n :refer [label]] [cljs.spec :as s] @@ -68,14 +63,14 @@ :else error)) -(defn toolbar-action [new-contact-identity account error] +(defn toolbar-actions [new-contact-identity account error] (let [error-message (validation-error-message new-contact-identity account error)] - {:image {:source {:uri (if (str/blank? error-message) - :icon_ok_blue - :icon_ok_disabled)} - :style icon-search} - :handler #(when (str/blank? error-message) - (on-add-contact new-contact-identity))})) + [{:image {:source {:uri (if (str/blank? error-message) + :icon_ok_blue + :icon_ok_disabled)} + :style icon-search} + :handler #(when (str/blank? error-message) + (on-add-contact new-contact-identity))}])) (defview contact-whisper-id-input [whisper-identity error] [current-account [:get-current-account]] @@ -108,7 +103,7 @@ :style icon-back} :handler #(dispatch [:navigate-back])} :custom-content toolbar-title - :action (toolbar-action new-contact-identity account error)}]] + :actions (toolbar-actions new-contact-identity accounts error)}]] [view st/form-container [contact-whisper-id-input new-contact-identity error]] [view st/address-explication-container diff --git a/src/status_im/discovery/screen.cljs b/src/status_im/discovery/screen.cljs index e409baed0b..d5bf5d6d84 100644 --- a/src/status_im/discovery/screen.cljs +++ b/src/status_im/discovery/screen.cljs @@ -7,7 +7,7 @@ scroll-view text text-input]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] [status-im.components.drawer.view :refer [open-drawer]] [status-im.discovery.views.popular :refer [discovery-popular]] [status-im.discovery.views.recent :refer [discovery-recent]] @@ -45,9 +45,9 @@ :style st/hamburger-icon} :handler open-drawer} :custom-content [title-content show-search?] - :action {:image {:source {:uri :icon_search} - :style st/search-icon} - :handler #(toogle-search show-search?)}}]) + :actions [{:image {:source {:uri :icon_search} + :style st/search-icon} + :handler #(toogle-search show-search?)}]}]) (defview discovery [] [show-search? [:get ::show-search?] diff --git a/src/status_im/discovery/search_results.cljs b/src/status_im/discovery/search_results.cljs index 1eee447aec..dd05f30994 100644 --- a/src/status_im/discovery/search_results.cljs +++ b/src/status_im/discovery/search_results.cljs @@ -3,7 +3,7 @@ (:require [re-frame.core :refer [subscribe dispatch]] [status-im.utils.listview :refer [to-datasource]] [status-im.components.react :refer [view text list-view list-item]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] [status-im.discovery.views.discovery-list-item :refer [discovery-list-item]] [status-im.discovery.styles :as st])) @@ -29,9 +29,9 @@ :style st/icon-back} :handler #(dispatch [:navigate-back])} :custom-content (title-content tags) - :action {:image {:source {:uri :icon_search} - :style st/icon-search} - :handler (fn [])}}] + :actions [{:image {:source {:uri :icon_search} + :style st/icon-search} + :handler (fn [])}]}] [list-view {:dataSource datasource :renderRow (fn [row _ _] diff --git a/src/status_im/discovery/styles.cljs b/src/status_im/discovery/styles.cljs index 09868c7e73..8876e16452 100644 --- a/src/status_im/discovery/styles.cljs +++ b/src/status_im/discovery/styles.cljs @@ -1,13 +1,5 @@ (ns status-im.discovery.styles - (:require [status-im.components.styles :refer [color-white - color-gray2 - chat-background - online-color - selected-message-color - separator-color - text1-color - text2-color - toolbar-background1]])) + (:require [status-im.components.styles :refer [color-gray2]])) ;; common diff --git a/src/status_im/discovery/tag.cljs b/src/status_im/discovery/tag.cljs index 692236124e..5d9c5be2f3 100644 --- a/src/status_im/discovery/tag.cljs +++ b/src/status_im/discovery/tag.cljs @@ -3,7 +3,7 @@ (:require [re-frame.core :refer [subscribe dispatch]] [status-im.utils.listview :refer [to-datasource]] [status-im.components.react :refer [view text list-view list-item]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] [status-im.discovery.views.discovery-list-item :refer [discovery-list-item]] [status-im.discovery.styles :as st])) @@ -25,9 +25,9 @@ :style st/icon-back} :handler #(dispatch [:navigate-back])} :custom-content (title-content tag) - :action {:image {:source {:uri :icon_search} - :style st/icon-search} - :handler (fn [])}}] + :actions [{:image {:source {:uri :icon_search} + :style st/icon-search} + :handler (fn [])}]}] [list-view {:dataSource datasource :renderRow (fn [row _ _] diff --git a/src/status_im/group_settings/screen.cljs b/src/status_im/group_settings/screen.cljs index 5087960d9a..71c89efaf1 100644 --- a/src/status_im/group_settings/screen.cljs +++ b/src/status_im/group_settings/screen.cljs @@ -12,7 +12,7 @@ scroll-view touchable-highlight]] [status-im.components.status-bar :refer [status-bar]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] [status-im.components.chat-icon.screen :refer [chat-icon-view-action]] [status-im.group-settings.styles.group-settings :as st] [status-im.group-settings.views.member :refer [member-view]] diff --git a/src/status_im/group_settings/styles/group_settings.cljs b/src/status_im/group_settings/styles/group_settings.cljs index f951648497..3e98cf9547 100644 --- a/src/status_im/group_settings/styles/group_settings.cljs +++ b/src/status_im/group_settings/styles/group_settings.cljs @@ -1,13 +1,9 @@ (ns status-im.group-settings.styles.group-settings (:require [status-im.components.styles :refer [color-white color-purple - chat-background - online-color - selected-message-color separator-color text1-color - text2-color - toolbar-background1]])) + text2-color]])) (def modal-container {:flex 1 diff --git a/src/status_im/ios/platform.cljs b/src/status_im/ios/platform.cljs index fff7bd6f9d..69385cf29e 100644 --- a/src/status_im/ios/platform.cljs +++ b/src/status_im/ios/platform.cljs @@ -1,6 +1,7 @@ (ns status-im.ios.platform (:require [status-im.components.styles :as styles] - [status-im.utils.utils :as u])) + [status-im.utils.utils :as u] + [status-im.components.toolbar.styles :refer [toolbar-background2]])) (def component-styles {:status-bar {:default {:height 20 @@ -8,7 +9,7 @@ :color styles/color-white} :main {:height 20 :bar-style "default" - :color styles/toolbar-background2} + :color toolbar-background2} :transparent {:height 20 :bar-style "light-content" :color styles/color-transparent}} @@ -43,5 +44,9 @@ (def platform-specific {:component-styles component-styles :fonts fonts - :list-selection-fn show-action-sheet}) + :list-selection-fn show-action-sheet + :chats {:action-button? false + :new-chat-in-toolbar? true} + :contacts {:action-button? false + :new-contact-in-toolbar? true}}) diff --git a/src/status_im/new_group/screen.cljs b/src/status_im/new_group/screen.cljs index a5387ba7cc..127b595e05 100644 --- a/src/status_im/new_group/screen.cljs +++ b/src/status_im/new_group/screen.cljs @@ -13,7 +13,7 @@ [status-im.components.text-field.view :refer [text-field]] [status-im.components.styles :refer [color-purple]] [status-im.components.status-bar :refer [status-bar]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] [status-im.utils.listview :refer [to-datasource]] [status-im.new-group.views.contact :refer [new-group-contact]] [status-im.new-group.styles :as st] @@ -27,11 +27,11 @@ [view [status-bar] [toolbar - {:title (label :t/new-group-chat) - :action {:image {:source res/v ;; {:uri "icon_search"} - :style (st/toolbar-icon create-btn-enabled?)} - :handler (when create-btn-enabled? - #(dispatch [:create-new-group new-chat-name]))}}]])) + {:title (label :t/new-group-chat) + :actions [{:image {:source res/v ;; {:uri "icon_search"} + :style (st/toolbar-icon create-btn-enabled?)} + :handler (when create-btn-enabled? + #(dispatch [:create-new-group new-chat-name]))}]}]])) (defview group-name-input [] [new-chat-name [:get :new-chat-name]] diff --git a/src/status_im/new_group/styles.cljs b/src/status_im/new_group/styles.cljs index 4a88eef183..e18311b155 100644 --- a/src/status_im/new_group/styles.cljs +++ b/src/status_im/new_group/styles.cljs @@ -2,8 +2,7 @@ (:require [status-im.components.styles :refer [color-white color-blue text1-color - text2-color - toolbar-background1]])) + text2-color]])) (defn toolbar-icon [enabled?] {:width 20 diff --git a/src/status_im/participants/views/add.cljs b/src/status_im/participants/views/add.cljs index 59ceb2ad68..2ed209da3e 100644 --- a/src/status_im/participants/views/add.cljs +++ b/src/status_im/participants/views/add.cljs @@ -4,7 +4,7 @@ [status-im.resources :as res] [status-im.components.react :refer [view list-view list-item]] [status-im.components.status-bar :refer [status-bar]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] [status-im.utils.listview :refer [to-datasource]] [status-im.participants.views.contact :refer [participant-contact]] [reagent.core :as r] @@ -16,11 +16,11 @@ [view [status-bar] [toolbar - {:title (label :t/add-participants) - :action {:image {:source res/v ;; {:uri "icon_search"} - :style st/new-participant-image} - :handler #(do (dispatch [:add-new-participants]) - (dispatch [:navigate-back]))}}]]) + {:title (label :t/add-participants) + :actions [{:image {:source res/v ;; {:uri "icon_search"} + :style st/new-participant-image} + :handler #(do (dispatch [:add-new-participants]) + (dispatch [:navigate-back]))}]}]]) (defn new-participants-row [row _ _] diff --git a/src/status_im/participants/views/remove.cljs b/src/status_im/participants/views/remove.cljs index 5a2ab1ce0d..730cd84b51 100644 --- a/src/status_im/participants/views/remove.cljs +++ b/src/status_im/participants/views/remove.cljs @@ -10,7 +10,7 @@ list-view list-item]] [status-im.components.status-bar :refer [status-bar]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] [status-im.utils.listview :refer [to-datasource]] [status-im.participants.views.contact :refer [participant-contact]] @@ -23,11 +23,11 @@ [view [status-bar] [toolbar - {:title (label :t/remove-participants) - :action {:handler #(do (dispatch [:remove-participants]) - (dispatch [:navigate-back])) - :image {:source res/trash-icon ;; {:uri "icon_search"} - :style st/remove-participants-image}}}]]) + {:title (label :t/remove-participants) + :actions [{:handler #(do (dispatch [:remove-participants]) + (dispatch [:navigate-back])) + :image {:source res/trash-icon ;; {:uri "icon_search"} + :style st/remove-participants-image}}]}]]) (defn remove-participants-row [row _ _] diff --git a/src/status_im/profile/photo_capture/screen.cljs b/src/status_im/profile/photo_capture/screen.cljs index 548d3479d9..d4b524c8db 100644 --- a/src/status_im/profile/photo_capture/screen.cljs +++ b/src/status_im/profile/photo_capture/screen.cljs @@ -8,12 +8,11 @@ [status-im.components.camera :refer [camera aspects capture-targets]] - [status-im.components.styles :refer [toolbar-background1 - icon-search - icon-back]] + [status-im.components.styles :refer [icon-back]] [status-im.components.icons.custom-icons :refer [ion-icon]] [status-im.components.status-bar :refer [status-bar]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] + [status-im.components.toolbar.styles :refer [toolbar-background1]] [status-im.utils.image-processing :refer [img->base64]] [status-im.profile.photo-capture.styles :as st] [status-im.i18n :refer [label]] diff --git a/src/status_im/protocol/handlers.cljs b/src/status_im/protocol/handlers.cljs index ccd2c23b4c..aa56b58a4c 100644 --- a/src/status_im/protocol/handlers.cljs +++ b/src/status_im/protocol/handlers.cljs @@ -210,7 +210,7 @@ status-path (if (and group? (not= status :sent)) [:message-user-statuses message-id' from] [:message-statuses message-id']) - current-status (get-in db status-path)] + {current-status :status} (get-in db status-path)] (if-not (= :seen current-status) (assoc-in db status-path {:whisper-identity from :status status}) diff --git a/src/status_im/qr_scanner/screen.cljs b/src/status_im/qr_scanner/screen.cljs index 69e8421c4e..9aa2d7630e 100644 --- a/src/status_im/qr_scanner/screen.cljs +++ b/src/status_im/qr_scanner/screen.cljs @@ -4,10 +4,10 @@ [status-im.components.react :refer [view image]] [status-im.components.camera :refer [camera]] - [status-im.components.styles :refer [toolbar-background1 - icon-search]] + [status-im.components.styles :refer [icon-search]] [status-im.components.status-bar :refer [status-bar]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] + [status-im.components.toolbar.styles :refer [toolbar-background1]] [status-im.qr-scanner.styles :as st] [status-im.utils.types :refer [json->clj]] [status-im.components.styles :as cst] @@ -18,9 +18,9 @@ [status-bar] [toolbar {:title title :background-color toolbar-background1 - :action {:image {:source {:uri :icon_lock_white} - :style icon-search} - :handler #()}}]]) + :actions [{:image {:source {:uri :icon_lock_white} + :style icon-search} + :handler #()}]}]]) (defview qr-scanner [] [identifier [:get :current-qr-context]] diff --git a/src/status_im/qr_scanner/styles.cljs b/src/status_im/qr_scanner/styles.cljs index 057bf186c8..607f5b7a33 100644 --- a/src/status_im/qr_scanner/styles.cljs +++ b/src/status_im/qr_scanner/styles.cljs @@ -1,6 +1,6 @@ (ns status-im.qr-scanner.styles - (:require [status-im.components.styles :refer [toolbar-height - color-white]])) + (:require [status-im.components.styles :refer [color-white]] + [status-im.components.toolbar.styles :refer [toolbar-height]])) (def barcode-scanner-container {:flex 1 diff --git a/src/status_im/qr_scanner/views/import_button.cljs b/src/status_im/qr_scanner/views/import_button.cljs index a66f17c9b9..3fd20640b7 100644 --- a/src/status_im/qr_scanner/views/import_button.cljs +++ b/src/status_im/qr_scanner/views/import_button.cljs @@ -5,7 +5,6 @@ text image touchable-highlight]] - [status-im.components.toolbar :refer [toolbar]] [status-im.components.styles :refer [icon-qr]] [status-im.i18n :refer [label]] [status-im.qr-scanner.styles :as st])) diff --git a/src/status_im/qr_scanner/views/scan_button.cljs b/src/status_im/qr_scanner/views/scan_button.cljs index 6f5db52c8a..07c15be14f 100644 --- a/src/status_im/qr_scanner/views/scan_button.cljs +++ b/src/status_im/qr_scanner/views/scan_button.cljs @@ -5,7 +5,6 @@ text image touchable-highlight]] - [status-im.components.toolbar :refer [toolbar]] [status-im.components.styles :refer [icon-scan]] [status-im.i18n :refer [label]] [status-im.qr-scanner.styles :as st])) diff --git a/src/status_im/transactions/screen.cljs b/src/status_im/transactions/screen.cljs index b3ce433604..d984d3cb13 100644 --- a/src/status_im/transactions/screen.cljs +++ b/src/status_im/transactions/screen.cljs @@ -9,10 +9,10 @@ touchable-highlight touchable-opacity]] [status-im.components.styles :refer [icon-ok - icon-close - toolbar-title-container]] + icon-close]] [status-im.components.carousel.carousel :refer [carousel]] - [status-im.components.toolbar :refer [toolbar]] + [status-im.components.toolbar.view :refer [toolbar]] + [status-im.components.toolbar.styles :refer [toolbar-title-container]] [status-im.components.text-field.view :refer [text-field]] [status-im.transactions.views.transaction-page :refer [transaction-page]] [status-im.transactions.styles :as st] @@ -33,11 +33,11 @@ :custom-content [view {:style toolbar-title-container} [text {:style st/toolbar-title-text} (label-pluralize (count transactions) :t/confirm-transactions)]] - :action {:image {:source {:uri (if-not (s/blank? password) - :icon_ok - :icon_ok_disabled_inversed)} - :style icon-ok} - :handler #(dispatch [:accept-transactions password])}}] + :actions [{:image {:source {:uri (if-not (s/blank? password) + :icon_ok + :icon_ok_disabled_inversed)} + :style icon-ok} + :handler #(dispatch [:accept-transactions password])}]}] [view st/carousel-container [carousel {:pageStyle st/carousel-page-style :gap 16 diff --git a/src/status_im/transactions/styles.cljs b/src/status_im/transactions/styles.cljs index cc0b3704d0..dba9767d2f 100644 --- a/src/status_im/transactions/styles.cljs +++ b/src/status_im/transactions/styles.cljs @@ -1,7 +1,4 @@ -(ns status-im.transactions.styles - (:require [status-im.components.styles :refer [toolbar-height - color-white]])) - +(ns status-im.transactions.styles) (def transactions-screen {:flex 1 diff --git a/src/status_im/translations/en.cljs b/src/status_im/translations/en.cljs index 305c2202ae..7d981febbd 100644 --- a/src/status_im/translations/en.cljs +++ b/src/status_im/translations/en.cljs @@ -17,12 +17,16 @@ :is-typing "is typing" :and-you "and you" :search-chat "Search chat" - :members {:one "1 member, 1 active" + :members {:one "1 member" + :other "{{count}} members" + :zero "no members"} + :members-active {:one "1 member, 1 active" :other "{{count}} members, {{count}} active" :zero "no members"} :active-online "online" :active-unknown "unknown" :available "available" + :no-messages "No messages" ;messages :status-sending "Sending" @@ -84,8 +88,8 @@ ;chats :chats "Chats" - :new-chat "New Chat" - :new-group-chat "New Group Chat" + :new-chat "New chat" + :new-group-chat "New group chat" ;discover :discovery "Discovery" @@ -101,8 +105,9 @@ :contacts "Contacts" :new-contact "New Contact" :show-all "SHOW ALL" - :contacs-group-dapps "Dapps" - :contacs-group-people "People" + :contacts-group-dapps "Dapps" + :contacts-group-people "People" + :contacts-group-new-chat "Start new chat" :no-contacts "No contacts yet" ;group-settings @@ -194,6 +199,4 @@ :recipient "Recipient" :one-more-item "One more item" :fee "Fee" - :value "Value" - - }) + :value "Value"})