treehouse
/
mastodon
22
8
Fork 5
Code Issues 32 Pull Requests Projects 1 Releases Wiki Activity

Merge pull request #1266 from ThibG/glitch-soc/merge-upstream 

Merge upstream changes
lolsob-rspec
ThibG 2020-01-25 12:23:47 +01:00 committed by GitHub
parent 04cf0823da 8caa94f566
commit b80884a8ac
20 changed files with 169 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
app/javascript/flavours/glitch/components/animated_number.js Normal file
View File

@ -0,0 +1,47 @@
import React from 'react';
import PropTypes from 'prop-types';
import { FormattedNumber } from 'react-intl';
import TransitionMotion from 'react-motion/lib/TransitionMotion';
import spring from 'react-motion/lib/spring';
import { reduceMotion } from 'flavours/glitch/util/initial_state';
export default class AnimatedNumber extends React.PureComponent {
static propTypes = {
value: PropTypes.number.isRequired,
};
willEnter () {
return { y: -1 };
}
willLeave () {
return { y: spring(1, { damping: 35, stiffness: 400 }) };
}
render () {
const { value } = this.props;
if (reduceMotion) {
return <FormattedNumber value={value} />;
}
const styles = [{
key: value,
style: { y: spring(0, { damping: 35, stiffness: 400 }) },
}];
return (
<TransitionMotion styles={styles} willEnter={this.willEnter} willLeave={this.willLeave}>
{items => (
<span className='animated-number'>
{items.map(({ key, style }) => (
<span key={key} style={{ position: style.y > 0 ? 'absolute' : 'static', transform: `translateY(${style.y * 100}%)` }}><FormattedNumber value={key} /></span>
))}
</span>
)}
</TransitionMotion>
);
}
}

8
app/javascript/flavours/glitch/components/dropdown_menu.js
View File

