bigbuffet/bigbuffet-rw
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'compose-form-focus' into 'develop'

Browse source 
Compose: Don't focus on spoiler input on first render

See merge request soapbox-pub/soapbox!2659
This commit is contained in:
marcin mikołajczak 2023-09-10 16:19:13 +00:00
commit 6319a4f65a
No known key found for this signature in database
2 changed files with 21 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
app/soapbox/features/compose/components/compose-form.tsx
View file

@ -89,6 +89,7 @@ const ComposeForm = <ID extends string>({ id, shouldCondense, autoFocus, clickab
const [composeFocused, setComposeFocused] = useState(false); const [composeFocused, setComposeFocused] = useState(false);
const firstRender = useRef(true);
const formRef = useRef<HTMLDivElement>(null); const formRef = useRef<HTMLDivElement>(null);
const spoilerTextRef = useRef<AutosuggestInput>(null); const spoilerTextRef = useRef<AutosuggestInput>(null);
const autosuggestTextareaRef = useRef<AutosuggestTextarea>(null); const autosuggestTextareaRef = useRef<AutosuggestTextarea>(null);
@ -214,10 +215,13 @@ const ComposeForm = <ID extends string>({ id, shouldCondense, autoFocus, clickab
}, []); }, []);
useEffect(() => { useEffect(() => {
if (spoiler && !prevSpoiler) { if (firstRender.current) {
focusSpoilerInput(); focusTextarea();
firstRender.current = false;
} else if (!spoiler && prevSpoiler) { } else if (!spoiler && prevSpoiler) {
focusTextarea(); focusTextarea();
} else if (spoiler && !prevSpoiler) {
focusSpoilerInput();
} }
}, [spoiler]); }, [spoiler]);
@ -320,7 +324,7 @@ const ComposeForm = <ID extends string>({ id, shouldCondense, autoFocus, clickab
id='compose-textarea' id='compose-textarea'
> >
{ {
!condensed && !condensed && (
<Stack space={4} className='compose-form__modifiers'> <Stack space={4} className='compose-form__modifiers'>
<UploadForm composeId={id} /> <UploadForm composeId={id} />
<PollForm composeId={id} /> <PollForm composeId={id} />
@ -335,6 +339,7 @@ const ComposeForm = <ID extends string>({ id, shouldCondense, autoFocus, clickab
<ScheduleFormContainer composeId={id} /> <ScheduleFormContainer composeId={id} />
</Stack> </Stack>
)
} }
</AutosuggestTextarea> </AutosuggestTextarea>