diff options
Diffstat (limited to 'app/javascript/flavours/glitch/features')
10 files changed, 93 insertions, 45 deletions
diff --git a/app/javascript/flavours/glitch/features/account/components/follow_request_note.js b/app/javascript/flavours/glitch/features/account/components/follow_request_note.js new file mode 100644 index 000000000..73c1737a6 --- /dev/null +++ b/app/javascript/flavours/glitch/features/account/components/follow_request_note.js @@ -0,0 +1,37 @@ +import React from 'react'; +import ImmutablePropTypes from 'react-immutable-proptypes'; +import { FormattedMessage } from 'react-intl'; +import ImmutablePureComponent from 'react-immutable-pure-component'; +import Icon from 'flavours/glitch/components/icon'; + +export default class FollowRequestNote extends ImmutablePureComponent { + + static propTypes = { + account: ImmutablePropTypes.map.isRequired, + }; + + render () { + const { account, onAuthorize, onReject } = this.props; + + return ( + <div className='follow-request-banner'> + <div className='follow-request-banner__message'> + <FormattedMessage id='account.requested_follow' defaultMessage='{name} has requested to follow you' values={{ name: <bdi><strong dangerouslySetInnerHTML={{ __html: account.get('display_name_html') }} /></bdi> }} /> + </div> + + <div className='follow-request-banner__action'> + <button type='button' className='button button-tertiary button--confirmation' onClick={onAuthorize}> + <Icon id='check' fixedWidth /> + <FormattedMessage id='follow_request.authorize' defaultMessage='Authorize' /> + </button> + + <button type='button' className='button button-tertiary button--destructive' onClick={onReject}> + <Icon id='times' fixedWidth /> + <FormattedMessage id='follow_request.reject' defaultMessage='Reject' /> + </button> + </div> + </div> + ); + } + +} diff --git a/app/javascript/flavours/glitch/features/account/components/header.js b/app/javascript/flavours/glitch/features/account/components/header.js index d261c6ea5..b0fb527c7 100644 --- a/app/javascript/flavours/glitch/features/account/components/header.js +++ b/app/javascript/flavours/glitch/features/account/components/header.js @@ -13,6 +13,7 @@ import Button from 'flavours/glitch/components/button'; import { NavLink } from 'react-router-dom'; import DropdownMenuContainer from 'flavours/glitch/containers/dropdown_menu_container'; import AccountNoteContainer from '../containers/account_note_container'; +import FollowRequestNoteContainer from '../containers/follow_request_note_container'; import { PERMISSION_MANAGE_USERS } from 'flavours/glitch/permissions'; import { Helmet } from 'react-helmet'; @@ -314,6 +315,8 @@ class Header extends ImmutablePureComponent { return ( <div className={classNames('account__header', { inactive: !!account.get('moved') })} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave}> + {!(suspended || hidden || account.get('moved')) && account.getIn(['relationship', 'requested_by']) && <FollowRequestNoteContainer account={account} />} + <div className='account__header__image'> <div className='account__header__info'> {info} diff --git a/app/javascript/flavours/glitch/features/account/containers/follow_request_note_container.js b/app/javascript/flavours/glitch/features/account/containers/follow_request_note_container.js new file mode 100644 index 000000000..c6a3afb7e --- /dev/null +++ b/app/javascript/flavours/glitch/features/account/containers/follow_request_note_container.js @@ -0,0 +1,15 @@ +import { connect } from 'react-redux'; +import FollowRequestNote from '../components/follow_request_note'; +import { authorizeFollowRequest, rejectFollowRequest } from 'flavours/glitch/actions/accounts'; + +const mapDispatchToProps = (dispatch, { account }) => ({ + onAuthorize () { + dispatch(authorizeFollowRequest(account.get('id'))); + }, + + onReject () { + dispatch(rejectFollowRequest(account.get('id'))); + }, +}); + +export default connect(null, mapDispatchToProps)(FollowRequestNote); diff --git a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js index f7a7fd467..f20ee685e 100644 --- a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js +++ b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js @@ -104,6 +104,7 @@ export default class MediaItem extends ImmutablePureComponent { <video className='media-gallery__item-gifv-thumbnail' aria-label={attachment.get('description')} + title={attachment.get('description')} role='application' src={attachment.get('url')} onMouseEnter={this.handleMouseEnter} diff --git a/app/javascript/flavours/glitch/features/compose/components/poll_form.js b/app/javascript/flavours/glitch/features/compose/components/poll_form.js index d5edccff3..afb5da097 100644 --- a/app/javascript/flavours/glitch/features/compose/components/poll_form.js +++ b/app/javascript/flavours/glitch/features/compose/components/poll_form.js @@ -153,6 +153,7 @@ class PollForm extends ImmutablePureComponent { <option value={1800}>{intl.formatMessage(messages.minutes, { number: 30 })}</option> <option value={3600}>{intl.formatMessage(messages.hours, { number: 1 })}</option> <option value={21600}>{intl.formatMessage(messages.hours, { number: 6 })}</option> + <option value={43200}>{intl.formatMessage(messages.hours, { number: 12 })}</option> <option value={86400}>{intl.formatMessage(messages.days, { number: 1 })}</option> <option value={259200}>{intl.formatMessage(messages.days, { number: 3 })}</option> <option value={604800}>{intl.formatMessage(messages.days, { number: 7 })}</option> diff --git a/app/javascript/flavours/glitch/features/compose/components/search.js b/app/javascript/flavours/glitch/features/compose/components/search.js index 326fe5b70..9f90a767d 100644 --- a/app/javascript/flavours/glitch/features/compose/components/search.js +++ b/app/javascript/flavours/glitch/features/compose/components/search.js @@ -144,33 +144,24 @@ class Search extends React.PureComponent { return ( <div className='search'> - <label> - <span style={{ display: 'none' }}>{intl.formatMessage(messages.placeholder)}</span> - <input - ref={this.setRef} - className='search__input' - type='text' - placeholder={intl.formatMessage(signedIn ? messages.placeholderSignedIn : messages.placeholder)} - value={value || ''} - onChange={this.handleChange} - onKeyUp={this.handleKeyUp} - onFocus={this.handleFocus} - onBlur={this.handleBlur} - /> - </label> - - <div - aria-label={intl.formatMessage(messages.placeholder)} - className='search__icon' - onClick={this.handleClear} - role='button' - tabIndex='0' - > + <input + ref={this.setRef} + className='search__input' + type='text' + placeholder={intl.formatMessage(signedIn ? messages.placeholderSignedIn : messages.placeholder)} + aria-label={intl.formatMessage(signedIn ? messages.placeholderSignedIn : messages.placeholder)} + value={value || ''} + onChange={this.handleChange} + onKeyUp={this.handleKeyUp} + onFocus={this.handleFocus} + onBlur={this.handleBlur} + /> + + <div role='button' tabIndex='0' className='search__icon' onClick={this.handleClear}> <Icon id='search' className={hasValue ? '' : 'active'} /> <Icon id='times-circle' className={hasValue ? 'active' : ''} /> </div> - - <Overlay show={expanded && !hasValue} placement='bottom' target={this}> + <Overlay show={expanded && !hasValue} placement='bottom' target={this} container={this}> <SearchPopout /> </Overlay> </div> diff --git a/app/javascript/flavours/glitch/features/explore/index.js b/app/javascript/flavours/glitch/features/explore/index.js index ba435d7e3..da0dc7f7c 100644 --- a/app/javascript/flavours/glitch/features/explore/index.js +++ b/app/javascript/flavours/glitch/features/explore/index.js @@ -24,16 +24,6 @@ const mapStateToProps = state => ({ isSearching: state.getIn(['search', 'submitted']) || !showTrends, }); -// Fix strange bug on Safari where <span> (rendered by FormattedMessage) disappears -// after clicking around Explore top bar (issue #20885). -// Removing width=100% from <a> also fixes it, as well as replacing <span> with <div> -// We're choosing to wrap span with div to keep the changes local only to this tool bar. -const WrapFormattedMessage = ({ children, ...props }) => <div><FormattedMessage {...props}>{children}</FormattedMessage></div>; -WrapFormattedMessage.propTypes = { - children: PropTypes.any, -}; - - export default @connect(mapStateToProps) @injectIntl class Explore extends React.PureComponent { @@ -78,12 +68,22 @@ class Explore extends React.PureComponent { {isSearching ? ( <SearchResults /> ) : ( - <React.Fragment> + <> <div className='account__section-headline'> - <NavLink exact to='/explore'><WrapFormattedMessage id='explore.trending_statuses' defaultMessage='Posts' /></NavLink> - <NavLink exact to='/explore/tags'><WrapFormattedMessage id='explore.trending_tags' defaultMessage='Hashtags' /></NavLink> - <NavLink exact to='/explore/links'><WrapFormattedMessage id='explore.trending_links' defaultMessage='News' /></NavLink> - {signedIn && <NavLink exact to='/explore/suggestions'><WrapFormattedMessage id='explore.suggested_follows' defaultMessage='For you' /></NavLink>} + <NavLink exact to='/explore'> + <FormattedMessage tagName='div' id='explore.trending_statuses' defaultMessage='Posts' /> + </NavLink> + <NavLink exact to='/explore/tags'> + <FormattedMessage tagName='div' id='explore.trending_tags' defaultMessage='Hashtags' /> + </NavLink> + <NavLink exact to='/explore/links'> + <FormattedMessage tagName='div' id='explore.trending_links' defaultMessage='News' /> + </NavLink> + {signedIn && ( + <NavLink exact to='/explore/suggestions'> + <FormattedMessage tagName='div' id='explore.suggested_follows' defaultMessage='For you' /> + </NavLink> + )} </div> <Switch> @@ -97,7 +97,7 @@ class Explore extends React.PureComponent { <title>{intl.formatMessage(messages.title)}</title> <meta name='robots' content={isSearching ? 'noindex' : 'all'} /> </Helmet> - </React.Fragment> + </> )} </div> </Column> diff --git a/app/javascript/flavours/glitch/features/hashtag_timeline/index.js b/app/javascript/flavours/glitch/features/hashtag_timeline/index.js index 4428fdecf..219dc0ec6 100644 --- a/app/javascript/flavours/glitch/features/hashtag_timeline/index.js +++ b/app/javascript/flavours/glitch/features/hashtag_timeline/index.js @@ -194,7 +194,7 @@ class HashtagTimeline extends React.PureComponent { const following = tag.get('following'); followButton = ( - <button className={classNames('column-header__button')} onClick={this.handleFollow} disabled={!signedIn} title={intl.formatMessage(following ? messages.unfollowHashtag : messages.followHashtag)} aria-label={intl.formatMessage(following ? messages.unfollowHashtag : messages.followHashtag)}> + <button className={classNames('column-header__button')} onClick={this.handleFollow} disabled={!signedIn} active={following} title={intl.formatMessage(following ? messages.unfollowHashtag : messages.followHashtag)} aria-label={intl.formatMessage(following ? messages.unfollowHashtag : messages.followHashtag)}> <Icon id={following ? 'user-times' : 'user-plus'} fixedWidth className='column-header__icon' /> </button> ); diff --git a/app/javascript/flavours/glitch/features/ui/components/columns_area.js b/app/javascript/flavours/glitch/features/ui/components/columns_area.js index bf3e79c24..993a50796 100644 --- a/app/javascript/flavours/glitch/features/ui/components/columns_area.js +++ b/app/javascript/flavours/glitch/features/ui/components/columns_area.js @@ -99,7 +99,7 @@ export default class ColumnsArea extends ImmutablePureComponent { if (this.mediaQuery.removeEventListener) { this.mediaQuery.removeEventListener('change', this.handleLayoutChange); } else { - this.mediaQuery.removeListener(this.handleLayouteChange); + this.mediaQuery.removeListener(this.handleLayoutChange); } } } diff --git a/app/javascript/flavours/glitch/features/ui/components/focal_point_modal.js b/app/javascript/flavours/glitch/features/ui/components/focal_point_modal.js index de330b3a1..0dd07fb76 100644 --- a/app/javascript/flavours/glitch/features/ui/components/focal_point_modal.js +++ b/app/javascript/flavours/glitch/features/ui/components/focal_point_modal.js @@ -291,11 +291,11 @@ class FocalPointModal extends ImmutablePureComponent { let descriptionLabel = null; if (media.get('type') === 'audio') { - descriptionLabel = <FormattedMessage id='upload_form.audio_description' defaultMessage='Describe for people with hearing loss' />; + descriptionLabel = <FormattedMessage id='upload_form.audio_description' defaultMessage='Describe for people who are hard of hearing' />; } else if (media.get('type') === 'video') { - descriptionLabel = <FormattedMessage id='upload_form.video_description' defaultMessage='Describe for people with hearing loss or visual impairment' />; + descriptionLabel = <FormattedMessage id='upload_form.video_description' defaultMessage='Describe for people who are deaf, hard of hearing, blind or have low vision' />; } else { - descriptionLabel = <FormattedMessage id='upload_form.description' defaultMessage='Describe for the visually impaired' />; + descriptionLabel = <FormattedMessage id='upload_form.description' defaultMessage='Describe for people who are blind or have low vision' />; } let ocrMessage = ''; |