diff options
author | Thibaut Girka <thib@sitedethib.com> | 2020-01-25 19:46:24 +0100 |
---|---|---|
committer | Thibaut Girka <thib@sitedethib.com> | 2020-01-25 19:46:24 +0100 |
commit | 3d9310bf3f93ff03f78192a472e31f7c39afe033 (patch) | |
tree | 68c3d3ce55636663d89f992d209f79080d547d2e /app/javascript | |
parent | 5bd752081fd72c9899780eaa4b8ce2bd277b1ff0 (diff) | |
parent | 90b13ffd009a431dbe98c37bc92ee59a6f0535f2 (diff) |
Merge branch 'master' into glitch-soc/merge-upstream
Diffstat (limited to 'app/javascript')
4 files changed, 34 insertions, 10 deletions
diff --git a/app/javascript/mastodon/actions/announcements.js b/app/javascript/mastodon/actions/announcements.js index 64bf5ef91..53b19a6fd 100644 --- a/app/javascript/mastodon/actions/announcements.js +++ b/app/javascript/mastodon/actions/announcements.js @@ -56,12 +56,27 @@ export const updateAnnouncements = announcement => ({ }); export const addReaction = (announcementId, name) => (dispatch, getState) => { - dispatch(addReactionRequest(announcementId, name)); + const announcement = getState().getIn(['announcements', 'items']).find(x => x.get('id') === announcementId); + + let alreadyAdded = false; + + if (announcement) { + const reaction = announcement.get('reactions').find(x => x.get('name') === name); + if (reaction && reaction.get('me')) { + alreadyAdded = true; + } + } + + if (!alreadyAdded) { + dispatch(addReactionRequest(announcementId, name, alreadyAdded)); + } api(getState).put(`/api/v1/announcements/${announcementId}/reactions/${name}`).then(() => { - dispatch(addReactionSuccess(announcementId, name)); + dispatch(addReactionSuccess(announcementId, name, alreadyAdded)); }).catch(err => { - dispatch(addReactionFail(announcementId, name, err)); + if (!alreadyAdded) { + dispatch(addReactionFail(announcementId, name, err)); + } }); }; diff --git a/app/javascript/mastodon/components/column_header.js b/app/javascript/mastodon/components/column_header.js index 0038995c8..ea82f9ef9 100644 --- a/app/javascript/mastodon/components/column_header.js +++ b/app/javascript/mastodon/components/column_header.js @@ -33,6 +33,7 @@ class ColumnHeader extends React.PureComponent { onPin: PropTypes.func, onMove: PropTypes.func, onClick: PropTypes.func, + appendContent: PropTypes.node, }; state = { @@ -81,7 +82,7 @@ class ColumnHeader extends React.PureComponent { } render () { - const { title, icon, active, children, pinned, multiColumn, extraButton, showBackButton, intl: { formatMessage }, placeholder } = this.props; + const { title, icon, active, children, pinned, multiColumn, extraButton, showBackButton, intl: { formatMessage }, placeholder, appendContent } = this.props; const { collapsed, animating } = this.state; const wrapperClassName = classNames('column-header__wrapper', { @@ -172,6 +173,8 @@ class ColumnHeader extends React.PureComponent { {(!collapsed || animating) && collapsedContent} </div> </div> + + {appendContent} </div> ); diff --git a/app/javascript/mastodon/features/home_timeline/index.js b/app/javascript/mastodon/features/home_timeline/index.js index c7de8c9cb..2bad22bc1 100644 --- a/app/javascript/mastodon/features/home_timeline/index.js +++ b/app/javascript/mastodon/features/home_timeline/index.js @@ -143,12 +143,11 @@ class HomeTimeline extends React.PureComponent { pinned={pinned} multiColumn={multiColumn} extraButton={announcementsButton} + appendContent={hasAnnouncements && showAnnouncements && <AnnouncementsContainer />} > <ColumnSettingsContainer /> </ColumnHeader> - {hasAnnouncements && showAnnouncements && <AnnouncementsContainer />} - <StatusListContainer trackScroll={!pinned} scrollKey={`home_timeline-${columnId}`} diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index adaed2826..cdb932749 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -3224,13 +3224,16 @@ a.status-card.compact:hover { .column-header__wrapper { position: relative; flex: 0 0 auto; + z-index: 1; &.active { + box-shadow: 0 1px 0 rgba($highlight-text-color, 0.3); + &::before { display: block; content: ""; position: absolute; - top: 35px; + bottom: -13px; left: 0; right: 0; margin: 0 auto; @@ -3241,6 +3244,11 @@ a.status-card.compact:hover { background: radial-gradient(ellipse, rgba($ui-highlight-color, 0.23) 0%, rgba($ui-highlight-color, 0) 60%); } } + + .announcements { + z-index: 1; + position: relative; + } } .column-header { @@ -3273,8 +3281,6 @@ a.status-card.compact:hover { } &.active { - box-shadow: 0 1px 0 rgba($highlight-text-color, 0.3); - .column-header__icon { color: $highlight-text-color; text-shadow: 0 0 10px rgba($highlight-text-color, 0.4); @@ -3330,6 +3336,8 @@ a.status-card.compact:hover { color: $darker-text-color; transition: max-height 150ms ease-in-out, opacity 300ms linear; opacity: 1; + z-index: 1; + position: relative; &.collapsed { max-height: 0; @@ -6632,7 +6640,6 @@ noscript { .announcements { background: lighten($ui-base-color, 8%); - border-top: 1px solid $ui-base-color; font-size: 13px; display: flex; align-items: flex-end; |