From 6f7b69c7ee5fff6eb591f4d2dbd02d7a5950426a Mon Sep 17 00:00:00 2001 From: Florian Schroedl Date: Fri, 23 Aug 2024 16:58:49 +0200 Subject: [PATCH] Allow toggling individual set themes --- frontend/src/app/main/data/tokens.cljs | 5 ++-- frontend/src/app/main/refs.cljs | 4 +++ frontend/src/app/main/ui.cljs | 2 ++ .../ui/workspace/tokens/modals/themes.cljs | 26 +++++++++---------- .../app/main/ui/workspace/tokens/sets.cljs | 4 +-- .../main/ui/workspace/tokens/token_set.cljs | 3 +++ 6 files changed, 26 insertions(+), 18 deletions(-) diff --git a/frontend/src/app/main/data/tokens.cljs b/frontend/src/app/main/data/tokens.cljs index d40734f70..58cc38f75 100644 --- a/frontend/src/app/main/data/tokens.cljs +++ b/frontend/src/app/main/data/tokens.cljs @@ -157,11 +157,12 @@ (rx/of (dch/commit-changes changes))))))) -(defn toggle-token-set [token-set-id] +(defn toggle-token-set [{:keys [token-set-id token-theme-id]}] (ptk/reify ::toggle-token-set ptk/WatchEvent (watch [it state _] - (let [theme (some-> (wtts/update-theme-id state) + (js/console.log "token-set-id token-theme-id" token-set-id token-theme-id) + (let [theme (some-> (or token-theme-id (wtts/update-theme-id state)) (wtts/get-workspace-token-theme state)) changes (-> (pcb/empty-changes it) (pcb/update-token-theme diff --git a/frontend/src/app/main/refs.cljs b/frontend/src/app/main/refs.cljs index b1177e8c2..dcf7381f1 100644 --- a/frontend/src/app/main/refs.cljs +++ b/frontend/src/app/main/refs.cljs @@ -240,6 +240,10 @@ st/state =)) +(defn workspace-token-theme + [id] + (l/derived #(wtts/get-workspace-theme id %) st/state)) + (def workspace-active-theme-ids (l/derived wtts/get-active-theme-ids st/state)) diff --git a/frontend/src/app/main/ui.cljs b/frontend/src/app/main/ui.cljs index 60803b2ee..345265587 100644 --- a/frontend/src/app/main/ui.cljs +++ b/frontend/src/app/main/ui.cljs @@ -6,6 +6,7 @@ (ns app.main.ui (:require + [app.main.ui.workspace.tokens.modals.themes :as wtmt] [app.config :as cf] [app.main.refs :as refs] [app.main.store :as st] @@ -191,6 +192,7 @@ [:& (mf/provider ctx/current-route) {:value route} [:& (mf/provider ctx/current-profile) {:value profile} + [:& wtmt/modal] (if edata [:& static/exception-page {:data edata :route route}] [:* diff --git a/frontend/src/app/main/ui/workspace/tokens/modals/themes.cljs b/frontend/src/app/main/ui/workspace/tokens/modals/themes.cljs index 7d9467bb8..9720bb16a 100644 --- a/frontend/src/app/main/ui/workspace/tokens/modals/themes.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/modals/themes.cljs @@ -52,7 +52,7 @@ (dom/prevent-default e) (dom/stop-propagation e) (set-state (fn [_] {:type :edit-theme - :theme theme})))] + :theme-id (:id theme)})))] [:div [:ul {:class (stl/css :theme-group-wrapper)} (for [[group themes] themes] @@ -96,27 +96,25 @@ (mf/defc edit-theme [{:keys [state]}] - (let [{:keys [theme]} @state + (let [{:keys [theme-id]} @state token-sets (mf/deref refs/workspace-token-sets) - selected-token-set-id (mf/deref refs/workspace-selected-token-set-id) - token-set-selected? (mf/use-callback - (mf/deps selected-token-set-id) - (fn [id] - (= id selected-token-set-id))) - active-token-set-ids (mf/deref refs/workspace-active-set-ids) + theme (mf/deref (refs/workspace-token-theme theme-id)) token-set-active? (mf/use-callback - (mf/deps active-token-set-ids) + (mf/deps (:sets theme)) (fn [id] - (get active-token-set-ids id)))] + (get-in theme [:sets id]))) + on-toggle-token-set (mf/use-callback + (mf/deps (:id theme)) + (fn [token-set-id] + (st/emit! (wdt/toggle-token-set {:token-set-id token-set-id + :token-theme-id (:id theme)}))))] [:div {:class (stl/css :sets-list-wrapper)} [:& wts/controlled-sets-list {:token-sets token-sets :token-set-selected? (constantly false) :token-set-active? token-set-active? - :on-select (fn [id] - (js/console.log "id" id)) - :on-toggle (fn [id] - (js/console.log "id" id))}]])) + :on-select on-toggle-token-set + :on-toggle on-toggle-token-set}]])) (mf/defc themes [{:keys [] :as _args}] diff --git a/frontend/src/app/main/ui/workspace/tokens/sets.cljs b/frontend/src/app/main/ui/workspace/tokens/sets.cljs index 00d8da654..a7813a9ea 100644 --- a/frontend/src/app/main/ui/workspace/tokens/sets.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/sets.cljs @@ -17,8 +17,8 @@ (def ^:private chevron-icon (i/icon-xref :arrow (stl/css :chevron-icon))) -(defn on-toggle-token-set-click [id] - (st/emit! (wdt/toggle-token-set id))) +(defn on-toggle-token-set-click [token-set-id] + (st/emit! (wdt/toggle-token-set {:token-set-id token-set-id}))) (defn on-select-token-set-click [id] (st/emit! (wdt/set-selected-token-set-id id))) diff --git a/frontend/src/app/main/ui/workspace/tokens/token_set.cljs b/frontend/src/app/main/ui/workspace/tokens/token_set.cljs index 858183250..488c85bf4 100644 --- a/frontend/src/app/main/ui/workspace/tokens/token_set.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/token_set.cljs @@ -12,6 +12,9 @@ (defn get-workspace-themes [state] (get-in state [:workspace-data :token-themes] [])) +(defn get-workspace-theme [id state] + (get-in state [:workspace-data :token-themes-index id])) + (defn get-workspace-themes-index [state] (get-in state [:workspace-data :token-themes-index] {}))