3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-06-10 22:21:41 +02:00
Code Issues Projects Releases Packages Wiki Activity

♻️ Refactor forms

Browse source 
Mainly replace spec with schema with better
and more reusable validations
This commit is contained in:
Andrey Antukh 2024-06-13 11:43:21 +02:00
parent f095e1b29f
commit 7be79c10fd
62 changed files with 786 additions and 1165 deletions
Download patch file Download diff file Expand all files Collapse all files

56
frontend/src/app/main/ui/settings/change_email.cljs
View file

@ -7,9 +7,7 @@
(ns app.main.ui.settings.change-email
(:require-macros [app.main.style :as stl])
(:require
[app.common.data :as d]
[app.common.data.macros :as dma]
[app.common.spec :as us]
[app.common.schema :as sm]
[app.main.data.messages :as msg]
[app.main.data.modal :as modal]
[app.main.data.users :as du]
@ -20,24 +18,8 @@
[app.main.ui.notifications.context-notification :refer [context-notification]]
[app.util.i18n :as i18n :refer [tr]]
[beicon.v2.core :as rx]
[cljs.spec.alpha :as s]
[rumext.v2 :as mf]))
(s/def ::email-1 ::us/email)
(s/def ::email-2 ::us/email)
(defn- email-equality
[errors data]
(let [email-1 (:email-1 data)
email-2 (:email-2 data)]
(cond-> errors
(and email-1 email-2 (not= email-1 email-2))
(assoc :email-2 {:message (tr "errors.email-invalid-confirmation")
:code :different-emails}))))
(s/def ::email-change-form
(s/keys :req-un [::email-1 ::email-2]))
(defn- on-error
[form error]
(case (:code (ex-data error))
@ -71,30 +53,32 @@
:on-success (partial on-success profile)}]
(st/emit! (du/request-email-change (with-meta params mdata)))))
(def ^:private schema:email-change-form
[:and
[:map {:title "EmailChangeForm"}
[:email-1 ::sm/email]
[:email-2 ::sm/email]]
[:fn {:error/code "errors.invalid-email-confirmation"
:error/field :email-2}
(fn [data]
(let [email-1 (:email-1 data)
email-2 (:email-2 data)]
(= email-1 email-2)))]])
(mf/defc change-email-modal
{::mf/register modal/components
::mf/register-as :change-email}
[]
(let [profile (mf/deref refs/profile)
form (fm/use-form :spec ::email-change-form
:validators [email-equality]
form (fm/use-form :schema schema:email-change-form
:initial profile)
on-close
(mf/use-callback #(st/emit! (modal/hide)))
(mf/use-fn #(st/emit! (modal/hide)))
on-submit
(mf/use-callback
(mf/use-fn
(mf/deps profile)
(partial on-submit profile))
on-email-change
(mf/use-callback
(fn [_ _]
(let [different-emails-error? (= (dma/get-in @form [:errors :email-2 :code]) :different-emails)
email-1 (dma/get-in @form [:clean-data :email-1])
email-2 (dma/get-in @form [:clean-data :email-2])]
(when (and different-emails-error? (= email-1 email-2))
(swap! form d/dissoc-in [:errors :email-2])))))]
(partial on-submit profile))]
[:div {:class (stl/css :modal-overlay)}
[:div {:class (stl/css :modal-container)}
@ -118,16 +102,14 @@
:name :email-1
:label (tr "modals.change-email.new-email")
:trim true
:show-success? true
:on-change-value on-email-change}]]
:show-success? true}]]
[:div {:class (stl/css :fields-row)}
[:& fm/input {:type "email"
:name :email-2
:label (tr "modals.change-email.confirm-email")
:trim true
:show-success? true
:on-change-value on-email-change}]]]
:show-success? true}]]]
[:div {:class (stl/css :modal-footer)}
[:div {:class (stl/css :action-buttons)