diff options
author | Thibaut Girka <thib@sitedethib.com> | 2020-11-12 22:13:57 +0100 |
---|---|---|
committer | Thibaut Girka <thib@sitedethib.com> | 2020-11-12 22:13:57 +0100 |
commit | c077cdaba70eac154909cad412ece409acc2e688 (patch) | |
tree | 7d13d319ce62475de15014406635f32a8742ca4b /app/javascript/mastodon/features | |
parent | 67125534bc0fd48a45d6cb17a5c78712d8e87150 (diff) | |
parent | 9870b175b477bbc984fc7945f1ebe07e3f2b0053 (diff) |
Merge branch 'master' into glitch-soc/merge-upstream
Conflicts: - `app/controllers/relationships_controller.rb`: Upstream changed a line too close to a glitch-soc only line related to glitch-soc's theming system. Applied upstream changes accordingly.
Diffstat (limited to 'app/javascript/mastodon/features')
-rw-r--r-- | app/javascript/mastodon/features/notifications/components/notifications_permission_banner.js | 23 | ||||
-rw-r--r-- | app/javascript/mastodon/features/picture_in_picture/components/header.js | 11 |
2 files changed, 29 insertions, 5 deletions
diff --git a/app/javascript/mastodon/features/notifications/components/notifications_permission_banner.js b/app/javascript/mastodon/features/notifications/components/notifications_permission_banner.js index 766c9bb5b..6daf75814 100644 --- a/app/javascript/mastodon/features/notifications/components/notifications_permission_banner.js +++ b/app/javascript/mastodon/features/notifications/components/notifications_permission_banner.js @@ -1,25 +1,42 @@ import React from 'react'; import Icon from 'mastodon/components/icon'; import Button from 'mastodon/components/button'; -import { requestBrowserPermission } from 'mastodon/actions/notifications'; +import IconButton from 'mastodon/components/icon_button'; +import { requestBrowserPermission, dismissBrowserPermission } from 'mastodon/actions/notifications'; import { connect } from 'react-redux'; import PropTypes from 'prop-types'; -import { FormattedMessage } from 'react-intl'; +import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; -export default @connect(() => {}) +const messages = defineMessages({ + close: { id: 'lightbox.close', defaultMessage: 'Close' }, +}); + +export default @connect() +@injectIntl class NotificationsPermissionBanner extends React.PureComponent { static propTypes = { dispatch: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, }; handleClick = () => { this.props.dispatch(requestBrowserPermission()); } + handleClose = () => { + this.props.dispatch(dismissBrowserPermission()); + } + render () { + const { intl } = this.props; + return ( <div className='notifications-permission-banner'> + <div className='notifications-permission-banner__close'> + <IconButton icon='times' onClick={this.handleClose} title={intl.formatMessage(messages.close)} /> + </div> + <h2><FormattedMessage id='notifications_permission_banner.title' defaultMessage='Never miss a thing' /></h2> <p><FormattedMessage id='notifications_permission_banner.how_to_control' defaultMessage="To receive notifications when Mastodon isn't open, enable desktop notifications. You can control precisely which types of interactions generate desktop notifications through the {icon} button above once they're enabled." values={{ icon: <Icon id='sliders' /> }} /></p> <Button onClick={this.handleClick}><FormattedMessage id='notifications_permission_banner.enable' defaultMessage='Enable desktop notifications' /></Button> diff --git a/app/javascript/mastodon/features/picture_in_picture/components/header.js b/app/javascript/mastodon/features/picture_in_picture/components/header.js index 4cb6de1a4..7dd199b75 100644 --- a/app/javascript/mastodon/features/picture_in_picture/components/header.js +++ b/app/javascript/mastodon/features/picture_in_picture/components/header.js @@ -7,12 +7,18 @@ import IconButton from 'mastodon/components/icon_button'; import { Link } from 'react-router-dom'; import Avatar from 'mastodon/components/avatar'; import DisplayName from 'mastodon/components/display_name'; +import { defineMessages, injectIntl } from 'react-intl'; + +const messages = defineMessages({ + close: { id: 'lightbox.close', defaultMessage: 'Close' }, +}); const mapStateToProps = (state, { accountId }) => ({ account: state.getIn(['accounts', accountId]), }); export default @connect(mapStateToProps) +@injectIntl class Header extends ImmutablePureComponent { static propTypes = { @@ -20,10 +26,11 @@ class Header extends ImmutablePureComponent { statusId: PropTypes.string.isRequired, account: ImmutablePropTypes.map.isRequired, onClose: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, }; render () { - const { account, statusId, onClose } = this.props; + const { account, statusId, onClose, intl } = this.props; return ( <div className='picture-in-picture__header'> @@ -32,7 +39,7 @@ class Header extends ImmutablePureComponent { <DisplayName account={account} /> </Link> - <IconButton icon='times' onClick={onClose} title='Close' /> + <IconButton icon='times' onClick={onClose} title={intl.formatMessage(messages.close)} /> </div> ); } |