diff --git a/app/soapbox/features/compose/editor/index.tsx b/app/soapbox/features/compose/editor/index.tsx index 5fd76e532..1b6ba47c5 100644 --- a/app/soapbox/features/compose/editor/index.tsx +++ b/app/soapbox/features/compose/editor/index.tsx @@ -7,6 +7,7 @@ This source code is licensed under the MIT license found in the LICENSE file in the /app/soapbox/features/compose/editor directory. */ import { $convertFromMarkdownString, $convertToMarkdownString, TRANSFORMERS } from '@lexical/markdown'; +import { AutoFocusPlugin } from '@lexical/react/LexicalAutoFocusPlugin'; import { LexicalComposer, InitialConfigType } from '@lexical/react/LexicalComposer'; import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'; import { ContentEditable } from '@lexical/react/LexicalContentEditable'; @@ -30,13 +31,13 @@ import FloatingLinkEditorPlugin from './plugins/floating-link-editor-plugin'; import FloatingTextFormatToolbarPlugin from './plugins/floating-text-format-toolbar-plugin'; import { MentionPlugin } from './plugins/mention-plugin'; -const StatePlugin = ({ composeId, autoFocus }: { composeId: string, autoFocus: boolean }) => { +const StatePlugin = ({ composeId }: { composeId: string }) => { const dispatch = useAppDispatch(); const [editor] = useLexicalComposerContext(); - useEffect(() => { - if (autoFocus) editor.focus(); + (window as any).xd = editor; + useEffect(() => { editor.registerUpdateListener(({ editorState }) => { dispatch(setEditorState(composeId, editorState.isEmpty() ? null : JSON.stringify(editorState.toJSON()))); }); @@ -65,6 +66,11 @@ const ComposeEditor = React.forwardRef(({ composeId, condensed, onF underline: 'underline', underlineStrikethrough: 'underline-line-through', }, + heading: { + h1: 'text-2xl font-bold', + h2: 'text-xl font-bold', + h3: 'text-lg font-semibold', + }, }, editorState: dispatch((_, getState) => { const state = getState(); @@ -111,9 +117,10 @@ const ComposeEditor = React.forwardRef(({ composeId, condensed, onF
} @@ -124,6 +131,7 @@ const ComposeEditor = React.forwardRef(({ composeId, condensed, onF )} ErrorBoundary={LexicalErrorBoundary} /> + {autoFocus && } { editor.update(() => { if (editorStateRef) (editorStateRef as any).current = $convertToMarkdownString(TRANSFORMERS); @@ -141,7 +149,7 @@ const ComposeEditor = React.forwardRef(({ composeId, condensed, onF )} - + );