From 7eb9142a4de974a1f121890d424ecd5e8445bcdc Mon Sep 17 00:00:00 2001 From: Xaviju Date: Wed, 22 Jan 2025 23:50:24 +0100 Subject: [PATCH] :sparkles: Add tokens metrics events --- frontend/src/app/main/data/tokens.cljs | 6 +++++- frontend/src/app/main/ui/workspace/sidebar.cljs | 8 +++++++- .../src/app/main/ui/workspace/tokens/changes.cljs | 4 +++- .../app/main/ui/workspace/tokens/modals/themes.cljs | 8 +++++++- frontend/src/app/main/ui/workspace/tokens/sets.cljs | 3 +++ .../src/app/main/ui/workspace/tokens/sidebar.cljs | 12 +++++++++--- 6 files changed, 34 insertions(+), 7 deletions(-) diff --git a/frontend/src/app/main/data/tokens.cljs b/frontend/src/app/main/data/tokens.cljs index 7c873ccef..70d8a3e65 100644 --- a/frontend/src/app/main/data/tokens.cljs +++ b/frontend/src/app/main/data/tokens.cljs @@ -13,8 +13,10 @@ [app.common.types.shape :as cts] [app.common.types.tokens-lib :as ctob] [app.main.data.changes :as dch] + [app.main.data.event :as ev] [app.main.data.helpers :as dsh] [app.main.data.workspace.shapes :as dwsh] + [app.main.store :as st] [app.main.ui.workspace.tokens.token-set :as wtts] [app.main.ui.workspace.tokens.update :as wtu] [beicon.v2.core :as rx] @@ -245,7 +247,9 @@ ;; Either update or add token to existing set (if-let [prev-token (ctob/get-token token-set (or prev-token-name (:name token)))] (pcb/update-token (pcb/empty-changes) (:name token-set) token prev-token) - (pcb/add-token (pcb/empty-changes) (:name token-set) token)))] + (do + (st/emit! (ptk/event ::ev/event {::ev/name "create-tokens"})) + (pcb/add-token (pcb/empty-changes) (:name token-set) token))))] (rx/of (set-selected-token-set-path-from-name token-set-name) (dch/commit-changes changes)))))) diff --git a/frontend/src/app/main/ui/workspace/sidebar.cljs b/frontend/src/app/main/ui/workspace/sidebar.cljs index 3a9584351..788aea01b 100644 --- a/frontend/src/app/main/ui/workspace/sidebar.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar.cljs @@ -9,6 +9,7 @@ (:require [app.common.data.macros :as dm] [app.main.data.common :as dcm] + [app.main.data.event :as ev] [app.main.data.workspace :as dw] [app.main.features :as features] [app.main.refs :as refs] @@ -33,6 +34,7 @@ [app.main.ui.workspace.tokens.sidebar :refer [tokens-sidebar-tab]] [app.util.debug :as dbg] [app.util.i18n :refer [tr]] + [potok.v2.core :as ptk] [rumext.v2 :as mf])) ;; --- Left Sidebar (Component) @@ -87,7 +89,11 @@ (mf/use-fn #(st/emit! (dw/toggle-layout-flag :collapse-left-sidebar))) on-tab-change - (mf/use-fn #(st/emit! (dcm/go-to-workspace :layout (keyword %)))) + (mf/use-fn + (fn [id] + (when (= id "tokens") + (st/emit! (ptk/event ::ev/event {::ev/name "open-tokens-tab"}))) + (st/emit! (dcm/go-to-workspace :layout (keyword id))))) layers-tab (mf/html diff --git a/frontend/src/app/main/ui/workspace/tokens/changes.cljs b/frontend/src/app/main/ui/workspace/tokens/changes.cljs index 2e458dd95..ae85600e7 100644 --- a/frontend/src/app/main/ui/workspace/tokens/changes.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/changes.cljs @@ -9,6 +9,7 @@ [app.common.types.shape.radius :as ctsr] [app.common.types.token :as ctt] [app.common.types.tokens-lib :as ctob] + [app.main.data.event :as ev] [app.main.data.helpers :as dsh] [app.main.data.workspace :as udw] [app.main.data.workspace.colors :as wdc] @@ -46,6 +47,7 @@ resolved-value (get-in resolved-tokens [(wtt/token-identifier token) :resolved-value]) tokenized-attributes (wtt/attributes-map attributes token)] (rx/of + (st/emit! (ptk/event ::ev/event {::ev/name "apply-tokens"})) (dwu/start-undo-transaction undo-id) (dwsh/update-shapes shape-ids (fn [shape] (cond-> shape @@ -101,7 +103,7 @@ :attrs ctt/border-radius-keys})) (defn update-shape-radius-single-corner [value shape-ids attributes] - ;; NOTE: This key should be namespaced on data tokens, but these events are not there. + ;; NOTE: This key should be namespaced on data tokens, but these events are not there. (st/emit! (ptk/data-event :expand-border-radius)) (dwsh/update-shapes shape-ids (fn [shape] 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 342b1e3d4..95a3b8ed2 100644 --- a/frontend/src/app/main/ui/workspace/tokens/modals/themes.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/modals/themes.cljs @@ -9,6 +9,7 @@ (:require [app.common.data.macros :as dm] [app.common.types.tokens-lib :as ctob] + [app.main.data.event :as ev] [app.main.data.modal :as modal] [app.main.data.tokens :as wdt] [app.main.refs :as refs] @@ -26,6 +27,7 @@ [app.util.dom :as dom] [app.util.i18n :refer [tr]] [cuerdas.core :as str] + [potok.v2.core :as ptk] [rumext.v2 :as mf])) (mf/defc empty-themes @@ -208,7 +210,11 @@ (let [{:keys [dropdown-open? _on-open-dropdown on-close-dropdown on-toggle-dropdown]} (wtco/use-dropdown-open-state) theme (ctob/make-token-theme :name "") on-back #(set-state (constantly {:type :themes-overview})) - on-submit #(st/emit! (wdt/create-token-theme %)) + on-submit (mf/use-fn + (fn [theme] + (st/emit! (ptk/event ::ev/event {::ev/name "create-tokens-theme"})) + (st/emit! (wdt/create-token-theme theme)))) + theme-state (mf/use-state theme) disabled? (-> (:name @theme-state) (str/trim) diff --git a/frontend/src/app/main/ui/workspace/tokens/sets.cljs b/frontend/src/app/main/ui/workspace/tokens/sets.cljs index 72b912243..9102a7fb9 100644 --- a/frontend/src/app/main/ui/workspace/tokens/sets.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/sets.cljs @@ -9,6 +9,7 @@ (:require [app.common.data.macros :as dm] [app.common.types.tokens-lib :as ctob] + [app.main.data.event :as ev] [app.main.data.tokens :as wdt] [app.main.refs :as refs] [app.main.store :as st] @@ -20,6 +21,7 @@ [app.util.i18n :refer [tr]] [app.util.keyboard :as kbd] [cuerdas.core :as str] + [potok.v2.core :as ptk] [rumext.v2 :as mf])) (defn on-toggle-token-set-click [token-set-name] @@ -44,6 +46,7 @@ (ctob/join-set-path-str to-path-str))))) (defn on-create-token-set [_ token-set] + (st/emit! (ptk/event ::ev/event {::ev/name "create-tokens-set"})) (st/emit! (wdt/create-token-set token-set))) (mf/defc editing-label diff --git a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs index 1fc420ee2..12b99703a 100644 --- a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs @@ -10,12 +10,14 @@ [app.common.data :as d] [app.common.data.macros :as dm] [app.common.types.tokens-lib :as ctob] + [app.main.data.event :as ev] [app.main.data.modal :as modal] [app.main.data.notifications :as ntf] [app.main.data.tokens :as dt] [app.main.refs :as refs] [app.main.store :as st] - [app.main.ui.components.dropdown-menu :refer [dropdown-menu dropdown-menu-item*]] + [app.main.ui.components.dropdown-menu :refer [dropdown-menu + dropdown-menu-item*]] [app.main.ui.components.title-bar :refer [title-bar]] [app.main.ui.ds.buttons.button :refer [button*]] [app.main.ui.ds.buttons.icon-button :refer [icon-button*]] @@ -39,6 +41,7 @@ [app.util.webapi :as wapi] [beicon.v2.core :as rx] [okulary.core :as l] + [potok.v2.core :as ptk] [rumext.v2 :as mf] [shadow.resource])) @@ -108,6 +111,7 @@ (fn [event token] (dom/stop-propagation event) (when (seq selected-shapes) + (st/emit! (wtch/toggle-token {:token token :shapes selected-shapes @@ -303,7 +307,7 @@ (reset! show-menu* false))) input-ref (mf/use-ref) - on-option-click + on-display-file-explorer (mf/use-fn #(.click (mf/ref-val input-ref))) @@ -313,6 +317,7 @@ (->> (wapi/read-file-as-text file) (sd/process-json-stream) (rx/subs! (fn [lib] + (st/emit! (ptk/event ::ev/event {::ev/name "import-tokens"})) (st/emit! (dt/import-tokens-lib lib))) (fn [err] (js/console.error err) @@ -322,6 +327,7 @@ :timeout 9000}))))) (set! (.-value (mf/ref-val input-ref)) ""))) on-export (fn [] + (st/emit! (ptk/event ::ev/event {::ev/name "export-tokens"})) (let [tokens-json (some-> (deref refs/tokens-lib) (ctob/encode-dtcg) (clj->js) @@ -346,7 +352,7 @@ :list-class (stl/css :import-export-menu)} (when can-edit? [:> dropdown-menu-item* {:class (stl/css :import-export-menu-item) - :on-click on-option-click} + :on-click on-display-file-explorer} (tr "labels.import")]) [:> dropdown-menu-item* {:class (stl/css :import-export-menu-item)