From 9b7b88c2b710bc3d40843d37cf1a57d1274a109d Mon Sep 17 00:00:00 2001 From: Mohsen Date: Mon, 15 Jan 2024 23:45:49 +0300 Subject: [PATCH] [#18453] fix: address reviewer feedbacks --- .../messenger/messages/transport/events.cljs | 10 ++- .../profile/edit/accent_colour/events.cljs | 26 ++++++++ .../edit/accent_colour/events_test.cljs | 17 +++++ .../profile/edit/accent_colour/style.cljs | 27 ++++++++ .../profile/edit/accent_colour/view.cljs | 65 +++++++++++++++++++ .../contexts/profile/edit/list_items.cljs | 2 +- src/status_im/contexts/profile/events.cljs | 1 + .../integration_test/profile_test.cljs | 21 +++++- src/status_im/navigation/screens.cljs | 5 ++ status-go-version.json | 6 +- translations/en.json | 2 + 11 files changed, 176 insertions(+), 6 deletions(-) create mode 100644 src/status_im/contexts/profile/edit/accent_colour/events.cljs create mode 100644 src/status_im/contexts/profile/edit/accent_colour/events_test.cljs create mode 100644 src/status_im/contexts/profile/edit/accent_colour/style.cljs create mode 100644 src/status_im/contexts/profile/edit/accent_colour/view.cljs diff --git a/src/status_im/contexts/chat/messenger/messages/transport/events.cljs b/src/status_im/contexts/chat/messenger/messages/transport/events.cljs index 6e785375bcfb..a0c73005328b 100644 --- a/src/status_im/contexts/chat/messenger/messages/transport/events.cljs +++ b/src/status_im/contexts/chat/messenger/messages/transport/events.cljs @@ -54,6 +54,7 @@ ^js identity-images (.-identityImages response-js) ^js accounts (.-accounts response-js) ^js ens-username-details-js (.-ensUsernameDetails response-js) + ^js customization-color-js (.-customizationColor response-js) sync-handler (when-not process-async process-response)] (cond @@ -203,7 +204,14 @@ (js-delete response-js "ensUsernameDetails") (rf/merge cofx (process-next response-js sync-handler) - (rf/dispatch [:ens/update-usernames ens-username-details-clj])))))) + (rf/dispatch [:ens/update-usernames ens-username-details-clj]))) + + (seq customization-color-js) + (let [customization-color (types/js->clj customization-color-js)] + (js-delete response-js "customizationColor") + (rf/merge cofx + (process-next response-js sync-handler) + (rf/dispatch [:profile/edit-accent-colour customization-color])))))) (defn group-by-and-update-unviewed-counts "group messages by current chat, profile updates, transactions and update unviewed counters in db for not curent chats" diff --git a/src/status_im/contexts/profile/edit/accent_colour/events.cljs b/src/status_im/contexts/profile/edit/accent_colour/events.cljs new file mode 100644 index 000000000000..89efd29a5710 --- /dev/null +++ b/src/status_im/contexts/profile/edit/accent_colour/events.cljs @@ -0,0 +1,26 @@ +(ns status-im.contexts.profile.edit.accent-colour.events + (:require [taoensso.timbre :as log] + [utils.i18n :as i18n] + [utils.re-frame :as rf])) + +(rf/reg-event-fx :profile/edit-accent-colour-success + (fn [_] + {:fx [[:dispatch [:navigate-back]] + [:dispatch + [:toasts/upsert + {:type :positive + :theme :dark + :text (i18n/label :t/accent-colour-updated)}]]]})) + +(defn edit-accent-colour + [{:keys [db]} [customization-color]] + (let [key-uid (get-in db [:profile/profile :key-uid])] + {:db (assoc-in db [:profile/profile :customization-color] customization-color) + :fx [[:json-rpc/call + [{:method "wakuext_setCustomizationColor" + :params [{:customizationColor customization-color + :keyUid key-uid}] + :on-success [:profile/edit-accent-colour-success] + :on-error #(log/error "failed to edit accent color." {:error %})}]]]})) + +(rf/reg-event-fx :profile/edit-accent-colour edit-accent-colour) diff --git a/src/status_im/contexts/profile/edit/accent_colour/events_test.cljs b/src/status_im/contexts/profile/edit/accent_colour/events_test.cljs new file mode 100644 index 000000000000..ec2b7f9ba95b --- /dev/null +++ b/src/status_im/contexts/profile/edit/accent_colour/events_test.cljs @@ -0,0 +1,17 @@ +(ns status-im.contexts.profile.edit.accent-colour.events-test + (:require [cljs.test :refer [deftest is]] + matcher-combinators.test + [status-im.contexts.profile.edit.accent-colour.events :as sut])) + +(deftest edit-accent-color-test + (let [new-color :yellow + key-uid "key-uid" + cofx {:db {:profile/profile {:key-uid key-uid}}} + expected {:fx [[:json-rpc/call + [{:method "wakuext_setCustomizationColor" + :params [{:customizationColor new-color + :keyUid key-uid}] + :on-success [:profile/edit-accent-colour-success] + :on-error fn?}]]]}] + (is (match? expected + (sut/edit-accent-colour cofx [new-color]))))) diff --git a/src/status_im/contexts/profile/edit/accent_colour/style.cljs b/src/status_im/contexts/profile/edit/accent_colour/style.cljs new file mode 100644 index 000000000000..7a7d5d9c153b --- /dev/null +++ b/src/status_im/contexts/profile/edit/accent_colour/style.cljs @@ -0,0 +1,27 @@ +(ns status-im.contexts.profile.edit.accent-colour.style + (:require [quo.foundations.colors :as colors])) + +(defn page-wrapper + [insets] + {:padding-top (:top insets) + :padding-bottom (:bottom insets) + :padding-horizontal 1 + :flex 1}) + +(def screen-container + {:flex 1 + :padding-top 14 + :padding-horizontal 20 + :justify-content :space-between}) + +(def color-title + {:color colors/white-70-blur + :margin-top 20 + :margin-bottom 16}) + +(def button-wrapper + {:margin-vertical 12}) + +(def profile-card + {:margin-top 22 + :margin-bottom 5}) diff --git a/src/status_im/contexts/profile/edit/accent_colour/view.cljs b/src/status_im/contexts/profile/edit/accent_colour/view.cljs new file mode 100644 index 000000000000..d54622559d7b --- /dev/null +++ b/src/status_im/contexts/profile/edit/accent_colour/view.cljs @@ -0,0 +1,65 @@ +(ns status-im.contexts.profile.edit.accent-colour.view + (:require [quo.core :as quo] + [react-native.core :as rn] + [react-native.safe-area :as safe-area] + [reagent.core :as reagent] + [status-im.constants :as constants] + [status-im.contexts.profile.edit.accent-colour.style :as style] + [status-im.contexts.profile.utils :as profile.utils] + [utils.i18n :as i18n] + [utils.re-frame :as rf] + [utils.responsiveness :as responsiveness])) + +(defn f-view + [{:keys [customization-color]}] + (let [insets (safe-area/get-insets) + {window-width :width} (rn/get-window) + unsaved-custom-color (reagent/atom customization-color constants/profile-default-color) + on-change #(reset! unsaved-custom-color %)] + (fn [{:keys [customization-color]}] + (let [profile (rf/sub [:profile/profile-with-image]) + profile-picture (profile.utils/photo profile) + display-name (profile.utils/displayed-name profile)] + (rn/use-effect + #(on-change customization-color) + [customization-color]) + [quo/overlay + {:type :shell + :container-style (style/page-wrapper insets)} + [quo/page-nav + {:key :header + :background :blur + :icon-name :i/arrow-left + :on-press #(rf/dispatch [:navigate-back])}] + [rn/view + {:key :content + :style style/screen-container} + [rn/view {:style {:flex 1}} + [quo/text-combinations {:title (i18n/label :t/accent-colour)}] + [quo/profile-card + {:profile-picture profile-picture + :name display-name + :card-style style/profile-card + :customization-color @unsaved-custom-color}] + [quo/text + {:size :paragraph-2 + :weight :medium + :style style/color-title} + (i18n/label :t/accent-colour)] + [quo/color-picker + {:blur? true + :default-selected @unsaved-custom-color + :on-change on-change + :window-width window-width}]] + [rn/view {:style style/button-wrapper} + [quo/button + {:type :primary + :customization-color @unsaved-custom-color + :on-press (fn [] + (rf/dispatch [:profile/edit-accent-colour @unsaved-custom-color]))} + (i18n/label :t/save-colour)]]]])))) + +(defn view + [] + (let [customization-color (rf/sub [:profile/customization-color])] + [:f> f-view {:customization-color customization-color}])) diff --git a/src/status_im/contexts/profile/edit/list_items.cljs b/src/status_im/contexts/profile/edit/list_items.cljs index da20a58e4f1c..1328fc9a8be6 100644 --- a/src/status_im/contexts/profile/edit/list_items.cljs +++ b/src/status_im/contexts/profile/edit/list_items.cljs @@ -25,7 +25,7 @@ :action :arrow :container-style style/item-container} {:title (i18n/label :t/accent-colour) - :on-press not-implemented/alert + :on-press #(rf/dispatch [:open-modal :edit-accent-colour]) :label :color :label-props (colors/resolve-color customization-color theme) :blur? true diff --git a/src/status_im/contexts/profile/events.cljs b/src/status_im/contexts/profile/events.cljs index 61dafe24a90b..2e6281bc4ad2 100644 --- a/src/status_im/contexts/profile/events.cljs +++ b/src/status_im/contexts/profile/events.cljs @@ -3,6 +3,7 @@ [legacy.status-im.data-store.settings :as data-store.settings] [native-module.core :as native-module] [re-frame.core :as re-frame] + [status-im.contexts.profile.edit.accent-colour.events] [status-im.contexts.profile.edit.name.events] [status-im.contexts.profile.login.events :as profile.login] [status-im.contexts.profile.rpc :as profile.rpc] diff --git a/src/status_im/integration_test/profile_test.cljs b/src/status_im/integration_test/profile_test.cljs index 645c12ab8b0f..498e73205477 100644 --- a/src/status_im/integration_test/profile_test.cljs +++ b/src/status_im/integration_test/profile_test.cljs @@ -2,6 +2,7 @@ (:require [cljs.test :refer [deftest is]] [day8.re-frame.test :as rf-test] + [legacy.status-im.multiaccounts.logout.core :as logout] [status-im.contexts.profile.utils :as profile.utils] [test-helpers.integration :as h] [utils.re-frame :as rf])) @@ -19,4 +20,22 @@ [:toasts/upsert] (let [profile (rf/sub [:profile/profile]) display-name (profile.utils/displayed-name profile)] - (is (= new-name display-name)))))))))) + (is (= new-name display-name))) + (h/logout) + (rf-test/wait-for [::logout/logout-method])))))))) + +(deftest edit-profile-accent-colour-test + (h/log-headline :edit-profile-accent-colour-test) + (let [new-color :yellow] + (rf-test/run-test-async + (h/with-app-initialized + (h/with-account + (rf/dispatch [:profile/edit-accent-colour new-color]) + (rf-test/wait-for + [:navigate-back] + (rf-test/wait-for + [:toasts/upsert] + (let [customization-color (rf/sub [:profile/customization-color])] + (is (= new-color customization-color))) + (h/logout) + (rf-test/wait-for [::logout/logout-method])))))))) diff --git a/src/status_im/navigation/screens.cljs b/src/status_im/navigation/screens.cljs index ddf4c7261ba6..875a898c496f 100644 --- a/src/status_im/navigation/screens.cljs +++ b/src/status_im/navigation/screens.cljs @@ -34,6 +34,7 @@ [status-im.contexts.preview.quo.component-preview.view :as component-preview] [status-im.contexts.preview.quo.main :as quo.preview] [status-im.contexts.preview.status-im.main :as status-im-preview] + [status-im.contexts.profile.edit.accent-colour.view :as edit-accent-colour] [status-im.contexts.profile.edit.name.view :as edit-name] [status-im.contexts.profile.edit.view :as edit-profile] [status-im.contexts.profile.profiles.view :as profiles] @@ -172,6 +173,10 @@ :options options/transparent-screen-options :component edit-profile/view} + {:name :edit-accent-colour + :options options/transparent-screen-options + :component edit-accent-colour/view} + {:name :edit-name :options options/transparent-screen-options :component edit-name/view} diff --git a/status-go-version.json b/status-go-version.json index 794f1d642a40..62ff8743ec9a 100644 --- a/status-go-version.json +++ b/status-go-version.json @@ -3,7 +3,7 @@ "_comment": "Instead use: scripts/update-status-go.sh ", "owner": "status-im", "repo": "status-go", - "version": "v0.172.6", - "commit-sha1": "6e30fbb211b0e0bb1e7966cce4e215c4080aac5c", - "src-sha256": "1k3hg2m25qvgvqxmy8im3xhjwvdyvaq49yks92642h9rw494nb94" + "version": "feat/change-accent-colour", + "commit-sha1": "13ab92fd783d2b9d6e982a6206bd48fbe1c50c78", + "src-sha256": "0hm1ba15w1jbc4zsv50x6b836wwq78d72iwxwbxsd28qvr8wfd5q" } diff --git a/translations/en.json b/translations/en.json index 3541dfd56c65..58cf53c8cdff 100644 --- a/translations/en.json +++ b/translations/en.json @@ -5,6 +5,7 @@ "about-names-content": "No one can pretend to be you! You’re anonymous by default and never have to reveal your real name. You can register a custom name for a small fee.", "about-names-title": "Names can’t be changed", "accent-colour": "Accent colour", + "accent-colour-updated": "Accent colour updated", "access-key": "Access key", "access-existing-keys": "Access existing keys", "accept-and-share-address": "Accept and share address", @@ -1243,6 +1244,7 @@ "revoke-access": "Revoke access", "rpc-url": "RPC URL", "save": "Save", + "save-colour": "Save colour", "save-name": "Save name", "save-password": "Save password", "save-password-unavailable": "Set device passcode to save password",