Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-15 09:11:21 -05:00
Code Issues Activity

🐛 Fix allow entering invalid emails into the invitation form

Browse source
This commit is contained in:
alonso.torres 2024-03-07 16:27:20 +01:00
parent 8a6882e155
commit ee4c56aa9b
2 changed files with 40 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

52
frontend/src/app/main/ui/components/forms.cljs
View file

@ -372,7 +372,10 @@
in-klass (str class " "
(stl/css-case
:inside-input true
:no-padding (pos? (count @items))))
:no-padding (pos? (count @items))
:invalid (and (some? valid-item-fn)
touched?
(not (valid-item-fn @value)))))
on-focus
(mf/use-fn #(reset! focus? true))
@ -394,27 +397,38 @@
(mf/use-fn
(mf/deps @value)
(fn [event]
(cond
(or (kbd/enter? event)
(kbd/comma? event))
(do
(dom/prevent-default event)
(dom/stop-propagation event)
(let [val (cond-> @value trim str/trim)]
(let [val (cond-> @value trim str/trim)]
(cond
(or (kbd/enter? event) (kbd/comma? event) (kbd/space? event))
(do
(dom/prevent-default event)
(dom/stop-propagation event)
;; Once enter/comma is pressed we mark it as touched
(swap! form assoc-in [:touched input-name] true)
;; Empty values means "submit" the form (whent some items have been added
(when (and (kbd/enter? event) (str/empty? @value) (not-empty @items))
(on-submit form))
(when (not (str/empty? @value))
(reset! value "")
(swap! items conj-dedup {:text val
:valid (valid-item-fn val)
:caution (caution-item-fn val)}))))
(and (kbd/backspace? event)
(str/empty? @value))
(do
(dom/prevent-default event)
(dom/stop-propagation event)
(swap! items (fn [items] (if (c/empty? items) items (pop items))))))))
;; If we have a string in the input we add it only if valid
(when (and (valid-item-fn val) (not (str/empty? @value)))
(reset! value "")
;; Once added the form is back as "untouched"
(swap! form assoc-in [:touched input-name] false)
;; This split will allow users to copy comma/space separated values of emails
(doseq [val (str/split val #",|\s+")]
(swap! items conj-dedup {:text (str/trim val)
:valid (valid-item-fn val)
:caution (caution-item-fn val)}))))
(and (kbd/backspace? event) (str/empty? @value))
(do
(dom/prevent-default event)
(dom/stop-propagation event)
(swap! items (fn [items] (if (c/empty? items) items (pop items)))))))))
on-blur
(mf/use-fn

7
frontend/src/app/main/ui/components/forms.scss
View file

@ -293,6 +293,13 @@
outline: none;
border: $s-1 solid var(--input-border-color-focus);
}
&.invalid {
border: $s-1 solid var(--input-border-color-error);
&:hover,
&:focus {
border: $s-1 solid var(--input-border-color-error);
}
}
}
label {
display: none;