-
Notifications
You must be signed in to change notification settings - Fork 160
fix: autofocus on text input when open ended question is rendered #2024
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
Size Change: -438 B (-0.01%) Total Size: 3.55 MB
ℹ️ View Unchanged
|
b898f0e
to
bea4bc8
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
PR Summary
Improves survey UX by implementing consistent autofocus behavior for open text questions. This change relocates autofocus logic from the popup visibility hook to individual question components.
- Moves autofocus from
usePopupVisibility
hook toOpenTextQuestion
component, enabling focus on any open text question, not just the first one - Implements autofocus using
useRef
anduseEffect
with a 100ms delay to ensure reliable focus - Removes duplicative focus management code, simplifying the component architecture
- Fixes minor CSS class name formatting by removing leading space in multiple choice questions
2 files reviewed, 1 comment
Edit PR Review Bot Settings | Greptile
useEffect(() => { | ||
setTimeout(() => { | ||
inputRef.current?.focus() | ||
}, 100) | ||
}, []) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
style: Consider adding cleanup to clear timeout if component unmounts before timeout fires
useEffect(() => { | |
setTimeout(() => { | |
inputRef.current?.focus() | |
}, 100) | |
}, []) | |
useEffect(() => { | |
const timer = setTimeout(() => { | |
inputRef.current?.focus() | |
}, 100) | |
return () => clearTimeout(timer) | |
}, []) |
Changes
Moves the autofocus on for open text directly into the question component. It simplifies the logic, plus now it autofocus for any question, not just the first one (i.e. last question is an open ended)