diff --git a/src/actions/settings.ts b/src/actions/settings.ts index b6f1346dc..57db0e438 100644 --- a/src/actions/settings.ts +++ b/src/actions/settings.ts @@ -48,7 +48,6 @@ const defaultSettings = ImmutableMap({ systemFont: false, demetricator: false, - wysiwyg: false, isDeveloper: false, diff --git a/src/features/compose/components/compose-form.tsx b/src/features/compose/components/compose-form.tsx index 2f3712843..e0533642d 100644 --- a/src/features/compose/components/compose-form.tsx +++ b/src/features/compose/components/compose-form.tsx @@ -1,6 +1,6 @@ import clsx from 'clsx'; import React, { useCallback, useEffect, useRef, useState } from 'react'; -import { defineMessages, FormattedMessage, useIntl, type MessageDescriptor } from 'react-intl'; +import { defineMessages, FormattedMessage, useIntl } from 'react-intl'; import { Link, useHistory } from 'react-router-dom'; import { length } from 'stringz'; @@ -19,7 +19,7 @@ import { Button, HStack, Stack } from 'soapbox/components/ui'; import EmojiPickerDropdown from 'soapbox/features/emoji/containers/emoji-picker-dropdown-container'; import Bundle from 'soapbox/features/ui/components/bundle'; import { ComposeEditor } from 'soapbox/features/ui/util/async-components'; -import { useAppDispatch, useAppSelector, useCompose, useDraggedFiles, useFeatures, useInstance, usePrevious, useSettings } from 'soapbox/hooks'; +import { useAppDispatch, useAppSelector, useCompose, useDraggedFiles, useFeatures, useInstance, usePrevious } from 'soapbox/hooks'; import { isMobile } from 'soapbox/is-mobile'; import QuotedStatusContainer from '../containers/quoted-status-container'; @@ -76,14 +76,24 @@ const ComposeForm = ({ id, shouldCondense, autoFocus, clickab const compose = useCompose(id); const showSearch = useAppSelector((state) => state.search.submitted && !state.search.hidden); - const isModalOpen = useAppSelector((state) => !!(state.modals.size && state.modals.last()!.modalType === 'COMPOSE')); const maxTootChars = configuration.getIn(['statuses', 'max_characters']) as number; const scheduledStatusCount = useAppSelector((state) => state.scheduled_statuses.size); const features = useFeatures(); - const wysiwygEditor = useSettings().get('wysiwyg'); + const { + spoiler, + spoiler_text: spoilerText, + privacy, + focusDate, + caretPosition, + is_submitting: isSubmitting, + is_changing_upload: + isChangingUpload, + is_uploading: isUploading, + schedule: scheduledAt, + group_id: groupId, + } = compose; - const { text: composeText, suggestions, spoiler, spoiler_text: spoilerText, privacy, focusDate, caretPosition, is_submitting: isSubmitting, is_changing_upload: isChangingUpload, is_uploading: isUploading, schedule: scheduledAt, group_id: groupId } = compose; const prevSpoiler = usePrevious(spoiler); const hasPoll = !!compose.poll; @@ -97,21 +107,10 @@ const ComposeForm = ({ id, shouldCondense, autoFocus, clickab const spoilerTextRef = useRef(null); const autosuggestTextareaRef = useRef(null); const editorStateRef = useRef(null); - const text = wysiwygEditor ? editorStateRef.current || '' : composeText; + const text = editorStateRef.current || ''; const { isDraggedOver } = useDraggedFiles(formRef); - const handleChange: React.ChangeEventHandler = (e) => { - dispatch(changeCompose(id, e.target.value)); - }; - - const handleKeyDown: React.KeyboardEventHandler = (e) => { - if (e.keyCode === 13 && (e.ctrlKey || e.metaKey)) { - handleSubmit(); - e.preventDefault(); // Prevent bubbling to other ComposeForm instances - } - }; - const getClickableArea = () => { return clickableAreaRef ? clickableAreaRef.current : formRef.current; }; @@ -146,15 +145,7 @@ const ComposeForm = ({ id, shouldCondense, autoFocus, clickab }; const handleSubmit = (e?: React.FormEvent) => { - if (wysiwygEditor) { - dispatch(changeCompose(id, editorStateRef.current!)); - } else { - if (text !== autosuggestTextareaRef.current?.textarea?.value) { - // Something changed the text inside the textarea (e.g. browser extensions like Grammarly) - // Update the state to match the current text - dispatch(changeCompose(id, autosuggestTextareaRef.current!.textarea!.value)); - } - } + dispatch(changeCompose(id, editorStateRef.current!)); // Submit disabled: const fulltext = [spoilerText, countableText(text)].join(''); @@ -178,10 +169,6 @@ const ComposeForm = ({ id, shouldCondense, autoFocus, clickab dispatch(fetchComposeSuggestions(id, token as string)); }; - const onSuggestionSelected = (tokenStart: number, token: string | null, value: string | undefined) => { - if (value) dispatch(selectComposeSuggestion(id, tokenStart, token, value, ['text'])); - }; - const onSpoilerSuggestionSelected = (tokenStart: number, token: string | null, value: AutoSuggestion) => { dispatch(selectComposeSuggestion(id, tokenStart, token, value, ['spoiler_text'])); }; @@ -277,8 +264,6 @@ const ComposeForm = ({ id, shouldCondense, autoFocus, clickab let publishText: string | JSX.Element = ''; let publishIcon: string | undefined = undefined; - let textareaPlaceholder: MessageDescriptor; - if (isEditing) { publishText = intl.formatMessage(messages.saveChanges); @@ -296,15 +281,6 @@ const ComposeForm = ({ id, shouldCondense, autoFocus, clickab publishText = intl.formatMessage(messages.schedule); } - if (event) { - textareaPlaceholder = messages.eventPlaceholder; - } else if (hasPoll) { - textareaPlaceholder = messages.pollPlaceholder; - } else { - textareaPlaceholder = messages.placeholder; - } - - return ( {scheduledStatusCount > 0 && !event && !group && ( @@ -334,47 +310,25 @@ const ComposeForm = ({ id, shouldCondense, autoFocus, clickab {!shouldCondense && !event && !group && } - {wysiwygEditor ? ( -
- - {(Component: any) => ( - - )} - - {composeModifiers} -
- ) : ( - - {composeModifiers} - - )} +
+ + {(Component: any) => ( + + )} + + {composeModifiers} +
diff --git a/src/features/developers/settings-store.tsx b/src/features/developers/settings-store.tsx index f5ea1ab17..828ee8d42 100644 --- a/src/features/developers/settings-store.tsx +++ b/src/features/developers/settings-store.tsx @@ -140,12 +140,6 @@ const SettingsStore: React.FC = () => { > - - } - > - - ); diff --git a/src/features/ui/util/global-hotkeys.tsx b/src/features/ui/util/global-hotkeys.tsx index 11175a441..6953c7b24 100644 --- a/src/features/ui/util/global-hotkeys.tsx +++ b/src/features/ui/util/global-hotkeys.tsx @@ -4,7 +4,7 @@ import { useHistory } from 'react-router-dom'; import { resetCompose } from 'soapbox/actions/compose'; import { openModal } from 'soapbox/actions/modals'; import { FOCUS_EDITOR_COMMAND } from 'soapbox/features/compose/editor/plugins/focus-plugin'; -import { useAppSelector, useAppDispatch, useOwnAccount, useSettings } from 'soapbox/hooks'; +import { useAppSelector, useAppDispatch, useOwnAccount } from 'soapbox/hooks'; import { HotKeys } from '../components/hotkeys'; @@ -50,25 +50,14 @@ const GlobalHotkeys: React.FC = ({ children, node }) => { const dispatch = useAppDispatch(); const me = useAppSelector(state => state.me); const { account } = useOwnAccount(); - const wysiwygEditor = useSettings().get('wysiwyg'); const handleHotkeyNew = (e?: KeyboardEvent) => { e?.preventDefault(); - let element; - - if (wysiwygEditor) { - element = node.current?.querySelector('div[data-lexical-editor="true"]') as HTMLTextAreaElement; - } else { - element = node.current?.querySelector('textarea#compose-textarea') as HTMLTextAreaElement; - } + const element = node.current?.querySelector('div[data-lexical-editor="true"]') as HTMLTextAreaElement; if (element) { - if (wysiwygEditor) { - ((element as any).__lexicalEditor as LexicalEditor).dispatchCommand(FOCUS_EDITOR_COMMAND, undefined); - } else { - element.focus(); - } + ((element as any).__lexicalEditor as LexicalEditor).dispatchCommand(FOCUS_EDITOR_COMMAND, undefined); } else { dispatch(openModal('COMPOSE')); } diff --git a/src/locales/en.json b/src/locales/en.json index 7ff643e23..0f0da7b2e 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -1207,7 +1207,6 @@ "preferences.fields.theme": "Theme", "preferences.fields.underline_links_label": "Always underline links in posts", "preferences.fields.unfollow_modal_label": "Show confirmation dialog before unfollowing someone", - "preferences.fields.wysiwyg_label": "Use WYSIWYG editor", "preferences.hints.demetricator": "Decrease social media anxiety by hiding all numbers from the site.", "preferences.notifications.advanced": "Show all notification categories", "preferences.options.content_type_markdown": "Markdown", diff --git a/src/schemas/soapbox/settings.ts b/src/schemas/soapbox/settings.ts index 7eaf66442..49e164776 100644 --- a/src/schemas/soapbox/settings.ts +++ b/src/schemas/soapbox/settings.ts @@ -28,7 +28,6 @@ const settingsSchema = z.object({ autoloadMore: z.boolean().catch(true), systemFont: z.boolean().catch(false), demetricator: z.boolean().catch(false), - wysiwyg: z.boolean().catch(false), isDeveloper: z.boolean().catch(false), });