From 178c8ce8030d1f2e017ff0435cfa9336f698dc4d Mon Sep 17 00:00:00 2001
From: Lety Does Stuff <48048071+letydoesstuff@users.noreply.github.com>
Date: Mon, 15 Apr 2024 10:45:15 -0700
Subject: [PATCH] Make compose form warnings stack instead of overwrite

---
 .../compose/containers/warning_container.jsx  | 25 +++++++------------
 .../styles/mastodon/components.scss           |  8 ++++++
 2 files changed, 17 insertions(+), 16 deletions(-)

diff --git a/app/javascript/mastodon/features/compose/containers/warning_container.jsx b/app/javascript/mastodon/features/compose/containers/warning_container.jsx
index 7a212342c7..9f9285d74d 100644
--- a/app/javascript/mastodon/features/compose/containers/warning_container.jsx
+++ b/app/javascript/mastodon/features/compose/containers/warning_container.jsx
@@ -10,36 +10,29 @@ import { HASHTAG_PATTERN_REGEX } from 'mastodon/utils/hashtags';
 import Warning from '../components/warning';
 
 const mapStateToProps = state => ({
-  needsLockWarning: state.getIn(['compose', 'privacy']) === 'private' && !state.getIn(['accounts', me, 'locked']),
   hashtagWarning: state.getIn(['compose', 'privacy']) !== 'public' && HASHTAG_PATTERN_REGEX.test(state.getIn(['compose', 'text'])),
+  needsLockWarning: state.getIn(['compose', 'privacy']) === 'private' && !state.getIn(['accounts', me, 'locked']),
   directMessageWarning: state.getIn(['compose', 'privacy']) === 'direct',
 });
 
-const WarningWrapper = ({ needsLockWarning, hashtagWarning, directMessageWarning }) => {
-  if (needsLockWarning) {
-    return <Warning message={<FormattedMessage id='compose_form.lock_disclaimer' defaultMessage='Your account is not {locked}. Anyone can follow you to view your follower-only posts.' values={{ locked: <a href='/settings/profile'><FormattedMessage id='compose_form.lock_disclaimer.lock' defaultMessage='locked' /></a> }} />} />;
-  }
-
-  if (hashtagWarning) {
-    return <Warning message={<FormattedMessage id='compose_form.hashtag_warning' defaultMessage="This post won't be listed under any hashtag as it is unlisted. Only public posts can be searched by hashtag." />} />;
-  }
-
-  if (directMessageWarning) {
+const WarningWrapper = ({ hashtagWarning, needsLockWarning, directMessageWarning }) => {
+  if ( hashtagWarning || needsLockWarning || directMessageWarning) {
     const message = (
-      <span>
-        <FormattedMessage id='compose_form.encryption_warning' defaultMessage='Posts on Mastodon are not end-to-end encrypted. Do not share any dangerous information over Mastodon.' /> <a href='/terms' target='_blank'><FormattedMessage id='compose_form.direct_message_warning_learn_more' defaultMessage='Learn more' /></a>
-      </span>
+      <>
+        {hashtagWarning && <FormattedMessage id='compose_form.hashtag_warning' defaultMessage="This post won't be listed under any hashtag as it is unlisted. Only public posts can be searched by hashtag." />}
+        {needsLockWarning && <FormattedMessage id='compose_form.lock_disclaimer' defaultMessage='Your account is not {locked}. Anyone can follow you to view your follower-only posts.' values={{ locked: <a href='/settings/profile'><FormattedMessage id='compose_form.lock_disclaimer.lock' defaultMessage='locked' /></a> }} />}
+        {directMessageWarning && <span><FormattedMessage id='compose_form.encryption_warning' defaultMessage='Posts on Mastodon are not end-to-end encrypted. Do not share any dangerous information over Mastodon.' /> <a href='/terms' target='_blank'><FormattedMessage id='compose_form.direct_message_warning_learn_more' defaultMessage='Learn more' /></a></span>}
+      </>
     );
 
     return <Warning message={message} />;
   }
-
   return null;
 };
 
 WarningWrapper.propTypes = {
-  needsLockWarning: PropTypes.bool,
   hashtagWarning: PropTypes.bool,
+  needsLockWarning: PropTypes.bool,
   directMessageWarning: PropTypes.bool,
 };
 
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index 87e13ee45e..67322c823a 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -546,6 +546,14 @@ body > [data-popper-placement] {
         text-decoration: none;
       }
     }
+
+    & > span {
+      display: block;
+
+      &:not(:first-child) {
+        margin-top: 0.5em;
+      }
+    }
   }
 
   .spoiler-input {