Improve interaction between out-of-CW attachments and collapsed toots

diff --git a/app/javascript/flavours/glitch/components/status.js b/app/javascript/flavours/glitch/components/status.js
index d3bdcdc9146438230147a44bdae7f57fffedb33e..219f7de7abf232dbc6f85b0a7542d8a975c6e355 100644 (file)
--- a/app/javascript/flavours/glitch/components/status.js
+++ b/app/javascript/flavours/glitch/components/status.js
@@ -771,6 +771,7 @@ class Status extends ImmutablePureComponent {
           <StatusContent
             status={status}
             media={contentMedia}
+            extraMedia={extraMedia}
             mediaIcons={contentMediaIcons}
             expanded={isExpanded}
             onExpandedToggle={this.handleExpandedToggle}
@@ -780,8 +781,6 @@ class Status extends ImmutablePureComponent {
             rewriteMentions={settings.get('rewrite_mentions')}
           />
 
-          {extraMedia}
-
           {!isCollapsed || !(muted || !settings.getIn(['collapsed', 'show_action_bar'])) ? (
             <StatusActionBar
               {...other}

diff --git a/app/javascript/flavours/glitch/components/status_content.js b/app/javascript/flavours/glitch/components/status_content.js
index 6a027f8d294d6b30b9e300cef128b6ac961064a3..39891da4f45aee619941486a7eba9bff718e5147 100644 (file)
--- a/app/javascript/flavours/glitch/components/status_content.js
+++ b/app/javascript/flavours/glitch/components/status_content.js
@@ -70,6 +70,7 @@ export default class StatusContent extends React.PureComponent {
     collapsed: PropTypes.bool,
     onExpandedToggle: PropTypes.func,
     media: PropTypes.node,
+    extraMedia: PropTypes.node,
     mediaIcons: PropTypes.arrayOf(PropTypes.string),
     parseClick: PropTypes.func,
     disabled: PropTypes.bool,
@@ -256,6 +257,7 @@ export default class StatusContent extends React.PureComponent {
     const {
       status,
       media,
+      extraMedia,
       mediaIcons,
       parseClick,
       disabled,
@@ -351,6 +353,8 @@ export default class StatusContent extends React.PureComponent {
             {media}
           </div>
 
+          {extraMedia}
+
         </div>
       );
     } else if (parseClick) {
@@ -372,6 +376,7 @@ export default class StatusContent extends React.PureComponent {
             lang={lang}
           />
           {media}
+          {extraMedia}
         </div>
       );
     } else {
@@ -391,6 +396,7 @@ export default class StatusContent extends React.PureComponent {
             lang={lang}
           />
           {media}
+          {extraMedia}
         </div>
       );
     }

diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.js b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
index bfbfabcb600c22183419101d41ce1c4e80718c96..301a2add6fa194c546f5d1edcad2ca21845c3cb5 100644 (file)
--- a/app/javascript/flavours/glitch/features/status/components/detailed_status.js
+++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
@@ -296,6 +296,7 @@ class DetailedStatus extends ImmutablePureComponent {
           <StatusContent
             status={status}
             media={contentMedia}
+            extraMedia={extraMedia}
             mediaIcons={contentMediaIcons}
             expanded={expanded}
             collapsed={false}
@@ -307,8 +308,6 @@ class DetailedStatus extends ImmutablePureComponent {
             disabled
           />
 
-          {extraMedia}
-
           <div className='detailed-status__meta'>
             <a className='detailed-status__datetime' href={status.get('url')} target='_blank' rel='noopener noreferrer'>
               <FormattedDate value={new Date(status.get('created_at'))} hour12={false} year='numeric' month='short' day='2-digit' hour='2-digit' minute='2-digit' />