mirror of
https://github.com/status-im/status-react.git
synced 2025-02-28 02:20:50 +00:00
refactor chat actions view
This commit is contained in:
parent
28355ca3c5
commit
3f2416fafd
@ -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)))}
|
[react/view {:accessibility-label accessibility-label
|
||||||
[view {:accessibility-label accessibility-label
|
:style styles/action-icon-row}
|
||||||
:style st/action-icon-row}
|
[react/view styles/action-icon-view
|
||||||
[view st/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]])
|
||||||
|
Loading…
x
Reference in New Issue
Block a user