diff --git a/app/soapbox/components/media_gallery.js b/app/soapbox/components/media_gallery.js index f8e9dc51e..22ed2473d 100644 --- a/app/soapbox/components/media_gallery.js +++ b/app/soapbox/components/media_gallery.js @@ -605,7 +605,7 @@ class MediaGallery extends React.PureComponent { } if (inReview) { - summary = ; + summary = ; } else { summary = ; } diff --git a/app/soapbox/features/compose/components/compose-form.tsx b/app/soapbox/features/compose/components/compose-form.tsx index 35470c4cf..b9968ad3e 100644 --- a/app/soapbox/features/compose/components/compose-form.tsx +++ b/app/soapbox/features/compose/components/compose-form.tsx @@ -18,7 +18,7 @@ import AutosuggestInput, { AutoSuggestion } from 'soapbox/components/autosuggest import AutosuggestTextarea from 'soapbox/components/autosuggest_textarea'; import Icon from 'soapbox/components/icon'; import { Button, Stack } from 'soapbox/components/ui'; -import { useAppDispatch, useAppSelector, useCompose, useFeatures } from 'soapbox/hooks'; +import { useAppDispatch, useAppSelector, useCompose, useFeatures, usePrevious } from 'soapbox/hooks'; import { isMobile } from 'soapbox/is_mobile'; import EmojiPickerDropdown from '../components/emoji-picker/emoji-picker-dropdown'; @@ -76,6 +76,7 @@ const ComposeForm = ({ id, shouldCondense, autoFocus, clickab const features = useFeatures(); const { text, suggestions, spoiler, spoiler_text: spoilerText, privacy, focusDate, caretPosition, is_submitting: isSubmitting, is_changing_upload: isChangingUpload, is_uploading: isUploading, schedule: scheduledAt } = compose; + const prevSpoiler = usePrevious(spoiler); const hasPoll = !!compose.poll; const isEditing = compose.id !== null; @@ -206,9 +207,10 @@ const ComposeForm = ({ id, shouldCondense, autoFocus, clickab }, []); useEffect(() => { - switch (spoiler) { - case true: focusSpoilerInput(); break; - case false: focusTextarea(); break; + if (spoiler && !prevSpoiler) { + focusSpoilerInput(); + } else if (!spoiler && prevSpoiler) { + focusTextarea(); } }, [spoiler]); diff --git a/app/soapbox/hooks/index.ts b/app/soapbox/hooks/index.ts index c3fb6945d..f7990d59f 100644 --- a/app/soapbox/hooks/index.ts +++ b/app/soapbox/hooks/index.ts @@ -9,6 +9,7 @@ export { useFeatures } from './useFeatures'; export { useLocale } from './useLocale'; export { useOnScreen } from './useOnScreen'; export { useOwnAccount } from './useOwnAccount'; +export { usePrevious } from './usePrevious'; export { useRefEventHandler } from './useRefEventHandler'; export { useSettings } from './useSettings'; export { useSoapboxConfig } from './useSoapboxConfig'; diff --git a/app/soapbox/hooks/usePrevious.ts b/app/soapbox/hooks/usePrevious.ts new file mode 100644 index 000000000..89282d6f7 --- /dev/null +++ b/app/soapbox/hooks/usePrevious.ts @@ -0,0 +1,13 @@ +import { useRef, useEffect } from 'react'; + +/** Get the last version of this value. */ +// https://usehooks.com/usePrevious/ +export const usePrevious = (value: T): T | undefined => { + const ref = useRef(); + + useEffect(() => { + ref.current = value; + }, [value]); + + return ref.current; +}; \ No newline at end of file diff --git a/app/soapbox/locales/en.json b/app/soapbox/locales/en.json index 6cc0b4f97..2defd436b 100644 --- a/app/soapbox/locales/en.json +++ b/app/soapbox/locales/en.json @@ -992,7 +992,7 @@ "status.favourite": "Like", "status.filtered": "Filtered", "status.in_review_warning": "Content Under Review", - "status.in_review_summary.summary": "This Truth has been sent to Moderation for review and is only visible to you.", + "status.in_review_summary.summary": "This post has been sent to Moderation for review and is only visible to you.", "status.in_review_summary.contact": "If you believe this is in error please {link}.", "status.in_review_summary.link": "Contact Support", "status.load_more": "Load more",