diff --git a/CHANGES.md b/CHANGES.md index 2f032008fb..379c6fe641 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -24,6 +24,7 @@ - Fix wrong register image [Taiga #12955](https://tree.taiga.io/project/penpot/task/12955) - Fix error message on components doesn't close automatically [Taiga #12012](https://tree.taiga.io/project/penpot/issue/12012) - Fix incorrect default option on tokens import dialog [Github #8051](https://github.com/penpot/penpot/pull/8051) +- Fix unhandled exception tokens creation dialog [Github #8110](https://github.com/penpot/penpot/issues/8110) ## 2.13.0 (Unreleased) diff --git a/frontend/src/app/main/refs.cljs b/frontend/src/app/main/refs.cljs index 3577842a07..b443af8b2e 100644 --- a/frontend/src/app/main/refs.cljs +++ b/frontend/src/app/main/refs.cljs @@ -483,6 +483,9 @@ (def workspace-active-theme-paths (l/derived (d/nilf ctob/get-active-theme-paths) tokens-lib)) +(def workspace-all-tokens-map + (l/derived (d/nilf ctob/get-all-tokens-map) tokens-lib)) + (defn token-sets-at-path-all-active [group-path] (l/derived diff --git a/frontend/src/app/main/ui/workspace/tokens/management/forms/controls/color_input.cljs b/frontend/src/app/main/ui/workspace/tokens/management/forms/controls/color_input.cljs index ce18196c22..a4bfbf1b0c 100644 --- a/frontend/src/app/main/ui/workspace/tokens/management/forms/controls/color_input.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/management/forms/controls/color_input.cljs @@ -140,6 +140,9 @@ error (get-in @form [:errors input-name]) + extra-error + (get-in @form [:extra-errors input-name]) + value (get-in @form [:data input-name] "") @@ -247,9 +250,14 @@ :hint-type (:type hint)}) props - (if (and error touched?) + (cond + (and error touched?) (mf/spread-props props {:hint-type "error" :hint-message (:message error)}) + (and extra-error touched?) + (mf/spread-props props {:hint-type "error" + :hint-message (:message extra-error)}) + :else props)] (mf/with-effect [resolve-stream tokens token input-name] diff --git a/frontend/src/app/main/ui/workspace/tokens/management/forms/form_container.cljs b/frontend/src/app/main/ui/workspace/tokens/management/forms/form_container.cljs index 0d968beab0..af394eadee 100644 --- a/frontend/src/app/main/ui/workspace/tokens/management/forms/form_container.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/management/forms/form_container.cljs @@ -23,21 +23,19 @@ (let [token-type (or (:type token) token-type) - tokens-in-selected-set - (mf/deref refs/workspace-all-tokens-in-selected-set) - token-path (mf/with-memo [token] (cft/token-name->path (:name token))) - tokens-tree-in-selected-set - (mf/with-memo [token-path tokens-in-selected-set] - (-> (ctob/tokens-tree tokens-in-selected-set) + all-tokens (mf/deref refs/workspace-all-tokens-map) + + all-tokens + (mf/with-memo [token-path all-tokens] + (-> (ctob/tokens-tree all-tokens) (d/dissoc-in token-path))) props (mf/spread-props props {:token-type token-type - :tokens-tree-in-selected-set tokens-tree-in-selected-set - :tokens-in-selected-set tokens-in-selected-set + :all-token-tree all-tokens :token token}) text-case-props (mf/spread-props props {:input-value-placeholder (tr "workspace.tokens.text-case-value-enter")}) text-decoration-props (mf/spread-props props {:input-value-placeholder (tr "workspace.tokens.text-decoration-value-enter")}) diff --git a/frontend/src/app/main/ui/workspace/tokens/management/forms/generic_form.cljs b/frontend/src/app/main/ui/workspace/tokens/management/forms/generic_form.cljs index c5ab6a428a..69ade9d635 100644 --- a/frontend/src/app/main/ui/workspace/tokens/management/forms/generic_form.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/management/forms/generic_form.cljs @@ -16,6 +16,7 @@ [app.main.data.helpers :as dh] [app.main.data.modal :as modal] [app.main.data.workspace.tokens.application :as dwta] + [app.main.data.workspace.tokens.errors :as wte] [app.main.data.workspace.tokens.library-edit :as dwtl] [app.main.data.workspace.tokens.propagation :as dwtp] [app.main.data.workspace.tokens.remapping :as remap] @@ -88,14 +89,13 @@ action is-create selected-token-set-id - tokens-tree-in-selected-set + all-token-tree token-type make-schema input-component initial type value-subfield - tokens-in-selected-set input-value-placeholder] :as props}] (let [make-schema (or make-schema default-make-schema) @@ -124,6 +124,9 @@ tokens (mf/deref refs/workspace-active-theme-sets-tokens) + tokens-in-selected-set + (mf/deref refs/workspace-all-tokens-in-selected-set) + tokens (mf/with-memo [tokens tokens-in-selected-set token] ;; Ensure that the resolved value uses the currently editing token @@ -134,8 +137,8 @@ (assoc (:name token) token))) schema - (mf/with-memo [tokens-tree-in-selected-set active-tab] - (make-schema tokens-tree-in-selected-set active-tab)) + (mf/with-memo [all-token-tree active-tab] + (make-schema all-token-tree active-tab)) initial (mf/with-memo [token] @@ -224,7 +227,12 @@ :description description})) (dwtl/toggle-token-path path) (dwtp/propagate-workspace-tokens) - (modal/hide!))))))))))] + (modal/hide!))))) + ;; WORKAROUND: display validation errors in the form instead of crashing + (fn [{:keys [errors]}] + (let [error-messages (wte/humanize-errors errors) + error-message (first error-messages)] + (swap! form assoc-in [:extra-errors :value] {:message error-message}))))))))] [:> fc/form* {:class (stl/css :form-wrapper) :form form diff --git a/frontend/translations/es.po b/frontend/translations/es.po index f707ca20ee..10552a09eb 100644 --- a/frontend/translations/es.po +++ b/frontend/translations/es.po @@ -7965,7 +7965,7 @@ msgstr "Line height (multiplicador, px o %) o {alias}" #: src/app/main/data/workspace/tokens/errors.cljs:57 msgid "workspace.tokens.missing-references" -msgstr "Referéncias de tokens no encontradas:" +msgstr "Referencias de tokens no encontradas: " #: src/app/main/ui/workspace/tokens/management/token_pill.cljs:123 msgid "workspace.tokens.more-options"