Merge branch 'master' into glitch-soc/merge-upstream

This commit is contained in:
Thibaut Girka 2020-01-25 19:46:24 +01:00
commit 3d9310bf3f
4 changed files with 34 additions and 10 deletions

View File

@ -56,12 +56,27 @@ export const updateAnnouncements = announcement => ({
}); });
export const addReaction = (announcementId, name) => (dispatch, getState) => { 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(() => { api(getState).put(`/api/v1/announcements/${announcementId}/reactions/${name}`).then(() => {
dispatch(addReactionSuccess(announcementId, name)); dispatch(addReactionSuccess(announcementId, name, alreadyAdded));
}).catch(err => { }).catch(err => {
dispatch(addReactionFail(announcementId, name, err)); if (!alreadyAdded) {
dispatch(addReactionFail(announcementId, name, err));
}
}); });
}; };

View File

@ -33,6 +33,7 @@ class ColumnHeader extends React.PureComponent {
onPin: PropTypes.func, onPin: PropTypes.func,
onMove: PropTypes.func, onMove: PropTypes.func,
onClick: PropTypes.func, onClick: PropTypes.func,
appendContent: PropTypes.node,
}; };
state = { state = {
@ -81,7 +82,7 @@ class ColumnHeader extends React.PureComponent {
} }
render () { 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 { collapsed, animating } = this.state;
const wrapperClassName = classNames('column-header__wrapper', { const wrapperClassName = classNames('column-header__wrapper', {
@ -172,6 +173,8 @@ class ColumnHeader extends React.PureComponent {
{(!collapsed || animating) && collapsedContent} {(!collapsed || animating) && collapsedContent}
</div> </div>
</div> </div>
{appendContent}
</div> </div>
); );

View File

@ -143,12 +143,11 @@ class HomeTimeline extends React.PureComponent {
pinned={pinned} pinned={pinned}
multiColumn={multiColumn} multiColumn={multiColumn}
extraButton={announcementsButton} extraButton={announcementsButton}
appendContent={hasAnnouncements && showAnnouncements && <AnnouncementsContainer />}
> >
<ColumnSettingsContainer /> <ColumnSettingsContainer />
</ColumnHeader> </ColumnHeader>
{hasAnnouncements && showAnnouncements && <AnnouncementsContainer />}
<StatusListContainer <StatusListContainer
trackScroll={!pinned} trackScroll={!pinned}
scrollKey={`home_timeline-${columnId}`} scrollKey={`home_timeline-${columnId}`}

View File

@ -3224,13 +3224,16 @@ a.status-card.compact:hover {
.column-header__wrapper { .column-header__wrapper {
position: relative; position: relative;
flex: 0 0 auto; flex: 0 0 auto;
z-index: 1;
&.active { &.active {
box-shadow: 0 1px 0 rgba($highlight-text-color, 0.3);
&::before { &::before {
display: block; display: block;
content: ""; content: "";
position: absolute; position: absolute;
top: 35px; bottom: -13px;
left: 0; left: 0;
right: 0; right: 0;
margin: 0 auto; 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%); 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 { .column-header {
@ -3273,8 +3281,6 @@ a.status-card.compact:hover {
} }
&.active { &.active {
box-shadow: 0 1px 0 rgba($highlight-text-color, 0.3);
.column-header__icon { .column-header__icon {
color: $highlight-text-color; color: $highlight-text-color;
text-shadow: 0 0 10px rgba($highlight-text-color, 0.4); text-shadow: 0 0 10px rgba($highlight-text-color, 0.4);
@ -3330,6 +3336,8 @@ a.status-card.compact:hover {
color: $darker-text-color; color: $darker-text-color;
transition: max-height 150ms ease-in-out, opacity 300ms linear; transition: max-height 150ms ease-in-out, opacity 300ms linear;
opacity: 1; opacity: 1;
z-index: 1;
position: relative;
&.collapsed { &.collapsed {
max-height: 0; max-height: 0;
@ -6632,7 +6640,6 @@ noscript {
.announcements { .announcements {
background: lighten($ui-base-color, 8%); background: lighten($ui-base-color, 8%);
border-top: 1px solid $ui-base-color;
font-size: 13px; font-size: 13px;
display: flex; display: flex;
align-items: flex-end; align-items: flex-end;