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

[7715] Feature: Contextual bottom sheet on long press 

Signed-off-by: Andrey Shovkoplyas <motor4ik@gmail.com>
This commit is contained in:
bitsikka 2019-05-15 02:24:40 +05:45 committed by Andrey Shovkoplyas
parent aa7292d757
commit 4f8399a8fd
No known key found for this signature in database
GPG Key ID: EAAB7C8622D860A4
11 changed files with 118 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/status_im/events.cljs
View File

@ -2038,10 +2038,11 @@
;; bottom-sheet events
(handlers/register-handler-fx
:bottom-sheet/show-sheet
(fn [cofx [_ view]]
(fn [cofx [_ view options]]
(bottom-sheet/show-bottom-sheet
cofx
{:view view})))
{:view view
:options options})))
(handlers/register-handler-fx
:bottom-sheet/hide-sheet

1
src/status_im/subs.cljs
View File

@ -52,6 +52,7 @@
;;bottom sheet
(reg-root-key-sub :bottom-sheet/show? :bottom-sheet/show?)
(reg-root-key-sub :bottom-sheet/view :bottom-sheet/view)
(reg-root-key-sub :bottom-sheet/options :bottom-sheet/options)
;;general
(reg-root-key-sub :network-name :chain)

1
src/status_im/ui/components/bottom_sheet/db.cljs
View File

@ -3,3 +3,4 @@
(spec/def :bottom-sheet/show? (spec/nilable boolean?))
(spec/def :bottom-sheet/view (spec/nilable keyword?))
(spec/def :bottom-sheet/options (spec/nilable map?))

5
src/status_im/ui/components/bottom_sheet/events.cljs
View File

@ -3,10 +3,11 @@
[status-im.utils.handlers :as handlers]))
(fx/defn show-bottom-sheet
[{:keys [db]} {:keys [view]}]
[{:keys [db]} {:keys [view options]}]
{:db (assoc db
:bottom-sheet/show? true
:bottom-sheet/view view)})
:bottom-sheet/view view
:bottom-sheet/options options)})
(fx/defn hide-bottom-sheet
[{:keys [db]}]

1
src/status_im/ui/screens/db.cljs
View File

@ -274,6 +274,7 @@
:stickers/packs-pendning
:bottom-sheet/show?
:bottom-sheet/view
:bottom-sheet/options
:extensions/profile
:wallet/custom-token-screen]
:opt-un [::modal

5
src/status_im/ui/screens/group/chat_settings/events.cljs
View File

@ -11,8 +11,9 @@
:show-group-chat-profile
(fn [{:keys [db] :as cofx} [_ chat-id]]
(fx/merge cofx
{:db (assoc db
:new-chat-name (get-in db [:chats chat-id :name]))}
{:db (-> db
(assoc :new-chat-name (get-in db [:chats chat-id :name]))
(assoc :current-chat-id chat-id))}
(navigation/navigate-to-cofx :group-chat-profile nil))))
(handlers/register-handler-fx

81
src/status_im/ui/screens/home/sheet/views.cljs
View File

@ -1,11 +1,14 @@
(ns status-im.ui.screens.home.sheet.views
(:require-macros [status-im.utils.views :refer [defview letsubs] :as views])
(:require [re-frame.core :as re-frame]
[status-im.i18n :as i18n]
[status-im.ui.components.action-button.action-button :as action-button]
[status-im.ui.components.action-button.styles :as action-button.styles]
[status-im.ui.components.colors :as colors]
[status-im.ui.components.list-selection :as list-selection]
[status-im.ui.components.react :as react]))
[status-im.ui.components.react :as react]
[status-im.utils.universal-links.core :as universal-links]
[status-im.utils.platform :as platform]))
(defn hide-sheet-and-dispatch [event]
(re-frame/dispatch [:bottom-sheet/hide-sheet])
@ -49,6 +52,80 @@
(re-frame/dispatch [:bottom-sheet/hide-sheet])
(list-selection/open-share {:message (i18n/label :t/get-status-at)}))}]]])
(defview public-chat-actions-view []
(letsubs [{:keys [chat-id]} [:bottom-sheet/options]]
[react/view {:flex 1 :flex-direction :row}
[react/view action-button.styles/actions-list
(when-not platform/desktop?
(let [link (universal-links/generate-link :public-chat :external chat-id)
message (i18n/label :t/share-public-chat-text {:link link})]
[action-button/action-button
{:label (i18n/label :t/share-chat)
:accessibility-label :share-chat-button
:icon :main-icons/share
:icon-opts {:color colors/blue}
:on-press #(do
(re-frame/dispatch [:bottom-sheet/hide-sheet])
(list-selection/open-share {:message message}))}]))
[action-button/action-button
{:label (i18n/label :t/delete-chat)
:label-style {:color colors/red}
:accessibility-label :delete-chat-button
:icon :main-icons/delete
:icon-opts {:color colors/red}
:cyrcle-color colors/red-light
:on-press #(hide-sheet-and-dispatch [:chat.ui/remove-chat-pressed chat-id])}]]]))
(defview private-chat-actions-view []
(letsubs [{:keys [chat-id]} [:bottom-sheet/options]]
[react/view {:flex 1 :flex-direction :row}
[react/view action-button.styles/actions-list
[action-button/action-button
{:label (i18n/label :t/view-profile)
:accessibility-label :view-profile-button
:icon :main-icons/profile
:icon-opts {:color colors/blue}
:on-press #(hide-sheet-and-dispatch [:chat.ui/show-profile chat-id])}]
[action-button/action-button
{:label (i18n/label :t/delete-chat)
:label-style {:color colors/red}
:accessibility-label :delete-chat-button
:icon :main-icons/delete
:icon-opts {:color colors/red}
:cyrcle-color colors/red-light
:on-press #(hide-sheet-and-dispatch [:chat.ui/remove-chat-pressed chat-id])}]]]))
(defview group-chat-actions-view []
(letsubs [{:keys [chat-id]} [:bottom-sheet/options]]
[react/view {:flex 1 :flex-direction :row}
[react/view action-button.styles/actions-list
[action-button/action-button
{:label (i18n/label :t/group-info)
:accessibility-label :group-info-button
:icon :main-icons/group-chat
:icon-opts {:color colors/blue}
:on-press #(hide-sheet-and-dispatch [:show-group-chat-profile chat-id])}]
[action-button/action-button
{:label (i18n/label :t/delete-and-leave-group)
:label-style {:color colors/red}
:accessibility-label :delete-and-leave-group-button
:icon :main-icons/delete
:icon-opts {:color colors/red}
:cyrcle-color colors/red-light
:on-press #(hide-sheet-and-dispatch [:group-chats.ui/remove-chat-pressed chat-id])}]]]))
(def add-new
{:content add-new-view
:content-height 320})
:content-height 320})
(def public-chat-actions
{:content public-chat-actions-view
:content-height 128})
(def private-chat-actions
{:content private-chat-actions-view
:content-height 128})
(def group-chat-actions
{:content group-chat-actions-view
:content-height 128})

2
src/status_im/ui/screens/home/views.cljs
View File

@ -104,7 +104,7 @@
(views/letsubs [logging-in? [:accounts/login]]
[react/view styles/action-button-container
[react/touchable-highlight {:accessibility-label :new-chat-button
:on-press (when-not logging-in? #(re-frame/dispatch [:bottom-sheet/show-sheet :add-new]))}
:on-press (when-not logging-in? #(re-frame/dispatch [:bottom-sheet/show-sheet :add-new {}]))}
[react/view styles/action-button
(if logging-in?
[react/activity-indicator {:color :white

37
src/status_im/ui/screens/home/views/inner_item.cljs
View File

@ -87,16 +87,21 @@
:accessibility-label :chat-name-text}
chat-name]]]))
(defn home-list-chat-item-inner-view
[{:keys [chat-id chat-name
name color online
group-chat public?
public-key contact
timestamp
last-message-content
last-message-content-type]}]
(let [truncated-chat-name (utils/truncate-str chat-name 30)]
[react/touchable-highlight {:on-press #(re-frame/dispatch [:chat.ui/navigate-to-chat chat-id])}
(defn home-list-item [[home-item-id home-item]]
(let [{:keys [chat-id chat-name
name color online
group-chat public?
public-key contact
timestamp
last-message-content
last-message-content-type]} home-item
truncated-chat-name (utils/truncate-str chat-name 30)
chat-actions (cond
(and group-chat public?) :public-chat-actions
(and group-chat (not public?)) :group-chat-actions
:else :private-chat-actions)]
[react/touchable-highlight {:on-press #(re-frame/dispatch [:chat.ui/navigate-to-chat chat-id])
:on-long-press #(re-frame/dispatch [:bottom-sheet/show-sheet chat-actions {:chat-id chat-id}])}
[react/view styles/chat-container
[react/view styles/chat-icon-container
[chat-icon.screen/chat-icon-view-chat-list contact group-chat truncated-chat-name color online false]]
@ -109,15 +114,3 @@
[message-content-text {:content last-message-content
:content-type last-message-content-type}]
[unviewed-indicator chat-id]]]]]))
(defn home-list-item [[home-item-id home-item]]
(let [delete-action (if (and (:group-chat home-item)
(not (:public? home-item)))
:group-chats.ui/remove-chat-pressed
:chat.ui/remove-chat)]
[list/deletable-list-item {:type :chats
:id home-item-id
:on-delete #(do
(re-frame/dispatch [:set-swipe-position :chats home-item-id false])
(re-frame/dispatch [delete-action home-item-id]))}
[home-list-chat-item-inner-view home-item]]))

11
src/status_im/ui/screens/views.cljs
View File

@ -31,7 +31,16 @@
(merge mobile-network-settings/offline-sheet)
(= view :add-new)
(merge home.sheet/add-new))]
(merge home.sheet/add-new)
(= view :public-chat-actions)
(merge home.sheet/public-chat-actions)
(= view :private-chat-actions)
(merge home.sheet/private-chat-actions)
(= view :group-chat-actions)
(merge home.sheet/group-chat-actions))]
[bottom-sheet/bottom-sheet opts])))

1
translations/en.json
View File

@ -31,6 +31,7 @@
"done": "Done",
"remove-from-contacts": "Remove from contacts",
"delete-chat": "Delete chat",
"delete-and-leave-group": "Delete and leave group",
"new-group-chat": "New group chat",
"edit-chats": "Edit chats",
"sign-in": "Sign in",