Files
.circleci
.dependabot
.github
app
chewy
controllers
helpers
javascript
fonts
images
mastodon
actions
components
containers
features
account
account_gallery
account_timeline
audio
blocks
bookmarked_statuses
community_timeline
compose
direct_timeline
directory
domain_blocks
emoji
favourited_statuses
favourites
follow_requests
followers
following
generic_not_found
getting_started
hashtag_timeline
home_timeline
introduction
keyboard_shortcuts
list_adder
list_editor
list_timeline
lists
mutes
notifications
components
clear_column_button.js
column_settings.js
filter_bar.js
follow_request.js
notification.js
setting_toggle.js
containers
index.js
pinned_statuses
public_timeline
reblogs
report
search
standalone
status
ui
video
locales
middleware
reducers
selectors
service_worker
storage
store
utils
api.js
base_polyfills.js
common.js
compare_id.js
extra_polyfills.js
initial_state.js
is_mobile.js
load_keyboard_extensions.js
load_polyfills.js
main.js
performance.js
ready.js
rtl.js
scroll.js
settings.js
stream.js
test_setup.js
uuid.js
packs
styles
lib
mailers
models
policies
presenters
serializers
services
validators
views
workers
bin
config
db
dist
lib
log
nanobox
public
spec
streaming
vendor
.buildpacks
.codeclimate.yml
.dockerignore
.editorconfig
.env.nanobox
.env.production.sample
.env.test
.env.vagrant
.eslintignore
.eslintrc.js
.foreman
.gitattributes
.gitignore
.haml-lint.yml
.nanoignore
.nvmrc
.profile
.rspec
.rubocop.yml
.ruby-version
.sass-lint.yml
.slugignore
.yarnclean
AUTHORS.md
Aptfile
CHANGELOG.md
CODE_OF_CONDUCT.md
CONTRIBUTING.md
Capfile
Dockerfile
Gemfile
Gemfile.lock
LICENSE
Procfile
Procfile.dev
README.md
Rakefile
Vagrantfile
app.json
babel.config.js
boxfile.yml
config.ru
crowdin.yml
docker-compose.yml
ide-helper.js
package.json
postcss.config.js
priv-config
scalingo.json
yarn.lock
hometown/app/javascript/mastodon/features/notifications/components/follow_request.js
ThibG 911cc14481 Add follow_request notification type ()
* Add follow_request notification type

The notification type already existed in the backend but was never pushed
to the front-end. This also means translation strings were also available
for the backend, from the notification mailer.

Unlike other notification types, these are off by default, to match what
I remember of Gargron's view on the topic: that follow requests should not
clutter notifications and should instead be reviewed at the user's own
leisure in the dedicated column.

Since follow requests have their own column, I've deemed it unnecessary to
add a specific tab for them in the notification quick filter.

* Show follow request link in single-column if there are pending requests, even if account isn't locked

* Push follow requests from notifications to the follow_requests list

* Offer to accept or reject follow request from the notification

* Redesign follow request notification
2019-12-01 17:25:29 +01:00

60 lines
2.0 KiB
JavaScript

import React, { Fragment } from 'react';
import ImmutablePropTypes from 'react-immutable-proptypes';
import PropTypes from 'prop-types';
import Avatar from 'mastodon/components/avatar';
import DisplayName from 'mastodon/components/display_name';
import Permalink from 'mastodon/components/permalink';
import IconButton from 'mastodon/components/icon_button';
import { defineMessages, injectIntl } from 'react-intl';
import ImmutablePureComponent from 'react-immutable-pure-component';
const messages = defineMessages({
authorize: { id: 'follow_request.authorize', defaultMessage: 'Authorize' },
reject: { id: 'follow_request.reject', defaultMessage: 'Reject' },
});
export default @injectIntl
class FollowRequest extends ImmutablePureComponent {
static propTypes = {
account: ImmutablePropTypes.map.isRequired,
onAuthorize: PropTypes.func.isRequired,
onReject: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
};
render () {
const { intl, hidden, account, onAuthorize, onReject } = this.props;
if (!account) {
return <div />;
}
if (hidden) {
return (
<Fragment>
{account.get('display_name')}
{account.get('username')}
</Fragment>
);
}
return (
<div className='account'>
<div className='account__wrapper'>
<Permalink key={account.get('id')} className='account__display-name' title={account.get('acct')} href={account.get('url')} to={`/accounts/${account.get('id')}`}>
<div className='account__avatar-wrapper'><Avatar account={account} size={36} /></div>
<DisplayName account={account} />
</Permalink>
<div className='account__relationship'>
<IconButton title={intl.formatMessage(messages.authorize)} icon='check' onClick={onAuthorize} />
<IconButton title={intl.formatMessage(messages.reject)} icon='times' onClick={onReject} />
</div>
</div>
</div>
);
}
}