From df48295903b67d171ad471dde4f7c194d99f349e Mon Sep 17 00:00:00 2001 From: Florian Schroedl Date: Fri, 10 May 2024 10:22:09 +0200 Subject: [PATCH 1/3] Add resolving function and move to core ns --- .../app/main/ui/workspace/tokens/core.cljs | 20 ++++++++++++++++ .../app/main/ui/workspace/tokens/sidebar.cljs | 23 +++---------------- 2 files changed, 23 insertions(+), 20 deletions(-) diff --git a/frontend/src/app/main/ui/workspace/tokens/core.cljs b/frontend/src/app/main/ui/workspace/tokens/core.cljs index 1657504cb..29258369b 100644 --- a/frontend/src/app/main/ui/workspace/tokens/core.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/core.cljs @@ -9,6 +9,7 @@ [app.common.data :as d :refer [ordered-map]] [app.common.types.shape.radius :as ctsr] [app.common.types.token :as ctt] + [app.main.data.tokens :as dt] [app.main.data.workspace.changes :as dch] [app.main.data.workspace.transforms :as dwt] [app.main.store :as st])) @@ -29,8 +30,27 @@ [token shapes token-attributes] (some #(token-applied? token % token-attributes) shapes)) +(defn resolve-token-value [value] + (if-let [int-or-double (d/parse-double value)] + int-or-double + (throw (ex-info (str "Implement token value resolve for " value) value)))) + ;; Update functions ------------------------------------------------------------ +(defn on-apply-token [{:keys [token token-type-props selected-shapes] :as _props}] + (let [{:keys [attributes on-apply on-update-shape] + :or {on-apply dt/update-token-from-attributes}} token-type-props + shape-ids (->> selected-shapes + (eduction + (remove #(tokens-applied? token % attributes)) + (map :id))) + token-value (resolve-token-value (:value token))] + (doseq [shape selected-shapes] + (st/emit! (on-apply {:token-id (:id token) + :shape-id (:id shape) + :attributes attributes})) + (on-update-shape token-value shape-ids)))) + (defn update-shape-radius [value shape-ids] (st/emit! (dch/update-shapes shape-ids diff --git a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs index 1aaaaf034..ce44eeec9 100644 --- a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs @@ -7,12 +7,9 @@ (ns app.main.ui.workspace.tokens.sidebar (:require-macros [app.main.style :as stl]) (:require - [app.common.data :as d] [app.main.data.modal :as modal] - [app.main.data.tokens :as dt] [app.main.refs :as refs] [app.main.store :as st] - [app.main.ui.components.search-bar :refer [search-bar]] [app.main.ui.icons :as i] [app.main.ui.workspace.sidebar.assets.common :as cmm] [app.main.ui.workspace.tokens.common :refer [workspace-shapes]] @@ -20,20 +17,6 @@ [app.util.dom :as dom] [rumext.v2 :as mf])) -(defn on-apply-token [{:keys [token token-type-props selected-shapes] :as _props}] - (let [{:keys [attributes on-apply on-update-shape] - :or {on-apply dt/update-token-from-attributes}} token-type-props - shape-ids (->> selected-shapes - (eduction - (remove #(tokens-applied? token % attributes)) - (map :id))) - token-value (d/parse-integer (:value token))] - (doseq [shape selected-shapes] - (st/emit! (on-apply {:token-id (:id token) - :shape-id (:id shape) - :attributes attributes})) - (on-update-shape token-value shape-ids)))) - (mf/defc token-pill {::mf/wrap-props false} [{:keys [on-click token highlighted?]}] @@ -66,9 +49,9 @@ (mf/deps selected-shapes token-type-props) (fn [event token] (dom/stop-propagation event) - (on-apply-token {:token token - :token-type-props token-type-props - :selected-shapes selected-shapes}))) + (wtc/on-apply-token {:token token + :token-type-props token-type-props + :selected-shapes selected-shapes}))) tokens-count (count tokens)] [:div {:on-click on-toggle-open-click} [:& cmm/asset-section {:file-id (:id file) From 5813acea02f09ab9adb5566899181a5b06d6e809 Mon Sep 17 00:00:00 2001 From: Florian Schroedl Date: Fri, 10 May 2024 10:26:22 +0200 Subject: [PATCH 2/3] Log whole token --- frontend/src/app/main/ui/workspace/tokens/core.cljs | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/frontend/src/app/main/ui/workspace/tokens/core.cljs b/frontend/src/app/main/ui/workspace/tokens/core.cljs index 29258369b..a8c4528f5 100644 --- a/frontend/src/app/main/ui/workspace/tokens/core.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/core.cljs @@ -30,10 +30,10 @@ [token shapes token-attributes] (some #(token-applied? token % token-attributes) shapes)) -(defn resolve-token-value [value] +(defn resolve-token-value [{:keys [value] :as token}] (if-let [int-or-double (d/parse-double value)] int-or-double - (throw (ex-info (str "Implement token value resolve for " value) value)))) + (throw (ex-info (str "Implement token value resolve for " value) token)))) ;; Update functions ------------------------------------------------------------ @@ -44,7 +44,7 @@ (eduction (remove #(tokens-applied? token % attributes)) (map :id))) - token-value (resolve-token-value (:value token))] + token-value (resolve-token-value token)] (doseq [shape selected-shapes] (st/emit! (on-apply {:token-id (:id token) :shape-id (:id shape) From 42b25479b34810633ed2ba922bdcd52bd6919e6d Mon Sep 17 00:00:00 2001 From: Florian Schroedl Date: Fri, 10 May 2024 10:36:56 +0200 Subject: [PATCH 3/3] Highlight invalid token values --- frontend/src/app/main/ui/workspace/tokens/sidebar.cljs | 10 +++++++--- frontend/src/app/main/ui/workspace/tokens/sidebar.scss | 5 +++++ 2 files changed, 12 insertions(+), 3 deletions(-) diff --git a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs index ce44eeec9..3926ed056 100644 --- a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs @@ -20,10 +20,14 @@ (mf/defc token-pill {::mf/wrap-props false} [{:keys [on-click token highlighted?]}] - (let [{:keys [name value]} token] + (let [{:keys [name value]} token + resolved-value (try + (wtc/resolve-token-value token) + (catch js/Error _ nil))] [:div {:class (stl/css-case :token-pill true - :token-pill-highlighted highlighted?) - :title (str "Token value: " value) + :token-pill-highlighted highlighted? + :token-pill-invalid (not resolved-value)) + :title (str (if resolved-value "Token value: " "Invalid token value: ") value) :on-click on-click} name])) diff --git a/frontend/src/app/main/ui/workspace/tokens/sidebar.scss b/frontend/src/app/main/ui/workspace/tokens/sidebar.scss index 75cd515bc..3a0284050 100644 --- a/frontend/src/app/main/ui/workspace/tokens/sidebar.scss +++ b/frontend/src/app/main/ui/workspace/tokens/sidebar.scss @@ -27,4 +27,9 @@ color: var(--button-primary-foreground-color-rest); background: var(--button-primary-background-color-rest); } + + &.token-pill-invalid { + color: var(--status-color-error-500); + opacity: 0.8; + } }