Rename to 'SensitiveContentOverlay'

app/soapbox/components/status.tsx

@@ -18,7 +18,7 @@ import StatusActionBar from './status-action-bar';
 import StatusMedia from './status-media';
 import StatusReplyMentions from './status-reply-mentions';
 import StatusContent from './status_content';
-import ModerationOverlay from './statuses/moderation-overlay';
+import SensitiveContentOverlay from './statuses/sensitive-content-overlay';
 import { Card, HStack, Stack, Text } from './ui';
 
 import type { Map as ImmutableMap } from 'immutable';
@@ -362,7 +362,7 @@ const Status: React.FC<IStatus> = (props) => {
               }
             >
               {(inReview || isSensitive) ? (
-                <ModerationOverlay
+                <SensitiveContentOverlay
                   status={status}
                   visible={showMedia}
                   onToggleVisibility={handleToggleMediaVisibility}

app/soapbox/components/statuses/__tests__/sensitive-content-overlay.test.tsx

@@ -5,9 +5,9 @@ import { normalizeStatus } from 'soapbox/normalizers';
 import { ReducerStatus } from 'soapbox/reducers/statuses';
 
 import { fireEvent, render, rootState, screen } from '../../../jest/test-helpers';
-import ModerationOverlay from '../moderation-overlay';
+import SensitiveContentOverlay from '../sensitive-content-overlay';
 
-describe('<ModerationOverlay />', () => {
+describe('<SensitiveContentOverlay />', () => {
   let status: ReducerStatus;
 
   describe('when the Status is marked as sensitive', () => {
@@ -16,12 +16,12 @@ describe('<ModerationOverlay />', () => {
     });
 
     it('displays the "Sensitive content" warning', () => {
-      render(<ModerationOverlay status={status} />);
+      render(<SensitiveContentOverlay status={status} />);
       expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Sensitive content');
     });
 
     it('can be toggled', () => {
-      render(<ModerationOverlay status={status} />);
+      render(<SensitiveContentOverlay status={status} />);
 
       fireEvent.click(screen.getByTestId('button'));
       expect(screen.getByTestId('sensitive-overlay')).not.toHaveTextContent('Sensitive content');
@@ -39,12 +39,12 @@ describe('<ModerationOverlay />', () => {
     });
 
     it('displays the "Under review" warning', () => {
-      render(<ModerationOverlay status={status} />);
+      render(<SensitiveContentOverlay status={status} />);
       expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Content Under Review');
     });
 
     it('can be toggled', () => {
-      render(<ModerationOverlay status={status} />);
+      render(<SensitiveContentOverlay status={status} />);
 
       fireEvent.click(screen.getByTestId('button'));
       expect(screen.getByTestId('sensitive-overlay')).not.toHaveTextContent('Content Under Review');
@@ -62,12 +62,12 @@ describe('<ModerationOverlay />', () => {
     });
 
     it('displays the "Under review" warning', () => {
-      render(<ModerationOverlay status={status} />);
+      render(<SensitiveContentOverlay status={status} />);
       expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Content Under Review');
     });
 
     it('can be toggled', () => {
-      render(<ModerationOverlay status={status} />);
+      render(<SensitiveContentOverlay status={status} />);
 
       fireEvent.click(screen.getByTestId('button'));
       expect(screen.getByTestId('sensitive-overlay')).not.toHaveTextContent('Content Under Review');
@@ -91,13 +91,13 @@ describe('<ModerationOverlay />', () => {
     });
 
     it('displays the "Under review" warning', () => {
-      render(<ModerationOverlay status={status} />, undefined, store);
+      render(<SensitiveContentOverlay status={status} />, undefined, store);
       expect(screen.getByTestId('sensitive-overlay')).not.toHaveTextContent('Sensitive content');
       expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Hide');
     });
 
     it('can be toggled', () => {
-      render(<ModerationOverlay status={status} />, undefined, store);
+      render(<SensitiveContentOverlay status={status} />, undefined, store);
 
       fireEvent.click(screen.getByTestId('button'));
       expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Sensitive content');

app/soapbox/components/statuses/sensitive-content-overlay.tsx

@@ -18,13 +18,13 @@ const messages = defineMessages({
   show: { id: 'moderation_overlay.show', defaultMessage: 'Show Content' },
 });
 
-interface IModerationOverlay {
+interface ISensitiveContentOverlay {
   status: StatusEntity
   onToggleVisibility?(): void
   visible?: boolean
 }
 
-const ModerationOverlay = (props: IModerationOverlay) => {
+const SensitiveContentOverlay = (props: ISensitiveContentOverlay) => {
   const { onToggleVisibility, status } = props;
   const isUnderReview = status.visibility === 'self';
   const isSensitive = status.sensitive;
@@ -32,8 +32,6 @@ const ModerationOverlay = (props: IModerationOverlay) => {
   const settings = useSettings();
   const displayMedia = settings.get('displayMedia') as string | undefined;
 
-  // under review ovverides displaymedia
-
   const intl = useIntl();
 
   const { links } = useSoapboxConfig();
@@ -130,4 +128,4 @@ const ModerationOverlay = (props: IModerationOverlay) => {
   );
 };
 
-export default ModerationOverlay;
+export default SensitiveContentOverlay;

app/soapbox/features/status/components/detailed-status.tsx

@@ -6,7 +6,7 @@ import Icon from 'soapbox/components/icon';
 import StatusMedia from 'soapbox/components/status-media';
 import StatusReplyMentions from 'soapbox/components/status-reply-mentions';
 import StatusContent from 'soapbox/components/status_content';
-import ModerationOverlay from 'soapbox/components/statuses/moderation-overlay';
+import SensitiveContentOverlay from 'soapbox/components/statuses/sensitive-content-overlay';
 import { HStack, Stack, Text } from 'soapbox/components/ui';
 import AccountContainer from 'soapbox/containers/account_container';
 import QuotedStatus from 'soapbox/features/status/containers/quoted_status_container';
@@ -99,7 +99,7 @@ const DetailedStatus: React.FC<IDetailedStatus> = ({
           }
         >
           {(inReview || isSensitive) ? (
-            <ModerationOverlay
+            <SensitiveContentOverlay
               status={status}
               visible={showMedia}
               onToggleVisibility={onToggleMediaVisibility}

app/soapbox/features/status/index.tsx

@@ -29,7 +29,7 @@ import MissingIndicator from 'soapbox/components/missing_indicator';
 import PullToRefresh from 'soapbox/components/pull-to-refresh';
 import ScrollableList from 'soapbox/components/scrollable_list';
 import StatusActionBar from 'soapbox/components/status-action-bar';
-import ModerationOverlay from 'soapbox/components/statuses/moderation-overlay';
+import SensitiveContentOverlay from 'soapbox/components/statuses/sensitive-content-overlay';
 import SubNavigation from 'soapbox/components/sub_navigation';
 import Tombstone from 'soapbox/components/tombstone';
 import { Column, Stack } from 'soapbox/components/ui';
@@ -471,7 +471,7 @@ const Thread: React.FC<IThread> = (props) => {
           aria-label={textForScreenReader(intl, status)}
         >
           {inReview ? (
-            <ModerationOverlay
+            <SensitiveContentOverlay
               status={status}
               visible={showMedia}
               onToggleVisibility={handleToggleMediaVisibility}