diff --git a/app/soapbox/components/status.tsx b/app/soapbox/components/status.tsx index f29091a94a..c4dcce246b 100644 --- a/app/soapbox/components/status.tsx +++ b/app/soapbox/components/status.tsx @@ -80,7 +80,7 @@ const Status: React.FC = (props) => { const didShowCard = useRef(false); const node = useRef(null); - const [showMedia, setShowMedia] = useState(status.visibility === 'self' ? false : defaultMediaVisibility(status, displayMedia)); + const [showMedia, setShowMedia] = useState(defaultMediaVisibility(status, displayMedia)); const actualStatus = getActualStatus(status); @@ -90,7 +90,7 @@ const Status: React.FC = (props) => { }, []); useEffect(() => { - setShowMedia(status.visibility === 'self' ? false : defaultMediaVisibility(status, displayMedia)); + setShowMedia(defaultMediaVisibility(status, displayMedia)); }, [status.id]); const handleToggleMediaVisibility = (): void => { diff --git a/app/soapbox/components/statuses/sensitive-content-overlay.tsx b/app/soapbox/components/statuses/sensitive-content-overlay.tsx index 3d71b549a6..7aebfe521c 100644 --- a/app/soapbox/components/statuses/sensitive-content-overlay.tsx +++ b/app/soapbox/components/statuses/sensitive-content-overlay.tsx @@ -3,6 +3,7 @@ import React, { useEffect, useState } from 'react'; import { defineMessages, useIntl } from 'react-intl'; import { useSettings, useSoapboxConfig } from 'soapbox/hooks'; +import { defaultMediaVisibility } from 'soapbox/utils/status'; import { Button, HStack, Text } from '../ui'; @@ -27,23 +28,15 @@ interface ISensitiveContentOverlay { const SensitiveContentOverlay = (props: ISensitiveContentOverlay) => { const { onToggleVisibility, status } = props; const isUnderReview = status.visibility === 'self'; - const isSensitive = status.sensitive; const settings = useSettings(); - const displayMedia = settings.get('displayMedia') as string | undefined; + const displayMedia = settings.get('displayMedia') as string; const intl = useIntl(); const { links } = useSoapboxConfig(); - const [visible, setVisible] = useState( - isUnderReview === true ? false : null - || ( - props.visible !== undefined - ? props.visible - : (displayMedia !== 'hide_all' && !isSensitive || displayMedia === 'show_all') - ), - ); + const [visible, setVisible] = useState(defaultMediaVisibility(status, displayMedia)); const toggleVisibility = (event: React.MouseEvent) => { event.stopPropagation(); diff --git a/app/soapbox/features/status/components/detailed-status.tsx b/app/soapbox/features/status/components/detailed-status.tsx index 1131b82dfd..0828babf1e 100644 --- a/app/soapbox/features/status/components/detailed-status.tsx +++ b/app/soapbox/features/status/components/detailed-status.tsx @@ -50,7 +50,7 @@ const DetailedStatus: React.FC = ({ const { account } = actualStatus; if (!account || typeof account !== 'object') return null; - const inReview = actualStatus.visibility === 'self'; + const isUnderReview = actualStatus.visibility === 'self'; const isSensitive = actualStatus.sensitive; let statusTypeIcon = null; @@ -94,11 +94,11 @@ const DetailedStatus: React.FC = ({ justifyContent='end' className={ classNames('relative', { - 'min-h-[220px]': inReview || isSensitive, + 'min-h-[220px]': isUnderReview || isSensitive, }) } > - {(inReview || isSensitive) ? ( + {(isUnderReview || isSensitive) ? ( = (props) => { const me = useAppSelector(state => state.me); const status = useAppSelector(state => getStatus(state, { id: props.params.statusId })); const displayMedia = settings.get('displayMedia') as DisplayMedia; - const inReview = status?.visibility === 'self'; + const isUnderReview = status?.visibility === 'self'; const { ancestorsIds, descendantsIds } = useAppSelector(state => { let ancestorsIds = ImmutableOrderedSet(); @@ -463,14 +463,14 @@ const Thread: React.FC = (props) => { ref={statusRef} className={ classNames('detailed-status__wrapper focusable relative', { - 'min-h-[220px]': inReview, + 'min-h-[220px]': isUnderReview, }) } tabIndex={0} // FIXME: no "reblogged by" text is added for the screen reader aria-label={textForScreenReader(intl, status)} > - {inReview ? ( + {isUnderReview ? (