From 9a5f2bbc7758bcd6f131218e933247a6146dde7e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?marcin=20miko=C5=82ajczak?= <git@mkljczk.pl>
Date: Sun, 21 Apr 2024 22:06:53 +0200
Subject: [PATCH] Merge expandSpoilers and displayMedia into a single option
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
---
 src/actions/settings.ts                         |  1 -
 src/actions/status-quotes.test.ts               |  4 ++--
 src/components/quoted-status.tsx                | 10 ++++------
 src/components/status.tsx                       | 13 +++++--------
 .../statuses/sensitive-content-overlay.tsx      | 17 +++++++++--------
 src/features/preferences/index.tsx              |  6 +-----
 .../status/components/detailed-status.tsx       | 14 +++++---------
 src/locales/en.json                             |  3 +--
 src/schemas/soapbox/settings.ts                 |  1 -
 9 files changed, 27 insertions(+), 42 deletions(-)

diff --git a/src/actions/settings.ts b/src/actions/settings.ts
index ae26af50a..102cbca19 100644
--- a/src/actions/settings.ts
+++ b/src/actions/settings.ts
@@ -31,7 +31,6 @@ const defaultSettings = ImmutableMap({
   underlineLinks: false,
   autoPlayGif: true,
   displayMedia: 'default',
-  expandSpoilers: false,
   unfollowModal: false,
   boostModal: false,
   deleteModal: true,
diff --git a/src/actions/status-quotes.test.ts b/src/actions/status-quotes.test.ts
index 85edb8994..62b369280 100644
--- a/src/actions/status-quotes.test.ts
+++ b/src/actions/status-quotes.test.ts
@@ -46,7 +46,7 @@ describe('fetchStatusQuotes()', () => {
         { type: 'STATUS_QUOTES_FETCH_REQUEST', statusId },
         { type: 'POLLS_IMPORT', polls: [] },
         { type: 'ACCOUNTS_IMPORT', accounts: [status.account] },
-        { type: 'STATUSES_IMPORT', statuses: [status], expandSpoilers: false },
+        { type: 'STATUSES_IMPORT', statuses: [status] },
         { type: 'STATUS_QUOTES_FETCH_SUCCESS', statusId, statuses: [status], next: null },
       ];
       await store.dispatch(fetchStatusQuotes(statusId));
@@ -118,7 +118,7 @@ describe('expandStatusQuotes()', () => {
           { type: 'STATUS_QUOTES_EXPAND_REQUEST', statusId },
           { type: 'POLLS_IMPORT', polls: [] },
           { type: 'ACCOUNTS_IMPORT', accounts: [status.account] },
-          { type: 'STATUSES_IMPORT', statuses: [status], expandSpoilers: false },
+          { type: 'STATUSES_IMPORT', statuses: [status] },
           { type: 'STATUS_QUOTES_EXPAND_SUCCESS', statusId, statuses: [status], next: null },
         ];
         await store.dispatch(expandStatusQuotes(statusId));
diff --git a/src/components/quoted-status.tsx b/src/components/quoted-status.tsx
index e5f771cc5..eb8acf4c8 100644
--- a/src/components/quoted-status.tsx
+++ b/src/components/quoted-status.tsx
@@ -109,12 +109,10 @@ const QuotedStatus: React.FC<IQuotedStatus> = ({ status, onCancel, compose }) =>
             className='relative z-0'
             style={{ minHeight: status.sensitive ? Math.max(minHeight, 208) + 12 : undefined }}
           >
-            {status.sensitive && (
-              <SensitiveContentOverlay
-                status={status}
-                ref={overlay}
-              />
-            )}
+            <SensitiveContentOverlay
+              status={status}
+              ref={overlay}
+            />
 
             <Stack space={4}>
               <StatusContent
diff --git a/src/components/status.tsx b/src/components/status.tsx
index 9b03b2ca9..83b871f59 100644
--- a/src/components/status.tsx
+++ b/src/components/status.tsx
@@ -369,7 +369,6 @@ const Status: React.FC<IStatus> = (props) => {
     react: handleHotkeyReact,
   };
 
-  const isSensitive = actualStatus.sensitive;
   const isSoftDeleted = status.tombstone?.reason === 'deleted';
 
   if (isSoftDeleted) {
@@ -424,14 +423,12 @@ const Status: React.FC<IStatus> = (props) => {
 
             <Stack
               className='relative z-0'
-              style={{ minHeight: isSensitive ? Math.max(minHeight, 208) + 12 : undefined }}
+              style={{ minHeight: actualStatus.sensitive ? Math.max(minHeight, 208) + 12 : undefined }}
             >
-              {(isSensitive) && (
-                <SensitiveContentOverlay
-                  status={actualStatus}
-                  ref={overlay}
-                />
-              )}
+              <SensitiveContentOverlay
+                status={actualStatus}
+                ref={overlay}
+              />
 
               {actualStatus.event ? <EventPreview className='shadow-xl' status={actualStatus} /> : (
                 <Stack space={4}>
diff --git a/src/components/statuses/sensitive-content-overlay.tsx b/src/components/statuses/sensitive-content-overlay.tsx
index 2bbd6890d..d18dd4d8f 100644
--- a/src/components/statuses/sensitive-content-overlay.tsx
+++ b/src/components/statuses/sensitive-content-overlay.tsx
@@ -29,16 +29,15 @@ const SensitiveContentOverlay = React.forwardRef<HTMLDivElement, ISensitiveConte
 
   const dispatch = useAppDispatch();
   const intl = useIntl();
-  const { displayMedia, expandSpoilers } = useSettings();
+  const { displayMedia } = useSettings();
 
-  let visible = false;
+  let visible = !status.sensitive;
 
-  if (status.hidden !== null) {
-    visible = status.hidden;
-  } else {
-    if (expandSpoilers) visible = true;
-    if ((displayMedia === 'default' && status.sensitive) || displayMedia === 'hide_all') visible = false;
-  }
+  if (status.hidden !== null) visible = status.hidden;
+  else if (displayMedia === 'show_all') visible = true;
+  else if (displayMedia === 'hide_all' && status.media_attachments.size) visible = false;
+
+  const showHideButton = status.sensitive || (status.media_attachments.size && displayMedia === 'hide_all');
 
   const toggleVisibility = (event: React.MouseEvent<HTMLButtonElement>) => {
     event.stopPropagation();
@@ -46,6 +45,8 @@ const SensitiveContentOverlay = React.forwardRef<HTMLDivElement, ISensitiveConte
     dispatch(toggleStatusHidden(status));
   };
 
+  if (visible && !showHideButton) return null;
+
   return (
     <div
       className={clsx('absolute z-40', {
diff --git a/src/features/preferences/index.tsx b/src/features/preferences/index.tsx
index aa15adde3..ea69bc974 100644
--- a/src/features/preferences/index.tsx
+++ b/src/features/preferences/index.tsx
@@ -78,7 +78,7 @@ const languages = {
 const messages = defineMessages({
   heading: { id: 'column.preferences', defaultMessage: 'Preferences' },
   displayPostsDefault: { id: 'preferences.fields.display_media.default', defaultMessage: 'Hide posts marked as sensitive' },
-  displayPostsHideAll: { id: 'preferences.fields.display_media.hide_all', defaultMessage: 'Always hide posts' },
+  displayPostsHideAll: { id: 'preferences.fields.display_media.hide_all', defaultMessage: 'Always hide media posts' },
   displayPostsShowAll: { id: 'preferences.fields.display_media.show_all', defaultMessage: 'Always show posts' },
   privacy_public: { id: 'preferences.options.privacy_public', defaultMessage: 'Public' },
   privacy_unlisted: { id: 'preferences.options.privacy_unlisted', defaultMessage: 'Unlisted' },
@@ -197,10 +197,6 @@ const Preferences = () => {
           <SettingToggle settings={settings} settingPath={['autoPlayGif']} onChange={onToggleChange} />
         </ListItem>
 
-        {features.spoilers && <ListItem label={<FormattedMessage id='preferences.fields.expand_spoilers_label' defaultMessage='Always expand posts marked with content warnings' />}>
-          <SettingToggle settings={settings} settingPath={['expandSpoilers']} onChange={onToggleChange} />
-        </ListItem>}
-
         <ListItem label={<FormattedMessage id='preferences.fields.autoload_timelines_label' defaultMessage='Automatically load new posts when scrolled to the top of the page' />}>
           <SettingToggle settings={settings} settingPath={['autoloadTimelines']} onChange={onToggleChange} />
         </ListItem>
diff --git a/src/features/status/components/detailed-status.tsx b/src/features/status/components/detailed-status.tsx
index 547cc32ce..d3a4b65be 100644
--- a/src/features/status/components/detailed-status.tsx
+++ b/src/features/status/components/detailed-status.tsx
@@ -85,8 +85,6 @@ const DetailedStatus: React.FC<IDetailedStatus> = ({
   const { account } = actualStatus;
   if (!account || typeof account !== 'object') return null;
 
-  const isSensitive = actualStatus.sensitive;
-
   let statusTypeIcon = null;
 
   let quote;
@@ -128,14 +126,12 @@ const DetailedStatus: React.FC<IDetailedStatus> = ({
 
         <Stack
           className='relative z-0'
-          style={{ minHeight: isSensitive ? Math.max(minHeight, 208) + 12 : undefined }}
+          style={{ minHeight: actualStatus.sensitive ? Math.max(minHeight, 208) + 12 : undefined }}
         >
-          {isSensitive && (
-            <SensitiveContentOverlay
-              status={status}
-              ref={overlay}
-            />
-          )}
+          <SensitiveContentOverlay
+            status={status}
+            ref={overlay}
+          />
 
           <Stack space={4}>
             <StatusContent
diff --git a/src/locales/en.json b/src/locales/en.json
index a0444a709..fdad83fdf 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -1242,9 +1242,8 @@
   "preferences.fields.demo_hint": "Use the default Soapbox logo and color scheme. Useful for taking screenshots.",
   "preferences.fields.demo_label": "Demo mode",
   "preferences.fields.display_media.default": "Hide posts marked as sensitive",
-  "preferences.fields.display_media.hide_all": "Always hide posts",
+  "preferences.fields.display_media.hide_all": "Always hide media posts",
   "preferences.fields.display_media.show_all": "Always show posts",
-  "preferences.fields.expand_spoilers_label": "Always expand posts marked with content warnings",
   "preferences.fields.language_label": "Display Language",
   "preferences.fields.media_display_label": "Sensitive content",
   "preferences.fields.missing_description_modal_label": "Show confirmation dialog before sending a post without media descriptions",
diff --git a/src/schemas/soapbox/settings.ts b/src/schemas/soapbox/settings.ts
index e052720ba..2632a1766 100644
--- a/src/schemas/soapbox/settings.ts
+++ b/src/schemas/soapbox/settings.ts
@@ -15,7 +15,6 @@ const settingsSchema = z.object({
   underlineLinks: z.boolean().catch(false),
   autoPlayGif: z.boolean().catch(true),
   displayMedia: z.enum(['default', 'hide_all', 'show_all']).catch('default'),
-  expandSpoilers: z.boolean().catch(false),
   preserveSpoilers: z.boolean().catch(false),
   unfollowModal: z.boolean().catch(false),
   boostModal: z.boolean().catch(false),