From 7691377c1b665a9731c9f6d29c03dd188593c645 Mon Sep 17 00:00:00 2001 From: Pablo Alba Date: Tue, 1 Mar 2022 13:56:02 +0100 Subject: [PATCH] :sparkles: Persist color palette and color picker across refresh --- CHANGES.md | 1 + frontend/src/app/main/data/workspace.cljs | 63 +++++++++++++++---- .../src/app/main/data/workspace/colors.cljs | 9 ++- 3 files changed, 57 insertions(+), 16 deletions(-) diff --git a/CHANGES.md b/CHANGES.md index 4f1dd6b22..8f9429d14 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -5,6 +5,7 @@ ### :boom: Breaking changes ### :sparkles: New features +- Persist color palette and color picker across refresh [Taiga #1660](https://tree.taiga.io/project/penpot/issue/1660) - Ability to add multiple strokes to a shape [Taiga #2778](https://tree.taiga.io/project/penpot/us/2778) - Scroll to selected size in font size selector [Taiga #2825](https://tree.taiga.io/project/penpot/us/2825) - Duplicate artboards create new flows if needed [Taiga #2221](https://tree.taiga.io/project/penpot/issue/2221) diff --git a/frontend/src/app/main/data/workspace.cljs b/frontend/src/app/main/data/workspace.cljs index 747d7e1a1..f24f60546 100644 --- a/frontend/src/app/main/data/workspace.cljs +++ b/frontend/src/app/main/data/workspace.cljs @@ -52,6 +52,7 @@ [app.util.http :as http] [app.util.i18n :as i18n] [app.util.router :as rt] + [app.util.storage :refer [storage]] [app.util.timers :as tm] [app.util.webapi :as wapi] [beicon.core :as rx] @@ -245,6 +246,8 @@ (rx/observe-on :async)))))) (declare go-to-page) +(declare load-flag) + (defn initialize-page [page-id] (us/assert ::us/uuid page-id) @@ -268,6 +271,12 @@ (assoc :current-page-id id) (assoc :trimmed-page (dm/select-keys page [:id :name])) (assoc :workspace-local local) + (update :workspace-layout + #(if (load-flag :colorpalette false) + (conj % :colorpalette) + (disj % :colorpalette))) + (assoc-in [:workspace-local :selected-palette] (load-flag :selected-palette :recent)) + (assoc-in [:workspace-local :selected-palette-colorpicker] (load-flag :selected-palette-colorpicker :recent)) (update :workspace-global assoc :background-color (-> page :options :background)) (update-in [:route :params :query] assoc :page-id (dm/str id)))) state)))) @@ -385,6 +394,27 @@ (->> (rp/mutation :rename-file params) (rx/ignore)))))) +;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; +;; Local storage Flags Manipulation +;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; + +(def storeable-layout-flags #{:colorpalette}) +(def storeable-workspace-local-flags #{:selected-palette :selected-palette-colorpicker}) + +(defn store-layout-flags! + [state flags] + (doseq [item (filter storeable-layout-flags flags)] + (swap! storage assoc item (contains? (:workspace-layout state) item)))) + +(defn store-workspace-local-flag! + [flag value] + (when (contains? storeable-workspace-local-flags flag) + (swap! storage assoc flag value))) + +(defn load-flag + [flag default] + (or (flag @storage) default)) + ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; ;; Workspace State Manipulation ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; @@ -396,23 +426,34 @@ (ptk/reify ::toggle-layout-flags ptk/UpdateEvent (update [_ state] - (update state :workspace-layout - (fn [stored] - (reduce (fn [flags flag] - (if (contains? flags flag) - (disj flags flag) - (conj flags flag))) - stored - (d/concat-set flags))))))) + (let [new-state (update state :workspace-layout + (fn [stored] + (reduce (fn [flags flag] + (if (contains? flags flag) + (disj flags flag) + (conj flags flag))) + stored + (d/concat-set flags))))] + (store-layout-flags! new-state flags) + new-state)))) (defn remove-layout-flags [& flags] (ptk/reify ::remove-layout-flags ptk/UpdateEvent (update [_ state] - (update state :workspace-layout - (fn [stored] - (reduce disj stored (d/concat-set flags))))))) + (let [new-state (update state :workspace-layout + (fn [stored] + (reduce disj stored (d/concat-set flags))))] + (store-layout-flags! (:workspace-layout new-state) flags) + new-state)))) + +;; --- Set workspace flag + +(defn set-workspace-local-flag! + [state flag value] + (store-workspace-local-flag! flag value) + (assoc-in state [:workspace-local flag] value)) ;; --- Set element options mode diff --git a/frontend/src/app/main/data/workspace/colors.cljs b/frontend/src/app/main/data/workspace/colors.cljs index dd0b89a8e..11c6559ce 100644 --- a/frontend/src/app/main/data/workspace/colors.cljs +++ b/frontend/src/app/main/data/workspace/colors.cljs @@ -9,6 +9,7 @@ [app.common.colors :as clr] [app.common.data :as d] [app.main.data.modal :as md] + [app.main.data.workspace :as dw] [app.main.data.workspace.changes :as dch] [app.main.data.workspace.state-helpers :as wsh] [app.main.data.workspace.texts :as dwt] @@ -45,8 +46,7 @@ (ptk/reify ::change-palette-selected ptk/UpdateEvent (update [_ state] - (-> state - (assoc-in [:workspace-global :selected-palette] selected))))) + (dw/set-workspace-local-flag! state :selected-palette selected)))) (defn change-palette-selected-colorpicker "Change the library used by the color picker" @@ -54,8 +54,7 @@ (ptk/reify ::change-palette-selected-colorpicker ptk/UpdateEvent (update [_ state] - (-> state - (assoc-in [:workspace-global :selected-palette-colorpicker] selected))))) + (dw/set-workspace-local-flag! state :selected-palette-colorpicker selected)))) (defn show-palette "Show the palette tool and change the library it uses" @@ -65,7 +64,7 @@ (update [_ state] (-> state (update :workspace-layout conj :colorpalette) - (assoc-in [:workspace-global :selected-palette] selected))))) + (dw/set-workspace-local-flag! :selected-palette selected))))) (defn start-picker []