From e0be30bb79f0d01d11e778d2be0d890246c8e729 Mon Sep 17 00:00:00 2001 From: Florian Schroedl Date: Mon, 24 Jun 2024 15:58:19 +0200 Subject: [PATCH] Dont show error when unfocusing name input field, but keep form disabled --- .../src/app/main/ui/workspace/tokens/form.cljs | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) diff --git a/frontend/src/app/main/ui/workspace/tokens/form.cljs b/frontend/src/app/main/ui/workspace/tokens/form.cljs index ed8bc02fa..e86a6896a 100644 --- a/frontend/src/app/main/ui/workspace/tokens/form.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/form.cljs @@ -39,8 +39,14 @@ (defn finalize-name [name] (str/trim name)) -(defn finalize-value [name] - (str/trim name)) +(defn valid-name? [name] + (seq (finalize-name name))) + +(defn finalize-value [value] + (str/trim value)) + +(defn valid-value? [value] + (seq (finalize-value value))) ;; Component ------------------------------------------------------------------- @@ -117,12 +123,17 @@ ;; Name name (mf/use-var (or (:name token) "")) + name-touched? (mf/use-state (some? (:name token))) + on-name-touch (mf/use-callback + #(when (valid-name? (dom/get-target-val %)) + (reset! name-touched? true))) name-errors (mf/use-state nil) name-schema (mf/use-memo (mf/deps existing-token-names) #(token-name-schema existing-token-names)) on-update-name (mf/use-callback (debounce (fn [e] + (on-name-touch e) (let [value (dom/get-target-val e) errors (->> (finalize-name value) (m/explain name-schema))] @@ -147,7 +158,7 @@ disabled? (or @name-errors value-error? - (empty? (finalize-name (mf/ref-val name))))] + (not @name-touched?))] ;; on-submit (fn [e] ;; (dom/prevent-default e) @@ -169,6 +180,7 @@ :error? @name-errors :input-props {:default-value @name :auto-focus true + :on-blur on-name-touch :on-change on-update-name}}] (when @name-errors [:p {:class (stl/css :error)}