refactor chat actions view

This commit is contained in:
Eric Dvorsak 2017-09-25 12:46:31 +02:00 committed by Roman Volosovskyi
parent 28355ca3c5
commit 3f2416fafd

View File

@ -1,16 +1,12 @@
(ns status-im.chat.views.actions (ns status-im.chat.views.actions
(:require-macros [status-im.utils.views :refer [defview letsubs]]) (:require [clojure.string :as string]
(:require [re-frame.core :refer [subscribe dispatch]] [re-frame.core :as re-frame]
[clojure.string :as s] [status-im.chat.styles.screen :as styles]
[status-im.components.react :refer [view [status-im.components.chat-icon.screen :as chat-icon.screen]
animated-view [status-im.components.react :as react]
text [status-im.i18n :as i18n]
icon [status-im.utils.platform :as platform])
touchable-highlight]] (:require-macros [status-im.utils.views :refer [defview letsubs]]))
[status-im.components.chat-icon.screen :refer [chat-icon-view-menu-item]]
[status-im.chat.styles.screen :as st]
[status-im.i18n :refer [label label-pluralize]]
[status-im.utils.platform :refer [platform-specific]]))
(defview menu-item-icon-profile [] (defview menu-item-icon-profile []
[chat-id [:chat :chat-id] [chat-id [:chat :chat-id]
@ -18,15 +14,15 @@
name [:chat :name] name [:chat :name]
color [:chat :color]] color [:chat :color]]
;; TODO stub data ('online' property) ;; TODO stub data ('online' property)
[chat-icon-view-menu-item chat-id group-chat name color true]) [chat-icon.screen/chat-icon-view-menu-item chat-id group-chat name color true])
(defn- members-text [members] (defn- members-text [members]
(str (s/join ", " (map :name members)) (str (string/join ", " (map :name members))
" " " "
(label :t/and-you))) (i18n/label :t/and-you)))
(defn item-members [members] (defn item-members [members]
{:title (label :t/members-title) {:title (i18n/label :t/members-title)
:subtitle (members-text members) :subtitle (members-text members)
:icon :menu_group :icon :menu_group
:icon-opts {:width 25 :icon-opts {:width 25
@ -35,16 +31,16 @@
:handler nil}) :handler nil})
(defn item-user [chat-id] (defn item-user [chat-id]
{:title (label :t/profile) {:title (i18n/label :t/profile)
:custom-icon [menu-item-icon-profile] :custom-icon [menu-item-icon-profile]
:icon :menu_group :icon :menu_group
:icon-style {:width 25 :icon-style {:width 25
:height 19} :height 19}
:handler #(dispatch [:show-profile chat-id])}) :handler #(re-frame/dispatch [:show-profile chat-id])})
(def item-search (def item-search
{:title (label :t/search-chat) {:title (i18n/label :t/search-chat)
:subtitle (label :t/not-implemented) :subtitle (i18n/label :t/not-implemented)
:icon :search_gray_copy :icon :search_gray_copy
:icon-style {:width 17 :icon-style {:width 17
:height 17} :height 17}
@ -52,8 +48,8 @@
:handler nil}) :handler nil})
(def item-notifications (def item-notifications
{:title (label :t/notifications-title) {:title (i18n/label :t/notifications-title)
:subtitle (label :t/not-implemented) :subtitle (i18n/label :t/not-implemented)
;;:subtitle "Chat muted" ;;:subtitle "Chat muted"
:icon :muted :icon :muted
:icon-style {:width 18 :icon-style {:width 18
@ -62,11 +58,12 @@
:handler nil}) :handler nil})
(def item-settings (def item-settings
{:title (label :t/settings) {:title (i18n/label :t/settings)
:icon :settings :icon :settings
:icon-style {:width 20 :icon-style {:width 20
:height 13} :height 13}
:handler #(dispatch [:show-group-chat-settings])}) :accessibility-label :settings
:handler #(re-frame/dispatch [:show-group-chat-settings])})
(defn group-chat-items [members public?] (defn group-chat-items [members public?]
(into (if public? [] [(item-members members)]) (into (if public? [] [(item-members members)])
@ -80,58 +77,58 @@
item-notifications]) item-notifications])
(defn overlay [{:keys [on-click-outside]} items] (defn overlay [{:keys [on-click-outside]} items]
[view st/actions-overlay [react/view styles/actions-overlay
[touchable-highlight {:on-press on-click-outside [react/touchable-highlight {:on-press on-click-outside
:style st/overlay-highlight} :style styles/overlay-highlight}
[view nil]] [react/view nil]]
items]) items])
(defn action-view [{:keys [icon-style (defn action-view [{:keys [react/icon-style
icon
custom-icon custom-icon
handler handler
title title
subtitle subtitle
accessibility-label] accessibility-label]
:or {accessibility-label :action} :or {accessibility-label :action}}]
icon-name :icon}] [react/touchable-highlight {:on-press (fn []
[touchable-highlight {:on-press (fn [] (re-frame/dispatch [:set-chat-ui-props {:show-actions? false}])
(dispatch [:set-chat-ui-props {:show-actions? false}])
(when handler (when handler
(handler)))} (handler)))}
[view {:accessibility-label accessibility-label [react/view {:accessibility-label accessibility-label
:style st/action-icon-row} :style styles/action-icon-row}
[view st/action-icon-view [react/view styles/action-icon-view
(or custom-icon (or custom-icon
[icon icon-name icon-style]) [react/icon icon icon-style])]
[view st/action-view [react/view styles/action-view
[text {:style st/action-title [react/text {:style styles/action-title
:number-of-lines 1 :number-of-lines 1
:font :medium} :font :medium}
title] title]
(when-let [subtitle subtitle] (when-let [subtitle subtitle]
[text {:style st/action-subtitle [react/text {:style styles/action-subtitle
:number-of-lines 1 :number-of-lines 1
:font :default} :font :default}
subtitle])]]]]) subtitle])]]])
(defview actions-list-view [] (defview actions-list-view []
(letsubs [group-chat [:chat :group-chat] (letsubs [group-chat [:chat :group-chat]
chat-id [:chat :chat-id] chat-id [:chat :chat-id]
public? [:chat :public?] public? [:chat :public?]
members [:current-chat-contacts] members [:current-chat-contacts]
status-bar-height (get-in platform-specific [:component-styles :status-bar :default :height])] status-bar-height (get-in platform/platform-specific [:component-styles :status-bar :default :height])]
(when-let [actions (if group-chat (when-let [actions (if group-chat
(group-chat-items members public?) (group-chat-items members public?)
(user-chat-items chat-id))] (user-chat-items chat-id))]
[view (merge [react/view (merge
(st/actions-wrapper status-bar-height) (styles/actions-wrapper status-bar-height)
(get-in platform-specific [:component-styles :actions-list-view])) (get-in platform/platform-specific [:component-styles :actions-list-view]))
[view st/actions-separator] [react/view styles/actions-separator]
[view st/actions-view [react/view styles/actions-view
(for [action actions] (for [action actions]
(if action (if action
^{:key action} [action-view action]))]]))) ^{:key action} [action-view action]))]])))
(defn actions-view [] (defn actions-view []
[overlay {:on-click-outside #(dispatch [:set-chat-ui-props {:show-actions? false}])} [overlay {:on-click-outside #(re-frame/dispatch [:set-chat-ui-props {:show-actions? false}])}
[actions-list-view]]) [actions-list-view]])