mirror of
https://github.com/mastodon/mastodon.git
synced 2024-11-08 08:44:27 +00:00
Change hashtag follow icon button into a text button
This commit is contained in:
parent
93372fee1e
commit
151576bafd
|
@ -1,7 +1,7 @@
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { PureComponent } from 'react';
|
import { PureComponent } from 'react';
|
||||||
|
|
||||||
import { injectIntl, FormattedMessage, defineMessages } from 'react-intl';
|
import { FormattedMessage } from 'react-intl';
|
||||||
|
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import { Helmet } from 'react-helmet';
|
import { Helmet } from 'react-helmet';
|
||||||
|
@ -17,17 +17,11 @@ import { fetchHashtag, followHashtag, unfollowHashtag } from 'mastodon/actions/t
|
||||||
import { expandHashtagTimeline, clearTimeline } from 'mastodon/actions/timelines';
|
import { expandHashtagTimeline, clearTimeline } from 'mastodon/actions/timelines';
|
||||||
import Column from 'mastodon/components/column';
|
import Column from 'mastodon/components/column';
|
||||||
import ColumnHeader from 'mastodon/components/column_header';
|
import ColumnHeader from 'mastodon/components/column_header';
|
||||||
import { Icon } from 'mastodon/components/icon';
|
|
||||||
|
|
||||||
import StatusListContainer from '../ui/containers/status_list_container';
|
import StatusListContainer from '../ui/containers/status_list_container';
|
||||||
|
|
||||||
import ColumnSettingsContainer from './containers/column_settings_container';
|
import ColumnSettingsContainer from './containers/column_settings_container';
|
||||||
|
|
||||||
const messages = defineMessages({
|
|
||||||
followHashtag: { id: 'hashtag.follow', defaultMessage: 'Follow hashtag' },
|
|
||||||
unfollowHashtag: { id: 'hashtag.unfollow', defaultMessage: 'Unfollow hashtag' },
|
|
||||||
});
|
|
||||||
|
|
||||||
const mapStateToProps = (state, props) => ({
|
const mapStateToProps = (state, props) => ({
|
||||||
hasUnread: state.getIn(['timelines', `hashtag:${props.params.id}${props.params.local ? ':local' : ''}`, 'unread']) > 0,
|
hasUnread: state.getIn(['timelines', `hashtag:${props.params.id}${props.params.local ? ':local' : ''}`, 'unread']) > 0,
|
||||||
tag: state.getIn(['tags', props.params.id]),
|
tag: state.getIn(['tags', props.params.id]),
|
||||||
|
@ -48,7 +42,6 @@ class HashtagTimeline extends PureComponent {
|
||||||
hasUnread: PropTypes.bool,
|
hasUnread: PropTypes.bool,
|
||||||
tag: ImmutablePropTypes.map,
|
tag: ImmutablePropTypes.map,
|
||||||
multiColumn: PropTypes.bool,
|
multiColumn: PropTypes.bool,
|
||||||
intl: PropTypes.object,
|
|
||||||
};
|
};
|
||||||
|
|
||||||
handlePin = () => {
|
handlePin = () => {
|
||||||
|
@ -188,7 +181,7 @@ class HashtagTimeline extends PureComponent {
|
||||||
};
|
};
|
||||||
|
|
||||||
render () {
|
render () {
|
||||||
const { hasUnread, columnId, multiColumn, tag, intl } = this.props;
|
const { hasUnread, columnId, multiColumn, tag } = this.props;
|
||||||
const { id, local } = this.props.params;
|
const { id, local } = this.props.params;
|
||||||
const pinned = !!columnId;
|
const pinned = !!columnId;
|
||||||
const { signedIn } = this.context.identity;
|
const { signedIn } = this.context.identity;
|
||||||
|
@ -198,13 +191,13 @@ class HashtagTimeline extends PureComponent {
|
||||||
if (tag) {
|
if (tag) {
|
||||||
const following = tag.get('following');
|
const following = tag.get('following');
|
||||||
|
|
||||||
const classes = classNames('column-header__button', {
|
const classes = classNames('column-header__text-button button', {
|
||||||
active: following,
|
active: following,
|
||||||
});
|
});
|
||||||
|
|
||||||
followButton = (
|
followButton = (
|
||||||
<button className={classes} onClick={this.handleFollow} disabled={!signedIn} title={intl.formatMessage(following ? messages.unfollowHashtag : messages.followHashtag)} aria-label={intl.formatMessage(following ? messages.unfollowHashtag : messages.followHashtag)}>
|
<button className={classes} onClick={this.handleFollow} disabled={!signedIn}>
|
||||||
<Icon id={following ? 'user-times' : 'user-plus'} fixedWidth className='column-header__icon' />
|
{following ? <FormattedMessage id='hashtag.unfollow_button' defaultMessage='Unfollow' /> : <FormattedMessage id='hashtag.follow_button' defaultMessage='Follow' />}
|
||||||
</button>
|
</button>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -245,4 +238,4 @@ class HashtagTimeline extends PureComponent {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default connect(mapStateToProps)(injectIntl(HashtagTimeline));
|
export default connect(mapStateToProps)(HashtagTimeline);
|
||||||
|
|
|
@ -295,8 +295,8 @@
|
||||||
"hashtag.column_settings.tag_mode.any": "Any of these",
|
"hashtag.column_settings.tag_mode.any": "Any of these",
|
||||||
"hashtag.column_settings.tag_mode.none": "None of these",
|
"hashtag.column_settings.tag_mode.none": "None of these",
|
||||||
"hashtag.column_settings.tag_toggle": "Include additional tags for this column",
|
"hashtag.column_settings.tag_toggle": "Include additional tags for this column",
|
||||||
"hashtag.follow": "Follow hashtag",
|
"hashtag.follow_button": "Follow",
|
||||||
"hashtag.unfollow": "Unfollow hashtag",
|
"hashtag.unfollow_button": "Unfollow",
|
||||||
"home.actions.go_to_explore": "See what's trending",
|
"home.actions.go_to_explore": "See what's trending",
|
||||||
"home.actions.go_to_suggestions": "Find people to follow",
|
"home.actions.go_to_suggestions": "Find people to follow",
|
||||||
"home.column_settings.basic": "Basic",
|
"home.column_settings.basic": "Basic",
|
||||||
|
|
|
@ -3983,6 +3983,12 @@ a.status-card {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.column-header__text-button {
|
||||||
|
align-self: center;
|
||||||
|
margin-inline-start: 8px;
|
||||||
|
margin-inline-end: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
.column-header__collapsible {
|
.column-header__collapsible {
|
||||||
max-height: 70vh;
|
max-height: 70vh;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
Loading…
Reference in a new issue