From fca51beaaa31fae0ddb314ff3786a4653d6df732 Mon Sep 17 00:00:00 2001 From: Andrey Shovkoplyas Date: Thu, 7 Feb 2019 16:49:07 +0100 Subject: [PATCH] [#7445] Sticker detail view in chat Signed-off-by: Julien Eluard --- src/status_im/chat/models/input.cljs | 3 +- src/status_im/events.cljs | 16 +-- src/status_im/stickers/core.cljs | 29 +++++- src/status_im/transport/db.cljs | 1 + .../ui/screens/chat/message/message.cljs | 4 +- .../ui/screens/chat/stickers/views.cljs | 9 +- src/status_im/ui/screens/stickers/subs.cljs | 11 ++- src/status_im/ui/screens/stickers/views.cljs | 10 +- src/status_im/ui/screens/views.cljs | 98 ++++++++++--------- 9 files changed, 114 insertions(+), 67 deletions(-) diff --git a/src/status_im/chat/models/input.cljs b/src/status_im/chat/models/input.cljs index 8f992e7d1a..5ffa071846 100644 --- a/src/status_im/chat/models/input.cljs +++ b/src/status_im/chat/models/input.cljs @@ -148,12 +148,13 @@ :text message-text})}))) (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) (chat.message/send-message cofx {:chat-id current-chat-id :content-type constants/content-type-sticker :content (cond-> {:chat-id current-chat-id :uri uri + :pack pack :text "Update to latest version to see a nice sticker here!"})}))) (fx/defn send-current-message diff --git a/src/status_im/events.cljs b/src/status_im/events.cljs index cc27f0af97..1364d90c17 100644 --- a/src/status_im/events.cljs +++ b/src/status_im/events.cljs @@ -793,11 +793,11 @@ (handlers/register-handler-fx :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 cofx (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 :chat/disable-cooldown @@ -1656,9 +1656,8 @@ (handlers/register-handler-fx :stickers/load-sticker-pack-success - (fn [{:keys [db]} [_ edn-string]] - (let [{{:keys [id] :as pack} 'meta} (edn/read-string edn-string)] - {:db (-> db (assoc-in [:stickers/packs id] (assoc pack :edn edn-string)))}))) + (fn [cofx [_ edn-string uri open?]] + (stickers/load-sticker-pack-success cofx edn-string uri open?))) (handlers/register-handler-fx :stickers/install-pack @@ -1671,7 +1670,7 @@ {;;TODO request list of packs from contract :http-get-n (mapv (fn [uri] {:url uri :success-event-creator (fn [o] - [:stickers/load-sticker-pack-success o]) + [:stickers/load-sticker-pack-success o uri]) :failure-event-creator (fn [o] nil)}) ;;TODO for testing ONLY ["https://ipfs.infura.io/ipfs/QmRKmQjXyqpfznQ9Y9dTnKePJnQxoJATivPbGcCAKRsZJq/"])})) @@ -1680,3 +1679,8 @@ :stickers/select-pack (fn [{:keys [db]} [_ 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))) \ No newline at end of file diff --git a/src/status_im/stickers/core.cljs b/src/status_im/stickers/core.cljs index 3aee21f0cc..87ebf21cda 100644 --- a/src/status_im/stickers/core.cljs +++ b/src/status_im/stickers/core.cljs @@ -1,10 +1,11 @@ (ns status-im.stickers.core (:require [status-im.utils.fx :as fx] [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]}] - (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)))})) (fx/defn install-stickers-pack [{{:account/keys [account] :as db} :db :as cofx} id] @@ -14,4 +15,26 @@ {:db (-> db (assoc-in [:stickers/packs-installed id] pack) (assoc :stickers/selected-pack id))} - (accounts/update-stickers (conj (:stickers account) (:edn pack)))))) \ No newline at end of file + (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)}})))) \ No newline at end of file diff --git a/src/status_im/transport/db.cljs b/src/status_im/transport/db.cljs index a10311be97..469eec0105 100644 --- a/src/status_im/transport/db.cljs +++ b/src/status_im/transport/db.cljs @@ -65,6 +65,7 @@ (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/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 ::content-type #{constants/content-type-text constants/content-type-command diff --git a/src/status_im/ui/screens/chat/message/message.cljs b/src/status_im/ui/screens/chat/message/message.cljs index 645cd68d72..a92cb69cdd 100644 --- a/src/status_im/ui/screens/chat/message/message.cljs +++ b/src/status_im/ui/screens/chat/message/message.cljs @@ -144,7 +144,7 @@ (defmethod message-content constants/content-type-sticker [wrapper {:keys [content] :as 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)}}]]) (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}] [react/view [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 :show-stickers? false}]) (react/dismiss-keyboard!)) diff --git a/src/status_im/ui/screens/chat/stickers/views.cljs b/src/status_im/ui/screens/chat/stickers/views.cljs index e4aa084fd6..bebf9c05f7 100644 --- a/src/status_im/ui/screens/chat/stickers/views.cljs +++ b/src/status_im/ui/screens/chat/stickers/views.cljs @@ -39,7 +39,7 @@ (defview recent-stickers-panel [] (letsubs [stickers [:stickers/recent]] (if (seq stickers) - [stickers-panel (map #(hash-map :uri %) stickers)] + [stickers-panel stickers] [react/view {:style {:flex 1 :align-items :center :justify-content :center}} [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)]]))) @@ -55,8 +55,9 @@ [react/view {:style {:margin-bottom 5 :height 2 :width 16 :border-radius 1 :background-color (if selected? colors/blue colors/white)}}]]]) -(defn pack-for [packs id] - (some #(when (= id (:id %)) %) packs)) +(defn pack-stickers [packs id] + (let [{:keys [stickers uri]} (some #(when (= id (:id %)) %) packs)] + (map #(assoc % :pack uri) stickers))) (defn show-panel-anim [bottom-anim-value alpha-value] @@ -83,7 +84,7 @@ (= selected-pack :recent) [recent-stickers-panel] (not (seq installed-packs)) [no-stickers-yet-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}} [pack-icon {:on-press #(do (re-frame/dispatch [:stickers/load-packs]) diff --git a/src/status_im/ui/screens/stickers/subs.cljs b/src/status_im/ui/screens/stickers/subs.cljs index 74ef4a26f5..132857ab11 100644 --- a/src/status_im/ui/screens/stickers/subs.cljs +++ b/src/status_im/ui/screens/stickers/subs.cljs @@ -31,8 +31,15 @@ (fn [[{:keys [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 :stickers/recent :<- [:account/account] - (fn [{:keys [recent-stickers]}] - recent-stickers)) \ No newline at end of file + :<- [:stickers/installed-packs-vals] + (fn [[{:keys [recent-stickers]} packs]] + (map (fn [uri] {:uri uri :pack (find-pack-id-for-uri uri packs)}) recent-stickers))) \ No newline at end of file diff --git a/src/status_im/ui/screens/stickers/views.cljs b/src/status_im/ui/screens/stickers/views.cljs index f04923f0b9..3127a68a79 100644 --- a/src/status_im/ui/screens/stickers/views.cljs +++ b/src/status_im/ui/screens/stickers/views.cljs @@ -63,12 +63,12 @@ (def sticker-icon-size 60) -(defview pack [] +(defview pack-main [modal?] (letsubs [{:keys [id name author price thumbnail stickers installed]} [:stickers/get-current-pack]] [react/view styles/screen [status-bar/status-bar] [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} [thumbnail-icon thumbnail 64] [react/view {:padding-horizontal 16 :flex 1} @@ -84,3 +84,9 @@ ^{:key uri} [react/image {:style (styles/sticker-image sticker-icon-size) :source {:uri uri}}])]]]]])) + +(defview pack [] + [pack-main false]) + +(defview pack-modal [] + [pack-main true]) diff --git a/src/status_im/ui/screens/views.cljs b/src/status_im/ui/screens/views.cljs index 1fe50d9d2f..cd3eaae238 100644 --- a/src/status_im/ui/screens/views.cljs +++ b/src/status_im/ui/screens/views.cljs @@ -154,7 +154,7 @@ :hardwallet-setup hardwallet-setup :hardwallet-success hardwallet-success))) (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) (assoc :initialRouteName (name view-id))))} :chat-stack @@ -163,25 +163,24 @@ (stack-screens {:main-stack {:screens - (cond-> - {:home (main-tabs/get-main-tab :home) - :chat chat - :profile profile.contact/profile - :new add-new - :new-chat new-chat - :qr-scanner qr-scanner - :take-picture take-picture - :new-group new-group - :add-participants-toggle-list add-participants-toggle-list - :contact-toggle-list contact-toggle-list - :group-chat-profile profile.group-chat/group-chat-profile - :new-public-chat new-public-chat - :open-dapp open-dapp - :dapp-description dapp-description - :browser browser - :stickers stickers/packs - :stickers-pack stickers/pack - :login login} + (cond-> {:home (main-tabs/get-main-tab :home) + :chat chat + :profile profile.contact/profile + :new add-new + :new-chat new-chat + :qr-scanner qr-scanner + :take-picture take-picture + :new-group new-group + :add-participants-toggle-list add-participants-toggle-list + :contact-toggle-list contact-toggle-list + :group-chat-profile profile.group-chat/group-chat-profile + :new-public-chat new-public-chat + :open-dapp open-dapp + :dapp-description dapp-description + :browser browser + :stickers stickers/packs + :stickers-pack stickers/pack + :login login} config/hardwallet-enabled? (assoc :hardwallet-connect hardwallet-connect @@ -199,6 +198,9 @@ :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 {:screens {:wallet-send-transaction-modal @@ -324,34 +326,34 @@ {:screen (nav-reagent/stack-navigator (stack-screens - (cond-> {:my-profile (main-tabs/get-main-tab :my-profile) - :contacts-list contacts-list - :blocked-users-list blocked-users-list - :profile-photo-capture profile-photo-capture - :about-app about-app/about-app - :bootnodes-settings bootnodes-settings - :installations installations - :edit-bootnode edit-bootnode - :offline-messaging-settings offline-messaging-settings - :edit-mailserver edit-mailserver - :help-center help-center - :dapps-permissions dapps-permissions/dapps-permissions - :manage-dapps-permissions dapps-permissions/manage - :extensions-settings extensions-settings - :edit-extension edit-extension - :show-extension show-extension - :network-settings network-settings - :network-details network-details - :edit-network edit-network - :log-level-settings log-level-settings - :fleet-settings fleet-settings - :currency-settings currency-settings - :backup-seed backup-seed - :login login - :create-account create-account - :recover recover - :accounts accounts - :qr-scanner qr-scanner} + (cond-> {:my-profile (main-tabs/get-main-tab :my-profile) + :contacts-list contacts-list + :blocked-users-list blocked-users-list + :profile-photo-capture profile-photo-capture + :about-app about-app/about-app + :bootnodes-settings bootnodes-settings + :installations installations + :edit-bootnode edit-bootnode + :offline-messaging-settings offline-messaging-settings + :edit-mailserver edit-mailserver + :help-center help-center + :dapps-permissions dapps-permissions/dapps-permissions + :manage-dapps-permissions dapps-permissions/manage + :extensions-settings extensions-settings + :edit-extension edit-extension + :show-extension show-extension + :network-settings network-settings + :network-details network-details + :edit-network edit-network + :log-level-settings log-level-settings + :fleet-settings fleet-settings + :currency-settings currency-settings + :backup-seed backup-seed + :login login + :create-account create-account + :recover recover + :accounts accounts + :qr-scanner qr-scanner} config/hardwallet-enabled? (assoc :hardwallet-authentication-method hardwallet-authentication-method