From 7664d8bb38da9ae458a359fc0480d36a2314715d Mon Sep 17 00:00:00 2001 From: Camille Moussu <66134347+Eriikah@users.noreply.github.com> Date: Fri, 13 Feb 2026 15:57:23 +0100 Subject: [PATCH] [#548] peoplesearch validate input on blur (#550) Co-authored-by: Camille Moussu --- src/components/Attendees/PeopleSearch.tsx | 24 ++++++++++++++++++++++- 1 file changed, 23 insertions(+), 1 deletion(-) diff --git a/src/components/Attendees/PeopleSearch.tsx b/src/components/Attendees/PeopleSearch.tsx index e0f59aa..86f3585 100644 --- a/src/components/Attendees/PeopleSearch.tsx +++ b/src/components/Attendees/PeopleSearch.tsx @@ -92,6 +92,28 @@ export function PeopleSearch({ const searchPlaceholder = placeholder ?? t("peopleSearch.placeholder"); + const handleBlurCommit = useCallback( + (event: React.SyntheticEvent) => { + const trimmed = query.trim(); + if (!trimmed) return; + if (!isValidEmail(trimmed)) { + setInputError( + t("peopleSearch.invalidEmail").replace("%{email}", trimmed) + ); + return; + } + if (selectedUsers.find((u) => u.email === trimmed)) { + setQuery(""); + return; + } + setInputError(null); + const newUser: User = { email: trimmed, displayName: trimmed }; + onChange(event, [...selectedUsers, newUser]); + setQuery(""); + }, + [query, selectedUsers, onChange, t] + ); + useEffect(() => { let cancelled = false; @@ -230,7 +252,7 @@ export function PeopleSearch({ options={options} autoComplete={false} clearOnBlur={false} - blurOnSelect={true} + onBlur={freeSolo ? handleBlurCommit : undefined} open={ customRenderInput ? isOpen && !!query && (loading || options.length > 0)