From 6eea633ca9dc232f2ab62cdd49976ca4a98527b4 Mon Sep 17 00:00:00 2001
From: Eva Marco <evamarcod@gmail.com>
Date: Tue, 14 Jan 2025 10:24:04 +0100
Subject: [PATCH] :bug: Fix some problems with error handling

---
 .../main/ui/workspace/tokens/context_menu.cljs    |  8 +++++---
 .../src/app/main/ui/workspace/tokens/sidebar.cljs |  2 ++
 .../ui/workspace/tokens/style_dictionary.cljs     |  8 +++++---
 .../app/main/ui/workspace/tokens/token_pill.cljs  | 15 ++++++++++++---
 4 files changed, 24 insertions(+), 9 deletions(-)

diff --git a/frontend/src/app/main/ui/workspace/tokens/context_menu.cljs b/frontend/src/app/main/ui/workspace/tokens/context_menu.cljs
index 9755ede9a..16f3992e1 100644
--- a/frontend/src/app/main/ui/workspace/tokens/context_menu.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/context_menu.cljs
@@ -321,8 +321,9 @@
          children]])]))
 
 (mf/defc menu-tree
-  [{:keys [selected-shapes submenu-offset submenu-direction type] :as context-data}]
-  (let [entries (if (seq selected-shapes)
+  [{:keys [selected-shapes submenu-offset submenu-direction type errors] :as context-data}]
+  (let [entries (if (and (not (some? errors))
+                         (seq selected-shapes))
                   (if (some? type)
                     (submenu-actions-selection-actions context-data)
                     (selection-actions context-data))
@@ -343,7 +344,7 @@
                  :selected? selected?}])])))
 
 (mf/defc token-context-menu-tree
-  [{:keys [width direction] :as mdata}]
+  [{:keys [width direction errors] :as mdata}]
   (let [objects (mf/deref refs/workspace-page-objects)
         selected (mf/deref refs/selected-shapes)
         selected-shapes (into [] (keep (d/getf objects)) selected)
@@ -354,6 +355,7 @@
      [:& menu-tree {:submenu-offset width
                     :submenu-direction direction
                     :token token
+                    :errors errors
                     :selected-token-set-path selected-token-set-path
                     :selected-shapes selected-shapes}]]))
 
diff --git a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs
index 740b24e4a..948092c33 100644
--- a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs
@@ -82,6 +82,7 @@
                            (st/emit! (dt/show-token-context-menu
                                       {:type :token
                                        :position (dom/get-client-position event)
+                                       :errors (:errors token)
                                        :token-name (:name token)}))))
 
         on-toggle-open-click (mf/use-fn
@@ -120,6 +121,7 @@
        [:> icon-button* {:on-click on-popover-open-click
                          :variant "ghost"
                          :icon "add"
+                        ;;  TODO: This needs translation
                          :aria-label (str "Add token: " title)}]]
       (when open?
         [:& cmm/asset-section-block {:role :content}
diff --git a/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs b/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs
index 25da4fbbb..8383573cd 100644
--- a/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs
@@ -174,6 +174,7 @@
   [err]
   (let [[header-1 header-2 & errors] (str/split err "\n")]
     (when (and
+          ;; TODO: This needs translations
            (= header-1 "Error: ")
            (= header-2 "Reference Errors:"))
       errors)))
@@ -206,10 +207,11 @@
 
 ;; === Errors
 
-(defn humanize-errors [{:keys [errors value] :as _token}]
+(defn humanize-errors [{:keys [errors] :as token}]
   (->> (map (fn [err]
-              (case err
-                :error.style-dictionary/missing-reference (str "Could not resolve reference token with the name: " value)
+              (case (:error/code err)
+                ;; TODO: This needs translations
+                :error.style-dictionary/missing-reference (str "Could not resolve reference token with the name: " (:error/value err))
                 nil))
             errors)
        (str/join "\n")))
diff --git a/frontend/src/app/main/ui/workspace/tokens/token_pill.cljs b/frontend/src/app/main/ui/workspace/tokens/token_pill.cljs
index 26575e8a2..7498881a7 100644
--- a/frontend/src/app/main/ui/workspace/tokens/token_pill.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/token_pill.cljs
@@ -7,6 +7,7 @@
    [app.main.ui.ds.foundations.utilities.token.token-status :refer [token-status-icon*]]
    [app.main.ui.workspace.tokens.style-dictionary :as sd]
    [app.main.ui.workspace.tokens.token :as wtt]
+   [app.util.dom :as dom]
    [app.util.i18n :refer [tr]]
    [cuerdas.core :as str]
    [rumext.v2 :as mf]))
@@ -21,6 +22,13 @@
                 (wtt/resolved-value-hex theme-token))
 
         color (or color (wtt/resolved-value-hex token))
+        on-click
+        (mf/use-callback
+         (mf/deps errors? on-click)
+         (fn [event]
+           (dom/stop-propagation event)
+           (when (and (not (seq errors)) on-click)
+             (on-click event))))
 
         token-status-id (cond
                           half-applied
@@ -35,14 +43,15 @@
                                    :token-pill-invalid-applied (and full-applied errors?))
               :type "button"
               :title (cond
-                       errors? (sd/humanize-errors token)
+                       errors? (if (nil? theme-token)
+                                 (tr "workspace.token-set.not-active")
+                                 (sd/humanize-errors token))
                        :else (->> [(str "Token: " name)
                                    (tr "workspace.token.original-value" value)
                                    (tr "workspace.token.resolved-value" resolved-value)]
                                   (str/join "\n")))
               :on-click on-click
-              :on-context-menu on-context-menu
-              :disabled errors?}
+              :on-context-menu on-context-menu}
      (cond
        errors?
        [:> icon*