ComposeEventModal: fix ComposeForm ref

src/features/ui/components/modals/compose-event-modal/compose-event-modal.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
 
 import {
@@ -29,8 +29,6 @@ import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
 
 import UploadButton from './upload-button';
 
-import type { LexicalEditor } from 'lexical';
-
 const messages = defineMessages({
   eventNamePlaceholder: { id: 'compose_event.fields.name_placeholder', defaultMessage: 'Name' },
   eventDescriptionPlaceholder: { id: 'compose_event.fields.description_placeholder', defaultMessage: 'Description' },
@@ -95,9 +93,8 @@ const ComposeEventModal: React.FC<IComposeEventModal> = ({ onClose }) => {
   const intl = useIntl();
   const dispatch = useAppDispatch();
 
-  const editorRef = useRef<LexicalEditor>(null);
-
   const [tab, setTab] = useState<'edit' | 'pending'>('edit');
+  const [text, setText] = useState('');
 
   const banner = useAppSelector((state) => state.compose_event.banner);
   const isUploading = useAppSelector((state) => state.compose_event.is_uploading);
@@ -168,7 +165,7 @@ const ComposeEventModal: React.FC<IComposeEventModal> = ({ onClose }) => {
   };
 
   const handleSubmit = () => {
-    dispatch(changeEditEventDescription(editorRef.current!));
+    dispatch(changeEditEventDescription(text));
     dispatch(submitEvent());
   };
 
@@ -237,12 +234,12 @@ const ComposeEventModal: React.FC<IComposeEventModal> = ({ onClose }) => {
         labelText={<FormattedMessage id='compose_event.fields.description_label' defaultMessage='Event description' />}
       >
         <ComposeEditor
-          ref={editorRef}
           className='block w-full rounded-md border border-gray-400 bg-white px-3 py-2 text-base text-gray-900 ring-1 placeholder:text-gray-600 focus-within:border-primary-500 focus-within:ring-primary-500 dark:border-gray-800 dark:bg-gray-900 dark:text-gray-100 dark:ring-gray-800 dark:placeholder:text-gray-600 dark:focus-within:border-primary-500 dark:focus-within:ring-primary-500 sm:text-sm'
           placeholderClassName='pt-2'
           composeId='compose-event-modal'
           placeholder={intl.formatMessage(messages.eventDescriptionPlaceholder)}
           handleSubmit={handleSubmit}
+          onChange={setText}
         />
       </FormGroup>
       <FormGroup