Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-01 11:59:17 -05:00
Code Issues Activity

Activate themes via lib

Browse source
This commit is contained in:
Florian Schroedl 2024-09-24 15:25:29 +02:00
parent 4c327f38ef
commit 844819a50c
6 changed files with 36 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
common/src/app/common/files/changes.cljc
View file

@ -258,7 +258,7 @@
[:update-active-token-themes [:update-active-token-themes
[:map {:title "UpdateActiveTokenThemes"} [:map {:title "UpdateActiveTokenThemes"}
[:type [:= :update-active-token-themes]] [:type [:= :update-active-token-themes]]
[:theme-ids [:set ::sm/uuid]]]] [:theme-ids [:set :string]]]]
[:delete-temporary-token-theme [:delete-temporary-token-theme
[:map {:title "DeleteTemporaryTokenThemeChange"} [:map {:title "DeleteTemporaryTokenThemeChange"}
@ -846,7 +846,10 @@
(defmethod process-change :update-active-token-themes (defmethod process-change :update-active-token-themes
[data {:keys [theme-ids]}] [data {:keys [theme-ids]}]
(ctotl/assoc-active-token-themes data theme-ids)) (-> data
(update :tokens-lib #(-> %
(ctob/ensure-tokens-lib)
(ctob/set-active-themes theme-ids)))))
(defmethod process-change :delete-temporary-token-theme (defmethod process-change :delete-temporary-token-theme
[data {:keys [id group name]}] [data {:keys [id group name]}]

7
common/src/app/common/types/tokens_lib.cljc
View file

@ -328,6 +328,7 @@
(get-theme-groups [_] "get a sequence of group names by order") (get-theme-groups [_] "get a sequence of group names by order")
(get-active-theme-paths [_] "get the active theme paths") (get-active-theme-paths [_] "get the active theme paths")
(get-active-themes [_] "get an ordered sequence of active themes in the library") (get-active-themes [_] "get an ordered sequence of active themes in the library")
(set-active-themes [_ active-themes] "set active themes in library")
(theme-active? [_ group name] "predicate if token theme is active") (theme-active? [_ group name] "predicate if token theme is active")
(activate-theme [_ group name] "adds theme from the active-themes") (activate-theme [_ group name] "adds theme from the active-themes")
(deactivate-theme [_ group name] "removes theme from the active-themes") (deactivate-theme [_ group name] "removes theme from the active-themes")
@ -489,6 +490,12 @@
(get-theme [_ group name] (get-theme [_ group name]
(dm/get-in themes [group name])) (dm/get-in themes [group name]))
(set-active-themes [_ active-themes]
(TokensLib. sets
set-groups
themes
active-themes))
(activate-theme [this group name] (activate-theme [this group name]
(if-let [theme (get-theme this group name)] (if-let [theme (get-theme this group name)]
(let [group-themes (->> (get themes group) (let [group-themes (->> (get themes group)

18
frontend/src/app/main/data/tokens.cljs
View file

@ -140,17 +140,19 @@
theme)) theme))
:else changes))) :else changes)))
(defn toggle-token-theme [token-theme-id] (defn toggle-token-theme-active? [group name]
(ptk/reify ::toggle-token-theme (ptk/reify ::toggle-token-theme-active?
ptk/WatchEvent ptk/WatchEvent
(watch [it state _] (watch [it state _]
(let [themes (wtts/get-active-theme-ids state) (let [tokens-lib (get-tokens-lib state)
new-themes (wtts/toggle-active-theme-id token-theme-id state) prev-active-token-themes (some-> tokens-lib
changes (-> (pcb/empty-changes it) (ctob/get-active-theme-paths))
(pcb/update-active-token-themes new-themes themes))] active-token-themes (some-> tokens-lib
(ctob/toggle-theme-active? group name)
(ctob/get-active-theme-paths))
changes (pcb/update-active-token-themes (pcb/empty-changes it) active-token-themes prev-active-token-themes)]
(rx/of (rx/of
(dch/commit-changes changes) (dch/commit-changes changes))))))
(wtu/update-workspace-tokens))))))
(defn delete-token-theme [token-theme-id] (defn delete-token-theme [token-theme-id]
(ptk/reify ::delete-token-theme (ptk/reify ::delete-token-theme

6
frontend/src/app/main/refs.cljs
View file

@ -471,10 +471,10 @@
(def workspace-ordered-token-sets (def workspace-ordered-token-sets
(l/derived #(or (some-> % ctob/get-sets) []) tokens-lib)) (l/derived #(or (some-> % ctob/get-sets) []) tokens-lib))
(dm/legacy (def workspace-active-theme-paths
(def workspace-active-theme-ids (l/derived #(some-> % ctob/get-active-theme-paths) tokens-lib))
(l/derived wtts/get-active-theme-ids st/state))
(dm/legacy
(def workspace-temp-theme-id (def workspace-temp-theme-id
(l/derived wtts/get-temp-theme-id st/state)) (l/derived wtts/get-temp-theme-id st/state))

9
frontend/src/app/main/ui/workspace/tokens/modals/themes.cljs
View file

@ -7,6 +7,7 @@
(ns app.main.ui.workspace.tokens.modals.themes (ns app.main.ui.workspace.tokens.modals.themes
(:require-macros [app.main.style :as stl]) (:require-macros [app.main.style :as stl])
(:require (:require
[app.common.types.tokens-lib :as ctob]
[app.main.data.modal :as modal] [app.main.data.modal :as modal]
[app.main.data.tokens :as wdt] [app.main.data.tokens :as wdt]
[app.main.refs :as refs] [app.main.refs :as refs]
@ -55,7 +56,7 @@
(mf/defc themes-overview (mf/defc themes-overview
[{:keys [set-state]}] [{:keys [set-state]}]
(let [active-theme-ids (mf/deref refs/workspace-active-theme-ids) (let [active-theme-ids (mf/deref refs/workspace-active-theme-paths)
themes-groups (mf/deref refs/workspace-token-theme-tree) themes-groups (mf/deref refs/workspace-token-theme-tree)
on-edit-theme (fn [theme e] on-edit-theme (fn [theme e]
(dom/prevent-default e) (dom/prevent-default e)
@ -69,15 +70,15 @@
(when (seq group) (when (seq group)
[:span {:class (stl/css :theme-group-label)} group]) [:span {:class (stl/css :theme-group-label)} group])
[:ul {:class (stl/css :theme-group-rows-wrapper)} [:ul {:class (stl/css :theme-group-rows-wrapper)}
(for [[_ {:keys [id name] :as theme}] themes (for [[_ {:keys [id group name] :as theme}] themes
:let [selected? (some? (get active-theme-ids id))]] :let [selected? (some? (get active-theme-ids (ctob/theme-path theme)))]]
[:li {:key (str "token-theme-" id) [:li {:key (str "token-theme-" id)
:class (stl/css :theme-row)} :class (stl/css :theme-row)}
[:div {:class (stl/css :theme-row-left)} [:div {:class (stl/css :theme-row-left)}
[:div {:on-click (fn [e] [:div {:on-click (fn [e]
(dom/prevent-default e) (dom/prevent-default e)
(dom/stop-propagation e) (dom/stop-propagation e)
(st/emit! (wdt/toggle-token-theme id)))} (st/emit! (wdt/toggle-token-theme-active? group name)))}
[:& switch {:name (str "Theme" name) [:& switch {:name (str "Theme" name)
:on-change (constantly nil) :on-change (constantly nil)
:selected? selected?}]] :selected? selected?}]]

11
frontend/src/app/main/ui/workspace/tokens/theme_select.cljs
View file

@ -8,6 +8,7 @@
(:require-macros [app.main.style :as stl]) (:require-macros [app.main.style :as stl])
(:require (:require
[app.common.data.macros :as dm] [app.common.data.macros :as dm]
[app.common.types.tokens-lib :as ctob]
[app.common.uuid :as uuid] [app.common.uuid :as uuid]
[app.main.data.modal :as modal] [app.main.data.modal :as modal]
[app.main.data.tokens :as wdt] [app.main.data.tokens :as wdt]
@ -22,8 +23,8 @@
[{:keys [themes active-theme-ids on-close grouped?]}] [{:keys [themes active-theme-ids on-close grouped?]}]
(when (seq themes) (when (seq themes)
[:ul [:ul
(for [[_ {:keys [id name]}] themes (for [[_ {:keys [id group name] :as theme}] themes
:let [selected? (get active-theme-ids id)]] :let [selected? (get active-theme-ids (ctob/theme-path theme))]]
[:li {:key id [:li {:key id
:class (stl/css-case :class (stl/css-case
:checked-element true :checked-element true
@ -31,14 +32,14 @@
:is-selected selected?) :is-selected selected?)
:on-click (fn [e] :on-click (fn [e]
(dom/stop-propagation e) (dom/stop-propagation e)
(st/emit! (wdt/toggle-token-theme id)) (st/emit! (wdt/toggle-token-theme-active? group name))
(on-close))} (on-close))}
[:span {:class (stl/css :label)} name] [:span {:class (stl/css :label)} name]
[:span {:class (stl/css :check-icon)} i/tick]])])) [:span {:class (stl/css :check-icon)} i/tick]])]))
(mf/defc theme-options (mf/defc theme-options
[{:keys [on-close]}] [{:keys [on-close]}]
(let [active-theme-ids (dm/fixme (mf/deref refs/workspace-active-theme-ids)) (let [active-theme-ids (dm/fixme (mf/deref refs/workspace-active-theme-paths))
theme-groups (mf/deref refs/workspace-token-theme-tree)] theme-groups (mf/deref refs/workspace-token-theme-tree)]
[:ul [:ul
(for [[group themes] theme-groups] (for [[group themes] theme-groups]
@ -59,7 +60,7 @@
[{:keys []}] [{:keys []}]
(let [;; Store (let [;; Store
temp-theme-id (dm/legacy (mf/deref refs/workspace-temp-theme-id)) temp-theme-id (dm/legacy (mf/deref refs/workspace-temp-theme-id))
active-theme-ids (dm/legacy (-> (mf/deref refs/workspace-active-theme-ids) active-theme-ids (dm/legacy (-> (mf/deref refs/workspace-active-theme-paths)
(disj temp-theme-id))) (disj temp-theme-id)))
active-themes-count (count active-theme-ids) active-themes-count (count active-theme-ids)
themes (mf/deref refs/workspace-token-theme-tree) themes (mf/deref refs/workspace-token-theme-tree)