fix(admin): resolve click-to-edit blur closure bug in profile form
continuous-integration/drone/push Build is passing Details

Fixed critical bug where EditableField component would close after typing
first character. Root cause was stale closure variable in onBlur handler.

Changes:
- Replace inline onBlur with handleBlur() function that evaluates current
  value at blur time instead of using stale hasValue closure variable
- Fixes issue where typing first char would set hasValue=true in closure,
  causing immediate blur to close input

Impact: Users can now fill in profile fields without being kicked out

Related: BUILD #19
master
Guillermo Pages 1 month ago
parent 36c5fe2183
commit 107f5c6799

@ -36,13 +36,20 @@ function EditableField({
}: EditableFieldProps) { }: EditableFieldProps) {
const hasValue = value && value.trim().length > 0; const hasValue = value && value.trim().length > 0;
function handleBlur() {
// Only close edit mode if field has content
if (value && value.trim().length > 0) {
onToggleEdit();
}
}
if (isEditing || !hasValue) { if (isEditing || !hasValue) {
return ( return (
<input <input
type={type} type={type}
value={value} value={value}
onChange={(e) => onChange(e.target.value)} onChange={(e) => onChange(e.target.value)}
onBlur={() => hasValue && onToggleEdit()} onBlur={handleBlur}
autoFocus autoFocus
placeholder={placeholder} placeholder={placeholder}
maxLength={maxLength} maxLength={maxLength}

Loading…
Cancel
Save