@ -184,7 +184,7 @@ export default class Dropdown extends React.PureComponent {
icon: PropTypes.string.isRequired,
items: PropTypes.array.isRequired,
size: PropTypes.number.isRequired,
ariaLabel: PropTypes.string,
title: PropTypes.string,
disabled: PropTypes.bool,
status: ImmutablePropTypes.map,
isUserTouching: PropTypes.func,
@ -197,7 +197,7 @@ export default class Dropdown extends React.PureComponent {
};
static defaultProps = {
ariaLabel: 'Menu',
title: 'Menu',
};
state = {
@ -277,14 +277,14 @@ export default class Dropdown extends React.PureComponent {
}
render () {
const { icon, items, size, ariaLabel, disabled, dropdownPlacement, openDropdownId, openedViaKeyboard } = this.props;
const { icon, items, size, title, disabled, dropdownPlacement, openDropdownId, openedViaKeyboard } = this.props;
const open = this.state.id === openDropdownId;
return (
<div>
<IconButton
icon={icon}
title={ariaLabel}
title={title}
active={open}
disabled={disabled}
size={size}

7
app/javascript/flavours/glitch/features/getting_started/components/announcements.js
View File

@ -5,13 +5,14 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import PropTypes from 'prop-types';
import IconButton from 'flavours/glitch/components/icon_button';
import Icon from 'flavours/glitch/components/icon';
import { defineMessages, injectIntl, FormattedMessage, FormattedDate, FormattedNumber } from 'react-intl';
import { defineMessages, injectIntl, FormattedMessage, FormattedDate } from 'react-intl';
import { autoPlayGif } from 'flavours/glitch/util/initial_state';
import elephantUIPlane from 'mastodon/../images/elephant_ui_plane.svg';
import { mascot } from 'flavours/glitch/util/initial_state';
import unicodeMapping from 'flavours/glitch/util/emoji/emoji_unicode_mapping_light';
import classNames from 'classnames';
import EmojiPickerDropdown from 'flavours/glitch/features/emoji_picker';
import AnimatedNumber from 'flavours/glitch/components/animated_number';
const messages = defineMessages({
close: { id: 'lightbox.close', defaultMessage: 'Close' },
@ -225,7 +226,7 @@ class Reaction extends ImmutablePureComponent {
return (
<button className={classNames('reactions-bar__item', { active: reaction.get('me') })} onClick={this.handleClick} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave} title={`:${shortCode}:`}>
<span className='reactions-bar__item__emoji'><Emoji hovered={this.state.hovered} emoji={reaction.get('name')} emojiMap={this.props.emojiMap} /></span>
<span className='reactions-bar__item__count'><FormattedNumber value={reaction.get('count')} /></span>
<span className='reactions-bar__item__count'><AnimatedNumber value={reaction.get('count')} /></span>
</button>
);
}
@ -264,7 +265,7 @@ class ReactionsBar extends ImmutablePureComponent {
/>
))}
<EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={<Icon id='plus' />} />
{visibleReactions.size < 8 && <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={<Icon id='plus' />} />}
</div>
);
}

3
app/javascript/flavours/glitch/features/status/components/action_bar.js
View File

@ -18,6 +18,7 @@ const messages = defineMessages({
cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark' },
more: { id: 'status.more', defaultMessage: 'More' },
mute: { id: 'status.mute', defaultMessage: 'Mute @{name}' },
muteConversation: { id: 'status.mute_conversation', defaultMessage: 'Mute conversation' },
unmuteConversation: { id: 'status.unmute_conversation', defaultMessage: 'Unmute conversation' },
@ -207,7 +208,7 @@ class ActionBar extends React.PureComponent {
<div className='detailed-status__button'><IconButton className='bookmark-icon' active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} /></div>
<div className='detailed-status__action-bar-dropdown'>
<DropdownMenuContainer size={18} icon='ellipsis-h' items={menu} direction='left' ariaLabel='More' />
<DropdownMenuContainer size={18} icon='ellipsis-h' items={menu} direction='left' title={intl.formatMessage(messages.more)} />
</div>
</div>
);

11
app/javascript/flavours/glitch/features/status/components/detailed_status.js
View File

@ -7,7 +7,7 @@ import StatusContent from 'flavours/glitch/components/status_content';
import MediaGallery from 'flavours/glitch/components/media_gallery';
import AttachmentList from 'flavours/glitch/components/attachment_list';
import { Link } from 'react-router-dom';
import { FormattedDate, FormattedNumber } from 'react-intl';
import { FormattedDate } from 'react-intl';
import Card from './card';
import ImmutablePureComponent from 'react-immutable-pure-component';
import Video from 'flavours/glitch/features/video';
@ -17,6 +17,7 @@ import scheduleIdleTask from 'flavours/glitch/util/schedule_idle_task';
import classNames from 'classnames';
import PollContainer from 'flavours/glitch/containers/poll_container';
import Icon from 'flavours/glitch/components/icon';
import AnimatedNumber from 'flavours/glitch/components/animated_number';
export default class DetailedStatus extends ImmutablePureComponent {
@ -204,7 +205,7 @@ export default class DetailedStatus extends ImmutablePureComponent {
<Link to={`/statuses/${status.get('id')}/reblogs`} className='detailed-status__link'>
<Icon id={reblogIcon} />
<span className='detailed-status__reblogs'>
<FormattedNumber value={status.get('reblogs_count')} />
<AnimatedNumber value={status.get('reblogs_count')} />
</span>
</Link>
);
@ -213,7 +214,7 @@ export default class DetailedStatus extends ImmutablePureComponent {
<a href={`/interact/${status.get('id')}?type=reblog`} className='detailed-status__link' onClick={this.handleModalLink}>
<Icon id={reblogIcon} />
<span className='detailed-status__reblogs'>
<FormattedNumber value={status.get('reblogs_count')} />
<AnimatedNumber value={status.get('reblogs_count')} />
</span>
</a>
);
@ -224,7 +225,7 @@ export default class DetailedStatus extends ImmutablePureComponent {
<Link to={`/statuses/${status.get('id')}/favourites`} className='detailed-status__link'>
<Icon id='star' />
<span className='detailed-status__favorites'>
<FormattedNumber value={status.get('favourites_count')} />
<AnimatedNumber value={status.get('favourites_count')} />
</span>
</Link>
);
@ -233,7 +234,7 @@ export default class DetailedStatus extends ImmutablePureComponent {
<a href={`/interact/${status.get('id')}?type=favourite`} className='detailed-status__link' onClick={this.handleModalLink}>
<Icon id='star' />
<span className='detailed-status__favorites'>
<FormattedNumber value={status.get('favourites_count')} />
<AnimatedNumber value={status.get('favourites_count')} />
</span>
</a>
);

8
app/javascript/flavours/glitch/styles/components/announcements.scss
View File

@ -68,6 +68,10 @@
padding: 15px;
padding-right: 15px + 18px;
position: relative;
font-size: 15px;
line-height: 20px;
word-wrap: break-word;
font-weight: 400;
&__range {
display: block;
@ -164,10 +168,10 @@
&.active {
transition: all 100ms ease-in;
transition-property: background-color, color;
background-color: mix(lighten($ui-base-color, 12%), $ui-highlight-color, 90%);
background-color: mix(lighten($ui-base-color, 12%), $ui-highlight-color, 80%);
.reactions-bar__item__count {
color: $highlight-text-color;
color: lighten($highlight-text-color, 8%);
}
}
}

8
app/javascript/flavours/glitch/styles/components/index.scss
View File

@ -3,6 +3,14 @@
-ms-overflow-style: -ms-autohiding-scrollbar;
}
.animated-number {
display: inline-flex;
flex-direction: column;
align-items: stretch;
overflow: hidden;
position: relative;
}
.link-button {
display: block;
font-size: 15px;

1
app/javascript/flavours/glitch/util/stream.js
View File

@ -92,6 +92,7 @@ export default function getStream(streamingAPIBaseURL, accessToken, stream, { co
return ws;
}
stream = stream.replace(/:/g, '/');
params.push(`access_token=${accessToken}`);
const es = new EventSource(`${streamingAPIBaseURL}/api/v1/streaming/${stream}?${params.join('&')}`);

47
app/javascript/mastodon/components/animated_number.js Normal file
View File

@ -0,0 +1,47 @@
import React from 'react';
import PropTypes from 'prop-types';
import { FormattedNumber } from 'react-intl';
import TransitionMotion from 'react-motion/lib/TransitionMotion';
import spring from 'react-motion/lib/spring';
import { reduceMotion } from 'mastodon/initial_state';
export default class AnimatedNumber extends React.PureComponent {
static propTypes = {
value: PropTypes.number.isRequired,
};
willEnter () {
return { y: -1 };
}
willLeave () {
return { y: spring(1, { damping: 35, stiffness: 400 }) };
}
render () {
const { value } = this.props;
if (reduceMotion) {
return <FormattedNumber value={value} />;
}
const styles = [{
key: value,
style: { y: spring(0, { damping: 35, stiffness: 400 }) },
}];
return (
<TransitionMotion styles={styles} willEnter={this.willEnter} willLeave={this.willLeave}>
{items => (
<span className='animated-number'>
{items.map(({ key, style }) => (
<span key={key} style={{ position: style.y > 0 ? 'absolute' : 'static', transform: `translateY(${style.y * 100}%)` }}><FormattedNumber value={key} /></span>
))}
</span>
)}
</TransitionMotion>
);
}
}

7
app/javascript/mastodon/features/getting_started/components/announcements.js
View File

@ -5,13 +5,14 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import PropTypes from 'prop-types';
import IconButton from 'mastodon/components/icon_button';
import Icon from 'mastodon/components/icon';
import { defineMessages, injectIntl, FormattedMessage, FormattedDate, FormattedNumber } from 'react-intl';
import { defineMessages, injectIntl, FormattedMessage, FormattedDate } from 'react-intl';
import { autoPlayGif } from 'mastodon/initial_state';
import elephantUIPlane from 'mastodon/../images/elephant_ui_plane.svg';
import { mascot } from 'mastodon/initial_state';
import unicodeMapping from 'mastodon/features/emoji/emoji_unicode_mapping_light';
import classNames from 'classnames';
import EmojiPickerDropdown from 'mastodon/features/compose/containers/emoji_picker_dropdown_container';
import AnimatedNumber from 'mastodon/components/animated_number';
const messages = defineMessages({
close: { id: 'lightbox.close', defaultMessage: 'Close' },
@ -225,7 +226,7 @@ class Reaction extends ImmutablePureComponent {
return (
<button className={classNames('reactions-bar__item', { active: reaction.get('me') })} onClick={this.handleClick} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave} title={`:${shortCode}:`}>
<span className='reactions-bar__item__emoji'><Emoji hovered={this.state.hovered} emoji={reaction.get('name')} emojiMap={this.props.emojiMap} /></span>
<span className='reactions-bar__item__count'><FormattedNumber value={reaction.get('count')} /></span>
<span className='reactions-bar__item__count'><AnimatedNumber value={reaction.get('count')} /></span>
</button>
);
}
@ -264,7 +265,7 @@ class ReactionsBar extends ImmutablePureComponent {
/>
))}
<EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={<Icon id='plus' />} />
{visibleReactions.size < 8 && <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={<Icon id='plus' />} />}
</div>
);
}

3
app/javascript/mastodon/features/status/components/action_bar.js
View File

@ -19,6 +19,7 @@ const messages = defineMessages({
cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark' },
more: { id: 'status.more', defaultMessage: 'More' },
mute: { id: 'status.mute', defaultMessage: 'Mute @{name}' },
muteConversation: { id: 'status.mute_conversation', defaultMessage: 'Mute conversation' },
unmuteConversation: { id: 'status.unmute_conversation', defaultMessage: 'Unmute conversation' },
@ -275,7 +276,7 @@ class ActionBar extends React.PureComponent {
<div className='detailed-status__button'><IconButton className='bookmark-icon' active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} /></div>
<div className='detailed-status__action-bar-dropdown'>
<DropdownMenuContainer size={18} icon='ellipsis-h' status={status} items={menu} direction='left' title='More' />
<DropdownMenuContainer size={18} icon='ellipsis-h' status={status} items={menu} direction='left' title={intl.formatMessage(messages.more)} />
</div>
</div>
);

11
app/javascript/mastodon/features/status/components/detailed_status.js
View File

@ -6,7 +6,7 @@ import DisplayName from '../../../components/display_name';
import StatusContent from '../../../components/status_content';
import MediaGallery from '../../../components/media_gallery';
import { Link } from 'react-router-dom';
import { FormattedDate, FormattedNumber } from 'react-intl';
import { FormattedDate } from 'react-intl';
import Card from './card';
import ImmutablePureComponent from 'react-immutable-pure-component';
import Video from '../../video';
@ -14,6 +14,7 @@ import Audio from '../../audio';
import scheduleIdleTask from '../../ui/util/schedule_idle_task';
import classNames from 'classnames';
import Icon from 'mastodon/components/icon';
import AnimatedNumber from 'mastodon/components/animated_number';
export default class DetailedStatus extends ImmutablePureComponent {
@ -172,7 +173,7 @@ export default class DetailedStatus extends ImmutablePureComponent {
<Link to={`/statuses/${status.get('id')}/reblogs`} className='detailed-status__link'>
<Icon id={reblogIcon} />
<span className='detailed-status__reblogs'>
<FormattedNumber value={status.get('reblogs_count')} />
<AnimatedNumber value={status.get('reblogs_count')} />
</span>
</Link>
);
@ -181,7 +182,7 @@ export default class DetailedStatus extends ImmutablePureComponent {
<a href={`/interact/${status.get('id')}?type=reblog`} className='detailed-status__link' onClick={this.handleModalLink}>
<Icon id={reblogIcon} />
<span className='detailed-status__reblogs'>
<FormattedNumber value={status.get('reblogs_count')} />
<AnimatedNumber value={status.get('reblogs_count')} />
</span>
</a>
);
@ -192,7 +193,7 @@ export default class DetailedStatus extends ImmutablePureComponent {
<Link to={`/statuses/${status.get('id')}/favourites`} className='detailed-status__link'>
<Icon id='star' />
<span className='detailed-status__favorites'>
<FormattedNumber value={status.get('favourites_count')} />
<AnimatedNumber value={status.get('favourites_count')} />
</span>
</Link>
);
@ -201,7 +202,7 @@ export default class DetailedStatus extends ImmutablePureComponent {
<a href={`/interact/${status.get('id')}?type=favourite`} className='detailed-status__link' onClick={this.handleModalLink}>
<Icon id='star' />
<span className='detailed-status__favorites'>
<FormattedNumber value={status.get('favourites_count')} />
<AnimatedNumber value={status.get('favourites_count')} />
</span>
</a>
);

1
app/javascript/mastodon/stream.js
View File

@ -92,6 +92,7 @@ export default function getStream(streamingAPIBaseURL, accessToken, stream, { co
return ws;
}
stream = stream.replace(/:/g, '/');
params.push(`access_token=${accessToken}`);
const es = new EventSource(`${streamingAPIBaseURL}/api/v1/streaming/${stream}?${params.join('&')}`);

18
app/javascript/styles/mastodon/components.scss
View File

@ -3,6 +3,14 @@
-ms-overflow-style: -ms-autohiding-scrollbar;
}
.animated-number {
display: inline-flex;
flex-direction: column;
align-items: stretch;
overflow: hidden;
position: relative;
}
.link-button {
display: block;
font-size: 15px;
@ -5731,6 +5739,8 @@ a.status-card.compact:hover {
text-align: center;
text-decoration: none;
position: relative;
overflow: hidden;
width: 100%;
&.active {
color: $secondary-text-color;
@ -6652,6 +6662,10 @@ noscript {
padding: 15px;
padding-right: 15px + 18px;
position: relative;
font-size: 15px;
line-height: 20px;
word-wrap: break-word;
font-weight: 400;
&__range {
display: block;
@ -6748,10 +6762,10 @@ noscript {
&.active {
transition: all 100ms ease-in;
transition-property: background-color, color;
background-color: mix(lighten($ui-base-color, 12%), $ui-highlight-color, 90%);
background-color: mix(lighten($ui-base-color, 12%), $ui-highlight-color, 80%);
.reactions-bar__item__count {
color: $highlight-text-color;
color: lighten($highlight-text-color, 8%);
}
}
}

6
app/models/user.rb
View File

@ -129,9 +129,7 @@ class User < ApplicationRecord
end
def disable!
update!(disabled: true,
last_sign_in_at: current_sign_in_at,
current_sign_in_at: nil)
update!(disabled: true)
end
def enable!
@ -302,7 +300,7 @@ class User < ApplicationRecord
arr << [current_sign_in_at, current_sign_in_ip] if current_sign_in_ip.present?
arr << [last_sign_in_at, last_sign_in_ip] if last_sign_in_ip.present?
arr.sort_by(&:first).uniq(&:last).reverse!
arr.sort_by { |pair| pair.first || Time.now.utc }.uniq(&:last).reverse!
end
end

7
app/validators/reaction_validator.rb
View File

@ -3,10 +3,13 @@
class ReactionValidator < ActiveModel::Validator
SUPPORTED_EMOJIS = Oj.load(File.read(Rails.root.join('app', 'javascript', 'mastodon', 'features', 'emoji', 'emoji_map.json'))).keys.freeze
LIMIT = 8
def validate(reaction)
return if reaction.name.blank? || reaction.custom_emoji_id.present?
reaction.errors.add(:name, I18n.t('reactions.errors.unrecognized_emoji')) unless unicode_emoji?(reaction.name)
reaction.errors.add(:base, I18n.t('reactions.errors.limit_reached')) if limit_reached?(reaction)
end
private
@ -14,4 +17,8 @@ class ReactionValidator < ActiveModel::Validator
def unicode_emoji?(name)
SUPPORTED_EMOJIS.include?(name)
end
def limit_reached?(reaction)
reaction.announcement.announcement_reactions.where.not(name: reaction.name).count('distinct name') >= LIMIT
end
end

2
app/workers/publish_announcement_reaction_worker.rb
View File

@ -10,7 +10,7 @@ class PublishAnnouncementReactionWorker
reaction, = announcement.announcement_reactions.where(name: name).group(:announcement_id, :name, :custom_emoji_id).select('name, custom_emoji_id, count(*) as count, false as me')
reaction ||= announcement.announcement_reactions.new(name: name)
payload = InlineRenderer.render(reaction, nil, :reaction).tap { |h| h[:announcement_id] = announcement_id }
payload = InlineRenderer.render(reaction, nil, :reaction).tap { |h| h[:announcement_id] = announcement_id.to_s }
payload = Oj.dump(event: :'announcement.reaction', payload: payload)
Account.joins(:user).where('users.current_sign_in_at > ?', User::ACTIVE_DURATION.ago).find_each do |account|

1
config/locales/en.yml
View File

@ -965,6 +965,7 @@ en:
public_timelines: Public timelines
reactions:
errors:
limit_reached: Limit of different reactions reached
unrecognized_emoji: is not a recognized emoji
relationships:
activity: Account activity

15
spec/models/user_spec.rb
View File

@ -322,20 +322,7 @@ RSpec.describe User, type: :model do
end
it 'disables user' do
expect(user).to have_attributes(disabled: true, current_sign_in_at: nil, last_sign_in_at: current_sign_in_at)
end
end
describe '#disable!' do
subject(:user) { Fabricate(:user, disabled: false, current_sign_in_at: current_sign_in_at, last_sign_in_at: nil) }
let(:current_sign_in_at) { Time.zone.now }
before do
user.disable!
end
it 'disables user' do
expect(user).to have_attributes(disabled: true, current_sign_in_at: nil, last_sign_in_at: current_sign_in_at)
expect(user).to have_attributes(disabled: true)
end
end

3
streaming/index.js
View File

@ -442,8 +442,11 @@ const startWorker = (workerId) => {
const accountId = req.accountId || req.remoteAddress;
res.setHeader('Content-Type', 'text/event-stream');
res.setHeader('Cache-Control', 'no-store');
res.setHeader('Transfer-Encoding', 'chunked');
res.write(':)\n');
const heartbeat = setInterval(() => res.write(':thump\n'), 15000);
req.on('close', () => {