[#7445] Sticker detail view in chat

Signed-off-by: Julien Eluard <julien.eluard@gmail.com>
This commit is contained in:
Andrey Shovkoplyas 2019-02-07 16:49:07 +01:00 committed by Julien Eluard
parent 7960fdef85
commit fca51beaaa
No known key found for this signature in database
GPG Key ID: 6FD7DB5437FCBEF6
9 changed files with 114 additions and 67 deletions

View File

@ -148,12 +148,13 @@
:text message-text})}))) :text message-text})})))
(fx/defn send-sticker-fx (fx/defn send-sticker-fx
[{:keys [db] :as cofx} uri current-chat-id] [{:keys [db] :as cofx} {:keys [uri pack]} current-chat-id]
(when-not (string/blank? uri) (when-not (string/blank? uri)
(chat.message/send-message cofx {:chat-id current-chat-id (chat.message/send-message cofx {:chat-id current-chat-id
:content-type constants/content-type-sticker :content-type constants/content-type-sticker
:content (cond-> {:chat-id current-chat-id :content (cond-> {:chat-id current-chat-id
:uri uri :uri uri
:pack pack
:text "Update to latest version to see a nice sticker here!"})}))) :text "Update to latest version to see a nice sticker here!"})})))
(fx/defn send-current-message (fx/defn send-current-message

View File

@ -793,11 +793,11 @@
(handlers/register-handler-fx (handlers/register-handler-fx
:chat/send-sticker :chat/send-sticker
(fn [{{:keys [current-chat-id] :account/keys [account]} :db :as cofx} [_ {:keys [uri]}]] (fn [{{:keys [current-chat-id] :account/keys [account]} :db :as cofx} [_ {:keys [uri] :as sticker}]]
(fx/merge (fx/merge
cofx cofx
(accounts/update-recent-stickers (conj (remove #(= uri %) (:recent-stickers account)) uri)) (accounts/update-recent-stickers (conj (remove #(= uri %) (:recent-stickers account)) uri))
(chat.input/send-sticker-fx uri current-chat-id)))) (chat.input/send-sticker-fx sticker current-chat-id))))
(handlers/register-handler-fx (handlers/register-handler-fx
:chat/disable-cooldown :chat/disable-cooldown
@ -1656,9 +1656,8 @@
(handlers/register-handler-fx (handlers/register-handler-fx
:stickers/load-sticker-pack-success :stickers/load-sticker-pack-success
(fn [{:keys [db]} [_ edn-string]] (fn [cofx [_ edn-string uri open?]]
(let [{{:keys [id] :as pack} 'meta} (edn/read-string edn-string)] (stickers/load-sticker-pack-success cofx edn-string uri open?)))
{:db (-> db (assoc-in [:stickers/packs id] (assoc pack :edn edn-string)))})))
(handlers/register-handler-fx (handlers/register-handler-fx
:stickers/install-pack :stickers/install-pack
@ -1671,7 +1670,7 @@
{;;TODO request list of packs from contract {;;TODO request list of packs from contract
:http-get-n (mapv (fn [uri] {:url uri :http-get-n (mapv (fn [uri] {:url uri
:success-event-creator (fn [o] :success-event-creator (fn [o]
[:stickers/load-sticker-pack-success o]) [:stickers/load-sticker-pack-success o uri])
:failure-event-creator (fn [o] nil)}) :failure-event-creator (fn [o] nil)})
;;TODO for testing ONLY ;;TODO for testing ONLY
["https://ipfs.infura.io/ipfs/QmRKmQjXyqpfznQ9Y9dTnKePJnQxoJATivPbGcCAKRsZJq/"])})) ["https://ipfs.infura.io/ipfs/QmRKmQjXyqpfznQ9Y9dTnKePJnQxoJATivPbGcCAKRsZJq/"])}))
@ -1680,3 +1679,8 @@
:stickers/select-pack :stickers/select-pack
(fn [{:keys [db]} [_ id]] (fn [{:keys [db]} [_ id]]
{:db (assoc db :stickers/selected-pack id)})) {:db (assoc db :stickers/selected-pack id)}))
(handlers/register-handler-fx
:stickers/open-sticker-pack
(fn [cofx [_ uri]]
(stickers/open-sticker-pack cofx uri)))

View File

@ -1,10 +1,11 @@
(ns status-im.stickers.core (ns status-im.stickers.core
(:require [status-im.utils.fx :as fx] (:require [status-im.utils.fx :as fx]
[cljs.reader :as edn] [cljs.reader :as edn]
[status-im.accounts.core :as accounts])) [status-im.accounts.core :as accounts]
[status-im.ui.screens.navigation :as navigation]))
(fx/defn init-stickers-packs [{:keys [db]}] (fx/defn init-stickers-packs [{:keys [db]}]
(let [sticker-packs (map #(get (edn/read-string %) 'meta) (get-in db [:account/account :stickers]))] (let [sticker-packs (map edn/read-string (get-in db [:account/account :stickers]))]
{:db (assoc db :stickers/packs-installed (into {} (map #(vector (:id %) %) sticker-packs)))})) {:db (assoc db :stickers/packs-installed (into {} (map #(vector (:id %) %) sticker-packs)))}))
(fx/defn install-stickers-pack [{{:account/keys [account] :as db} :db :as cofx} id] (fx/defn install-stickers-pack [{{:account/keys [account] :as db} :db :as cofx} id]
@ -14,4 +15,26 @@
{:db (-> db {:db (-> db
(assoc-in [:stickers/packs-installed id] pack) (assoc-in [:stickers/packs-installed id] pack)
(assoc :stickers/selected-pack id))} (assoc :stickers/selected-pack id))}
(accounts/update-stickers (conj (:stickers account) (:edn pack)))))) (accounts/update-stickers (conj (:stickers account) (pr-str pack))))))
(fx/defn load-sticker-pack-success [{:keys [db] :as cofx} edn-string uri open?]
(let [{{:keys [id] :as pack} 'meta} (edn/read-string edn-string)
pack' (assoc pack :uri uri)]
(fx/merge cofx
{:db (-> db (assoc-in [:stickers/packs id] pack'))}
#(when open? (navigation/navigate-to-cofx % :stickers-pack-modal pack')))))
(defn find-pack [pack-uri]
(fn [{:keys [uri] :as pack}]
(when (= pack-uri uri)
pack)))
(fx/defn open-sticker-pack [{{:stickers/keys [packs packs-installed]} :db :as cofx} uri]
(when uri
(let [pack (some (find-pack uri) (concat (vals packs-installed) (vals packs)))]
(if pack
(navigation/navigate-to-cofx cofx :stickers-pack-modal pack)
{:http-get {:url uri
:success-event-creator (fn [o]
[:stickers/load-sticker-pack-success o uri true])
:failure-event-creator (fn [o] nil)}}))))

View File

@ -65,6 +65,7 @@
(spec/def :message.content/response-to-v2 string?) (spec/def :message.content/response-to-v2 string?)
(spec/def :message.content/command-path (spec/tuple string? (spec/coll-of (spec/or :scope keyword? :chat-id string?) :kind set? :min-count 1))) (spec/def :message.content/command-path (spec/tuple string? (spec/coll-of (spec/or :scope keyword? :chat-id string?) :kind set? :min-count 1)))
(spec/def :message.content/uri (spec/and string? (complement s/blank?))) (spec/def :message.content/uri (spec/and string? (complement s/blank?)))
(spec/def :message.content/pack (spec/and string? (complement s/blank?)))
(spec/def :message.content/params (spec/map-of keyword? any?)) (spec/def :message.content/params (spec/map-of keyword? any?))
(spec/def ::content-type #{constants/content-type-text constants/content-type-command (spec/def ::content-type #{constants/content-type-text constants/content-type-command

View File

@ -144,7 +144,7 @@
(defmethod message-content constants/content-type-sticker (defmethod message-content constants/content-type-sticker
[wrapper {:keys [content] :as message}] [wrapper {:keys [content] :as message}]
[wrapper message [wrapper message
[react/image {:style {:margin 10 :width 100 :height 100} [react/image {:style {:margin 10 :width 140 :height 140}
:source {:uri (:uri content)}}]]) :source {:uri (:uri content)}}]])
(defmethod message-content :default (defmethod message-content :default
@ -275,6 +275,8 @@
(defn chat-message [{:keys [message-id old-message-id outgoing group-chat modal? current-public-key content-type content] :as message}] (defn chat-message [{:keys [message-id old-message-id outgoing group-chat modal? current-public-key content-type content] :as message}]
[react/view [react/view
[react/touchable-highlight {:on-press (fn [_] [react/touchable-highlight {:on-press (fn [_]
(when (= content-type constants/content-type-sticker)
(re-frame/dispatch [:stickers/open-sticker-pack (:pack content)]))
(re-frame/dispatch [:chat.ui/set-chat-ui-props {:messages-focused? true (re-frame/dispatch [:chat.ui/set-chat-ui-props {:messages-focused? true
:show-stickers? false}]) :show-stickers? false}])
(react/dismiss-keyboard!)) (react/dismiss-keyboard!))

View File

@ -39,7 +39,7 @@
(defview recent-stickers-panel [] (defview recent-stickers-panel []
(letsubs [stickers [:stickers/recent]] (letsubs [stickers [:stickers/recent]]
(if (seq stickers) (if (seq stickers)
[stickers-panel (map #(hash-map :uri %) stickers)] [stickers-panel stickers]
[react/view {:style {:flex 1 :align-items :center :justify-content :center}} [react/view {:style {:flex 1 :align-items :center :justify-content :center}}
[vector-icons/icon :stickers-icons/stickers-big {:color colors/gray}] [vector-icons/icon :stickers-icons/stickers-big {:color colors/gray}]
[react/text {:style {:margin-top 8 :font-size 17}} (i18n/label :t/recently-used-stickers)]]))) [react/text {:style {:margin-top 8 :font-size 17}} (i18n/label :t/recently-used-stickers)]])))
@ -55,8 +55,9 @@
[react/view {:style {:margin-bottom 5 :height 2 :width 16 :border-radius 1 [react/view {:style {:margin-bottom 5 :height 2 :width 16 :border-radius 1
:background-color (if selected? colors/blue colors/white)}}]]]) :background-color (if selected? colors/blue colors/white)}}]]])
(defn pack-for [packs id] (defn pack-stickers [packs id]
(some #(when (= id (:id %)) %) packs)) (let [{:keys [stickers uri]} (some #(when (= id (:id %)) %) packs)]
(map #(assoc % :pack uri) stickers)))
(defn show-panel-anim (defn show-panel-anim
[bottom-anim-value alpha-value] [bottom-anim-value alpha-value]
@ -83,7 +84,7 @@
(= selected-pack :recent) [recent-stickers-panel] (= selected-pack :recent) [recent-stickers-panel]
(not (seq installed-packs)) [no-stickers-yet-panel] (not (seq installed-packs)) [no-stickers-yet-panel]
(nil? selected-pack) [recent-stickers-panel] (nil? selected-pack) [recent-stickers-panel]
:else [stickers-panel (:stickers (pack-for installed-packs selected-pack))]) :else [stickers-panel (pack-stickers installed-packs selected-pack)])
[react/view {:style {:flex-direction :row :padding-horizontal 4}} [react/view {:style {:flex-direction :row :padding-horizontal 4}}
[pack-icon {:on-press #(do [pack-icon {:on-press #(do
(re-frame/dispatch [:stickers/load-packs]) (re-frame/dispatch [:stickers/load-packs])

View File

@ -31,8 +31,15 @@
(fn [[{:keys [id]} packs]] (fn [[{:keys [id]} packs]]
(first (filter #(= (:id %) id) packs)))) (first (filter #(= (:id %) id) packs))))
(defn find-pack-id-for-uri [sticker-uri packs]
(some (fn [{:keys [stickers uri]}]
(when (some #(= sticker-uri (:uri %)) stickers)
uri))
packs))
(re-frame/reg-sub (re-frame/reg-sub
:stickers/recent :stickers/recent
:<- [:account/account] :<- [:account/account]
(fn [{:keys [recent-stickers]}] :<- [:stickers/installed-packs-vals]
recent-stickers)) (fn [[{:keys [recent-stickers]} packs]]
(map (fn [uri] {:uri uri :pack (find-pack-id-for-uri uri packs)}) recent-stickers)))

View File

@ -63,12 +63,12 @@
(def sticker-icon-size 60) (def sticker-icon-size 60)
(defview pack [] (defview pack-main [modal?]
(letsubs [{:keys [id name author price thumbnail stickers installed]} [:stickers/get-current-pack]] (letsubs [{:keys [id name author price thumbnail stickers installed]} [:stickers/get-current-pack]]
[react/view styles/screen [react/view styles/screen
[status-bar/status-bar] [status-bar/status-bar]
[react/keyboard-avoiding-view components.styles/flex [react/keyboard-avoiding-view components.styles/flex
[toolbar/simple-toolbar] [toolbar/simple-toolbar nil modal?]
[react/view {:height 74 :align-items :center :flex-direction :row :padding-horizontal 16} [react/view {:height 74 :align-items :center :flex-direction :row :padding-horizontal 16}
[thumbnail-icon thumbnail 64] [thumbnail-icon thumbnail 64]
[react/view {:padding-horizontal 16 :flex 1} [react/view {:padding-horizontal 16 :flex 1}
@ -84,3 +84,9 @@
^{:key uri} ^{:key uri}
[react/image {:style (styles/sticker-image sticker-icon-size) [react/image {:style (styles/sticker-image sticker-icon-size)
:source {:uri uri}}])]]]]])) :source {:uri uri}}])]]]]]))
(defview pack []
[pack-main false])
(defview pack-modal []
[pack-main true])

View File

@ -154,7 +154,7 @@
:hardwallet-setup hardwallet-setup :hardwallet-setup hardwallet-setup
:hardwallet-success hardwallet-success))) :hardwallet-success hardwallet-success)))
(cond-> {:headerMode "none"} (cond-> {:headerMode "none"}
; add view-id here if you'd like that view to be first view when app is started ; add view-id here if you'd like that view to be first view when app is started
(#{:intro :login :progress :accounts} view-id) (#{:intro :login :progress :accounts} view-id)
(assoc :initialRouteName (name view-id))))} (assoc :initialRouteName (name view-id))))}
:chat-stack :chat-stack
@ -163,25 +163,24 @@
(stack-screens (stack-screens
{:main-stack {:main-stack
{:screens {:screens
(cond-> (cond-> {:home (main-tabs/get-main-tab :home)
{:home (main-tabs/get-main-tab :home) :chat chat
:chat chat :profile profile.contact/profile
:profile profile.contact/profile :new add-new
:new add-new :new-chat new-chat
:new-chat new-chat :qr-scanner qr-scanner
:qr-scanner qr-scanner :take-picture take-picture
:take-picture take-picture :new-group new-group
:new-group new-group :add-participants-toggle-list add-participants-toggle-list
:add-participants-toggle-list add-participants-toggle-list :contact-toggle-list contact-toggle-list
:contact-toggle-list contact-toggle-list :group-chat-profile profile.group-chat/group-chat-profile
:group-chat-profile profile.group-chat/group-chat-profile :new-public-chat new-public-chat
:new-public-chat new-public-chat :open-dapp open-dapp
:open-dapp open-dapp :dapp-description dapp-description
:dapp-description dapp-description :browser browser
:browser browser :stickers stickers/packs
:stickers stickers/packs :stickers-pack stickers/pack
:stickers-pack stickers/pack :login login}
:login login}
config/hardwallet-enabled? config/hardwallet-enabled?
(assoc :hardwallet-connect hardwallet-connect (assoc :hardwallet-connect hardwallet-connect
@ -199,6 +198,9 @@
:show-extension-modal :show-extension-modal
(wrap-modal :show-extension-modal show-extension-modal) (wrap-modal :show-extension-modal show-extension-modal)
:stickers-pack-modal
(wrap-modal :stickers-pack-modal stickers/pack-modal)
:wallet-send-modal-stack :wallet-send-modal-stack
{:screens {:screens
{:wallet-send-transaction-modal {:wallet-send-transaction-modal
@ -324,34 +326,34 @@
{:screen {:screen
(nav-reagent/stack-navigator (nav-reagent/stack-navigator
(stack-screens (stack-screens
(cond-> {:my-profile (main-tabs/get-main-tab :my-profile) (cond-> {:my-profile (main-tabs/get-main-tab :my-profile)
:contacts-list contacts-list :contacts-list contacts-list
:blocked-users-list blocked-users-list :blocked-users-list blocked-users-list
:profile-photo-capture profile-photo-capture :profile-photo-capture profile-photo-capture
:about-app about-app/about-app :about-app about-app/about-app
:bootnodes-settings bootnodes-settings :bootnodes-settings bootnodes-settings
:installations installations :installations installations
:edit-bootnode edit-bootnode :edit-bootnode edit-bootnode
:offline-messaging-settings offline-messaging-settings :offline-messaging-settings offline-messaging-settings
:edit-mailserver edit-mailserver :edit-mailserver edit-mailserver
:help-center help-center :help-center help-center
:dapps-permissions dapps-permissions/dapps-permissions :dapps-permissions dapps-permissions/dapps-permissions
:manage-dapps-permissions dapps-permissions/manage :manage-dapps-permissions dapps-permissions/manage
:extensions-settings extensions-settings :extensions-settings extensions-settings
:edit-extension edit-extension :edit-extension edit-extension
:show-extension show-extension :show-extension show-extension
:network-settings network-settings :network-settings network-settings
:network-details network-details :network-details network-details
:edit-network edit-network :edit-network edit-network
:log-level-settings log-level-settings :log-level-settings log-level-settings
:fleet-settings fleet-settings :fleet-settings fleet-settings
:currency-settings currency-settings :currency-settings currency-settings
:backup-seed backup-seed :backup-seed backup-seed
:login login :login login
:create-account create-account :create-account create-account
:recover recover :recover recover
:accounts accounts :accounts accounts
:qr-scanner qr-scanner} :qr-scanner qr-scanner}
config/hardwallet-enabled? config/hardwallet-enabled?
(assoc :hardwallet-authentication-method hardwallet-authentication-method (assoc :hardwallet-authentication-method hardwallet-authentication-method