status-im
/
status-react
mirror of https://github.com/status-im/status-react.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Add remove-chat button next to chat title 

Update chat header design

Aligh header heights

Add 'Clear history'; some reformatting

Add confirmations

Formatting

Member photo fix; increase font size for 9+ unviewed messages indicator

Fix chat view autoloading upon tab switching; Merge with desktop

Fix add-to-contacts
This commit is contained in:
Vitaliy Vlasov 2018-06-05 13:51:30 +03:00
parent a7f9390fee
commit 88740eaf52
No known key found for this signature in database
GPG Key ID: A7D57C347F2B2964
11 changed files with 130 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
components/src/status_im/ui/components/react.cljs
View File

@ -76,7 +76,6 @@
(dissoc :font)
(assoc style-key (merge style font)))))
(defn transform-to-uppercase [{:keys [uppercase? force-uppercase?] :as opts} ts]
(if (or force-uppercase? (and uppercase? platform/android?))
(vec (map string/upper-case ts))
@ -95,13 +94,13 @@
:or {font :default}} text]
(let [font (get-in platform/platform-specific [:fonts (keyword font)])]
[text-input-class (merge
{:underline-color-android :transparent
:placeholder-text-color styles/text2-color
:placeholder (i18n/label :t/type-a-message)
:value text}
(-> opts
(dissoc :font)
(assoc :style (merge style font))))]))
{:underline-color-android :transparent
:placeholder-text-color styles/text2-color
:placeholder (i18n/label :t/type-a-message)
:value text}
(-> opts
(dissoc :font)
(assoc :style (merge style font))))]))
(defn i18n-text
[{:keys [style key]}]
@ -122,9 +121,9 @@
content])
(defn touchable-without-feedback [props content]
[touchable-without-feedback-class
props
content])
[touchable-without-feedback-class
props
content])
(defn get-dimensions [name]
(js->clj (.get dimensions name) :keywordize-keys true))
@ -245,20 +244,20 @@
(:qr-viewer
:recipient-qr-code) "#2f3031"
(:accounts :login
:wallet-transactions-filter) styles/color-white
:wallet-transactions-filter) styles/color-white
:transparent)})
children (cond-> children
(#{:wallet
:recent-recipients
:wallet-send-assets
:wallet-request-assets} current-view)
(conj [view {:background-color styles/color-white
:position :absolute
:bottom 0
:right 0
:left 0
:height 100
:z-index -1000}]))]
(#{:wallet
:recent-recipients
:wallet-send-assets
:wallet-request-assets} current-view)
(conj [view {:background-color styles/color-white
:position :absolute
:bottom 0
:right 0
:left 0
:height 100
:z-index -1000}]))]
(apply vector safe-area-view props children))))
(defmethod create-main-screen-view :default [_]

24
components/src/status_im/ui/components/svg.clj
View File

@ -27,15 +27,15 @@
`(fn [~color]
~(into []
(clojure.walk/postwalk-replace
{:viewbox :viewBox} ;; See https://github.com/jhy/jsoup/issues/272
(clojure.walk/prewalk
(fn [node]
(if (svg-tags node)
(symbol (name node))
(if (vector? node)
(let [[k v] node]
(if (and (= :fill k) v)
[k color]
node))
node)))
svg-hiccup))))))
{:viewbox :viewBox} ;; See https://github.com/jhy/jsoup/issues/272
(clojure.walk/prewalk
(fn [node]
(if (svg-tags node)
(symbol (name node))
(if (vector? node)
(let [[k v] node]
(if (and (= :fill k) v)
[k color]
node))
node)))
svg-hiccup))))))

1
env/dev/env/config.cljs vendored
View File

@ -1,6 +1,5 @@
(ns env.config)
(def figwheel-urls {:android "ws://192.168.10.203:3449/figwheel-ws",
:ios "ws://localhost:3449/figwheel-ws",
:desktop "ws://localhost:3449/figwheel-ws"})

10
env/dev/env/utils.cljs vendored
View File

@ -6,11 +6,11 @@
Returns host or an empty string upon failure"
[url]
(->
url
(string/split #"/")
(get 2 "")
(string/split #":")
(get 0 "")))
url
(string/split #"/")
(get 2 "")
(string/split #":")
(get 0 "")))
(defn re-frisk-url
"Expects the input url to be in the form ws://host:port/figwheel-ws"

1
src/status_im/translations/en.cljs
View File

@ -244,6 +244,7 @@
:group-info "Group info"
:delete-chat-confirmation "Are you sure you want to delete this chat?"
:delete-group-chat-confirmation "Are you sure you want to delete this group chat?"
:delete-chat-action "Delete"
:new-group-chat "New group chat"
:new-public-group-chat "Join public chat"
:selected-for-you "Selected for you"

3
src/status_im/ui/components/desktop/events.cljs
View File

@ -5,4 +5,5 @@
(handlers/register-handler-fx
:show-desktop-tab
(fn [{:keys [db] :as cofx} [_ tab-name]]
{:db (assoc-in db [:desktop/desktop :tab-view-id] tab-name)}))
{:db (assoc-in db [:desktop/desktop :tab-view-id] tab-name)
:dispatch [:navigate-to (if (= tab-name :home) :chat :home)]}))

4
src/status_im/ui/components/desktop/tabs.cljs
View File

@ -39,9 +39,7 @@
(defn tab [index content view-id active?]
[react/touchable-highlight {:style (merge tabs.styles/tab-container {:flex 1})
:disabled active?
:on-press #(do
(re-frame/dispatch [:navigate-to :home])
(re-frame/dispatch [:show-desktop-tab view-id]))}
:on-press #(re-frame/dispatch [:show-desktop-tab view-id])}
[react/view
[content active?]]])

54
src/status_im/ui/screens/desktop/main/chat/styles.cljs
View File

@ -74,41 +74,43 @@
:height 40
:margin-right 8})
(def photo-style-toolbar
{:border-radius 32
:width 32
:height 32
:margin-right 8})
(def chat-icon
{:width 34
:border-radius 34
:height 34
:margin-right 12})
(defn topic-image [color]
(merge photo-style-toolbar
(merge chat-icon
{:background-color color
:align-items :center
:justify-content :center}))
(def topic-text
{:font-size 18
{:font-size 18.7
:color colors/white})
(def toolbar-chat-view
{:margin-left 11
:justify-content :center})
(def toolbar-chat-name
{:font-size 16
:color :black
:font-weight "300"})
(def add-contact
{:background-color :white
:border-radius 6
:margin-top 3
:padding-top 1})
{:align-items :center
:padding-vertical 17
:padding-horizontal 24
:height 68
:flex-direction :row
:justify-content :space-between})
(def add-contact-text
{:font-size 14
{:font-size 12
:color colors/blue})
(def public-chat-text
{:font-size 12
:color colors/gray})
(defn profile-actions-text [color]
{:font-size 12
:color color
:margin-bottom 4})
(def message-text
{:font-size 14})
@ -169,3 +171,13 @@
{:color colors/gray
:margin-top 10
:margin-bottom 5})
(defn chat-title-and-type [pending?]
{:flex 1
:justify-content (if pending? :flex-start :center)})
(def chat-title
{:margin-bottom 4
:font-size 14
:color colors/black
:font-weight "600"})

79
src/status_im/ui/screens/desktop/main/chat/views.cljs
View File

@ -1,3 +1,4 @@
(ns status-im.ui.screens.desktop.main.chat.views
(:require-macros [status-im.utils.views :as views])
(:require [re-frame.core :as re-frame]
@ -10,6 +11,7 @@
[status-im.constants :as constants]
[status-im.utils.identicon :as identicon]
[status-im.utils.datetime :as time]
[status-im.utils.utils :as utils]
[status-im.ui.components.react :as react]
[status-im.ui.components.colors :as colors]
[status-im.chat.views.message.datemark :as message.datemark]
@ -18,35 +20,50 @@
[status-im.ui.screens.desktop.main.chat.styles :as styles]
[status-im.i18n :as i18n]))
(views/defview toolbar-chat-view []
(views/letsubs [{:keys [chat-id public-key public? group-chat color]} [:get-current-chat]
{:keys [pending? whisper-identity photo-path]} [:get-current-chat-contact]
current-chat-name [:get-current-chat-name]]
(views/defview toolbar-chat-view [{:keys [chat-id color public-key public? group-chat]
:as current-chat}]
(views/letsubs [photo-path [:get-chat-photo chat-id]
chat-name [:get-current-chat-name]
{:keys [pending? whisper-identity]} [:get-current-chat-contact]]
[react/view {:style styles/toolbar-chat-view}
[react/view {:style {:flex-direction :row
:align-items :center}}
[react/view {:style styles/img-container}
(if public?
[react/view {:style (styles/topic-image color)}
[react/text {:style styles/topic-text}
(string/capitalize (first current-chat-name))]]
[react/image {:style styles/photo-style-toolbar
:source {:uri photo-path}}])]
[react/view
[react/text {:style styles/toolbar-chat-name} current-chat-name]
(when pending?
[react/touchable-highlight
{:on-press #(re-frame/dispatch [:add-contact whisper-identity])}
[react/view {:style styles/add-contact}
[react/text {:style styles/add-contact-text}
(i18n/label :t/add-to-contacts)]]])]
[react/view {:style {:flex-direction :row
:flex 1}}
(if public?
[react/view {:style (styles/topic-image color)}
[react/text {:style styles/topic-text}
(string/capitalize (second chat-name))]]
[react/image {:style styles/chat-icon
:source {:uri photo-path}}])
[react/view {:style (styles/chat-title-and-type pending?)}
[react/text {:style styles/chat-title}
chat-name]
(cond pending?
[react/text {:style styles/add-contact-text
:on-press #(re-frame/dispatch [:add-contact whisper-identity])}
(i18n/label :t/add-to-contacts)]
public?
[react/text {:style styles/public-chat-text}
(i18n/label :t/public-chat)])]]
[react/view
(when (and (not group-chat) (not public?))
[react/text {:style {:position :absolute
:right 20}
[react/text {:style (styles/profile-actions-text colors/black)
:on-press #(re-frame/dispatch [:navigate-to :chat-profile])}
(i18n/label :t/view-profile)])]]))
(i18n/label :t/view-profile)])
[react/text {:style (styles/profile-actions-text colors/red)
:on-press (fn []
(utils/show-confirmation (i18n/label :clear-history-confirmation)
""
(i18n/label :clear-history-action)
#(re-frame/dispatch [:clear-history])))}
(i18n/label :t/clear-history)]
[react/text {:style (styles/profile-actions-text colors/red)
:on-press (fn []
(utils/show-confirmation (i18n/label :delete-chat-confirmation)
""
(i18n/label :delete-chat-action)
#(re-frame/dispatch [:remove-chat-and-navigate-home chat-id])))}
(i18n/label :t/delete-chat)]]]))
(views/defview message-author-name [{:keys [outgoing from] :as message}]
(views/letsubs [current-account [:get-current-account]
@ -56,9 +73,11 @@
[react/text {:style styles/author} name]])))
(views/defview member-photo [from]
[react/view
[react/image {:source {:uri (identicon/identicon from)}
:style styles/photo-style}]])
(letsubs [photo-path [:get-photo-path from]]
[react/image {:source {:uri (if (string/blank? photo-path)
(identicon/identicon from)
photo-path)}
:style styles/photo-style}]))
(views/defview my-photo [from]
(views/letsubs [account [:get-current-account]]
@ -188,7 +207,7 @@
(views/defview chat-view []
(views/letsubs [current-chat [:get-current-chat]]
[react/view {:style styles/chat-view}
[toolbar-chat-view]
[toolbar-chat-view current-chat]
[messages-view current-chat]
[chat-text-input]]))

4
src/status_im/ui/screens/desktop/main/tabs/home/styles.cljs
View File

@ -16,6 +16,7 @@
(def chat-list-header
{:flex-direction :row
:align-items :center
:height 68
:padding 11})
(def img-container
@ -41,7 +42,7 @@
(defn unread-messages-text [large?]
{:color colors/white
:font-size (if large? 10 12)})
:font-size (if large? 11 12)})
(def chat-list-separator
{:height 1
@ -49,6 +50,7 @@
(def chat-name-box
{:flex-direction :row
:flex 1
:align-items :center})
(def chat-name-last-msg-box

4
src/status_im/ui/screens/desktop/main/tabs/home/views.cljs
View File

@ -26,8 +26,8 @@
last-message [:get-last-message chat-id]]
(let [name (or chat-name
(gfycat/generate-gfy public-key))
[unviewed-messages-label large?] (if (< 99 unviewed-messages-count)
["99+" true]
[unviewed-messages-label large?] (if (< 9 unviewed-messages-count)
["9+" true]
[unviewed-messages-count false])]
[react/view {:style (styles/chat-list-item (= current-chat-id chat-id))}
[react/view {:style styles/img-container}