diff --git a/src/components/NotePostForm.tsx b/src/components/NotePostForm.tsx index 7b0d1c3..c44089c 100644 --- a/src/components/NotePostForm.tsx +++ b/src/components/NotePostForm.tsx @@ -1,4 +1,4 @@ -import { createSignal, createMemo, onMount, Show, For, type Component, type JSX } from 'solid-js'; +import { createSignal, createMemo, Show, For, type Component, type JSX } from 'solid-js'; import { createMutation } from '@tanstack/solid-query'; import ExclamationTriangle from 'heroicons/24/outline/exclamation-triangle.svg'; @@ -344,13 +344,6 @@ const NotePostForm: Component = (props) => { onEmojiSelect: handleEmojiSelect, })); - onMount(() => { - setTimeout(() => { - textAreaRef?.click(); - textAreaRef?.focus(); - }, 50); - }); - return (
diff --git a/src/components/SideBar.tsx b/src/components/SideBar.tsx index 5c83ef6..82b4973 100644 --- a/src/components/SideBar.tsx +++ b/src/components/SideBar.tsx @@ -93,7 +93,7 @@ const SideBar: Component = () => { createEffect(() => { if (formOpened() && textAreaRef != null) { - setTimeout(() => focusTextArea(), 100); + focusTextArea(); } }); diff --git a/src/components/event/TextNote.tsx b/src/components/event/TextNote.tsx index 1484b33..cd56119 100644 --- a/src/components/event/TextNote.tsx +++ b/src/components/event/TextNote.tsx @@ -23,13 +23,20 @@ export type TextNoteProps = { }; const TextNote: Component = (props) => { + let textAreaRef: HTMLTextAreaElement | undefined; + const i18n = useTranslation(); const { showProfile } = useModalState(); const timelineContext = useTimelineContext(); const [showReplyForm, setShowReplyForm] = createSignal(false); const closeReplyForm = () => setShowReplyForm(false); - const toggleReplyForm = () => setShowReplyForm((current) => !current); + const toggleReplyForm = () => { + setShowReplyForm((current) => !current); + if (showReplyForm() && textAreaRef != null) { + textAreaRef.focus(); + } + }; const event = createMemo(() => textNote(props.event)); @@ -113,6 +120,9 @@ const TextNote: Component = (props) => { footer={ { + textAreaRef = el; + }} mode="reply" replyTo={props.event} onClose={closeReplyForm}