diff options
author | Thibaut Girka <thib@sitedethib.com> | 2020-04-02 20:32:00 +0200 |
---|---|---|
committer | Thibaut Girka <thib@sitedethib.com> | 2020-04-02 20:32:00 +0200 |
commit | f3eff922a3350b9c54ef6fd5f8804722fdbe4c9c (patch) | |
tree | 01c49b43b2b4349756d5ea43f2330fd08d323c4a /app/javascript | |
parent | a192b193bdf7013df09c6cd63916274cd9d47cf7 (diff) | |
parent | 69558d2fe5284d2b6168706bd7cbd8b7fb2b0847 (diff) |
Merge branch 'master' into glitch-soc/merge-upstream
Conflicts: - `app/javascript/mastodon/features/compose/components/poll_form.js`: Upstream bumped poll option character limit, but we already had a higher one, kept ours. - `app/validators/poll_validator.rb`: Upstream bumped poll option character limit, but we already had a higher one, kept ours. - `config/initializers/content_security_policy.rb`: Upstream added a rule, the way we compute ours is different, but that added rule has been ported. - `package.json`: No real conflict, dependency update. Performed the same update. - `yarn.lock`: No real conflict, dependency update. Performed the same update.
Diffstat (limited to 'app/javascript')
-rw-r--r-- | app/javascript/mastodon/actions/accounts.js | 3 | ||||
-rw-r--r-- | app/javascript/mastodon/actions/alerts.js | 4 | ||||
-rw-r--r-- | app/javascript/mastodon/actions/identity_proofs.js | 1 | ||||
-rw-r--r-- | app/javascript/mastodon/actions/timelines.js | 1 | ||||
-rw-r--r-- | app/javascript/mastodon/components/column_header.js | 3 | ||||
-rw-r--r-- | app/javascript/mastodon/components/poll.js | 28 | ||||
-rw-r--r-- | app/javascript/mastodon/components/status.js | 8 | ||||
-rw-r--r-- | app/javascript/mastodon/components/status_content.js | 14 | ||||
-rw-r--r-- | app/javascript/mastodon/features/compose/components/poll_form.js | 2 | ||||
-rw-r--r-- | app/javascript/mastodon/features/direct_timeline/components/conversation.js | 2 | ||||
-rw-r--r-- | app/javascript/mastodon/middleware/errors.js | 2 | ||||
-rw-r--r-- | app/javascript/mastodon/reducers/compose.js | 1 | ||||
-rw-r--r-- | app/javascript/styles/mastodon-light/diff.scss | 2 | ||||
-rw-r--r-- | app/javascript/styles/mastodon/components.scss | 8 | ||||
-rw-r--r-- | app/javascript/styles/mastodon/polls.scss | 40 |
15 files changed, 70 insertions, 49 deletions
diff --git a/app/javascript/mastodon/actions/accounts.js b/app/javascript/mastodon/actions/accounts.js index 4af36e998..cb2c682a4 100644 --- a/app/javascript/mastodon/actions/accounts.js +++ b/app/javascript/mastodon/actions/accounts.js @@ -396,6 +396,7 @@ export function fetchFollowersFail(id, error) { type: FOLLOWERS_FETCH_FAIL, id, error, + skipNotFound: true, }; }; @@ -482,6 +483,7 @@ export function fetchFollowingFail(id, error) { type: FOLLOWING_FETCH_FAIL, id, error, + skipNotFound: true, }; }; @@ -571,6 +573,7 @@ export function fetchRelationshipsFail(error) { type: RELATIONSHIPS_FETCH_FAIL, error, skipLoading: true, + skipNotFound: true, }; }; diff --git a/app/javascript/mastodon/actions/alerts.js b/app/javascript/mastodon/actions/alerts.js index cd36d8007..1670f9c10 100644 --- a/app/javascript/mastodon/actions/alerts.js +++ b/app/javascript/mastodon/actions/alerts.js @@ -34,11 +34,11 @@ export function showAlert(title = messages.unexpectedTitle, message = messages.u }; }; -export function showAlertForError(error) { +export function showAlertForError(error, skipNotFound = false) { if (error.response) { const { data, status, statusText, headers } = error.response; - if (status === 404 || status === 410) { + if (skipNotFound && (status === 404 || status === 410)) { // Skip these errors as they are reflected in the UI return { type: ALERT_NOOP }; } diff --git a/app/javascript/mastodon/actions/identity_proofs.js b/app/javascript/mastodon/actions/identity_proofs.js index 449debf61..103983956 100644 --- a/app/javascript/mastodon/actions/identity_proofs.js +++ b/app/javascript/mastodon/actions/identity_proofs.js @@ -27,4 +27,5 @@ export const fetchAccountIdentityProofsFail = (accountId, err) => ({ type: IDENTITY_PROOFS_ACCOUNT_FETCH_FAIL, accountId, err, + skipNotFound: true, }); diff --git a/app/javascript/mastodon/actions/timelines.js b/app/javascript/mastodon/actions/timelines.js index 054668655..cdd2111f8 100644 --- a/app/javascript/mastodon/actions/timelines.js +++ b/app/javascript/mastodon/actions/timelines.js @@ -149,6 +149,7 @@ export function expandTimelineFail(timeline, error, isLoadingMore) { timeline, error, skipLoading: !isLoadingMore, + skipNotFound: timeline.startsWith('account:'), }; }; diff --git a/app/javascript/mastodon/components/column_header.js b/app/javascript/mastodon/components/column_header.js index ea82f9ef9..1bb583583 100644 --- a/app/javascript/mastodon/components/column_header.js +++ b/app/javascript/mastodon/components/column_header.js @@ -76,8 +76,9 @@ class ColumnHeader extends React.PureComponent { handlePin = () => { if (!this.props.pinned) { - this.historyBack(); + this.context.router.history.replace('/'); } + this.props.onPin(); } diff --git a/app/javascript/mastodon/components/poll.js b/app/javascript/mastodon/components/poll.js index 3a17e80e7..7525a1030 100644 --- a/app/javascript/mastodon/components/poll.js +++ b/app/javascript/mastodon/components/poll.js @@ -127,15 +127,7 @@ class Poll extends ImmutablePureComponent { return ( <li key={option.get('title')}> - {showResults && ( - <Motion defaultStyle={{ width: 0 }} style={{ width: spring(percent, { stiffness: 180, damping: 12 }) }}> - {({ width }) => - <span className={classNames('poll__chart', { leading })} style={{ width: `${width}%` }} /> - } - </Motion> - )} - - <label className={classNames('poll__text', { selectable: !showResults })}> + <label className={classNames('poll__option', { selectable: !showResults })}> <input name='vote-options' type={poll.get('multiple') ? 'checkbox' : 'radio'} @@ -157,12 +149,26 @@ class Poll extends ImmutablePureComponent { /> )} {showResults && <span className='poll__number'> - {!!voted && <Icon id='check' className='poll__vote__mark' title={intl.formatMessage(messages.voted)} />} {Math.round(percent)}% </span>} - <span dangerouslySetInnerHTML={{ __html: titleEmojified }} /> + <span + className='poll__option__text' + dangerouslySetInnerHTML={{ __html: titleEmojified }} + /> + + {!!voted && <span className='poll__voted'> + <Icon id='check' className='poll__voted__mark' title={intl.formatMessage(messages.voted)} /> + </span>} </label> + + {showResults && ( + <Motion defaultStyle={{ width: 0 }} style={{ width: spring(percent, { stiffness: 180, damping: 12 }) }}> + {({ width }) => + <span className={classNames('poll__chart', { leading })} style={{ width: `${width}%` }} /> + } + </Motion> + )} </li> ); } diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js index 0dc00cb98..075ee1b87 100644 --- a/app/javascript/mastodon/components/status.js +++ b/app/javascript/mastodon/components/status.js @@ -432,16 +432,10 @@ class Status extends ImmutablePureComponent { </a> </div> - <StatusContent status={status} onClick={this.handleClick} expanded={!status.get('hidden')} onExpandedToggle={this.handleExpandedToggle} collapsable onCollapsedToggle={this.handleCollapsedToggle} /> + <StatusContent status={status} onClick={this.handleClick} expanded={!status.get('hidden')} showThread={showThread} onExpandedToggle={this.handleExpandedToggle} collapsable onCollapsedToggle={this.handleCollapsedToggle} /> {media} - {showThread && status.get('in_reply_to_id') && status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) && ( - <button className='status__content__read-more-button' onClick={this.handleClick}> - <FormattedMessage id='status.show_thread' defaultMessage='Show thread' /> - </button> - )} - <StatusActionBar status={status} account={account} {...other} /> </div> </div> diff --git a/app/javascript/mastodon/components/status_content.js b/app/javascript/mastodon/components/status_content.js index 5d921fd41..3200f2d82 100644 --- a/app/javascript/mastodon/components/status_content.js +++ b/app/javascript/mastodon/components/status_content.js @@ -20,6 +20,7 @@ export default class StatusContent extends React.PureComponent { static propTypes = { status: ImmutablePropTypes.map.isRequired, expanded: PropTypes.bool, + showThread: PropTypes.bool, onExpandedToggle: PropTypes.func, onClick: PropTypes.func, collapsable: PropTypes.bool, @@ -181,6 +182,7 @@ export default class StatusContent extends React.PureComponent { const hidden = this.props.onExpandedToggle ? !this.props.expanded : this.state.hidden; const renderReadMore = this.props.onClick && status.get('collapsed'); + const renderViewThread = this.props.showThread && status.get('in_reply_to_id') && status.get('in_reply_to_account_id') === status.getIn(['account', 'id']); const content = { __html: status.get('contentHtml') }; const spoilerContent = { __html: status.get('spoilerHtml') }; @@ -195,6 +197,12 @@ export default class StatusContent extends React.PureComponent { directionStyle.direction = 'rtl'; } + const showThreadButton = ( + <button className='status__content__read-more-button' onClick={this.props.onClick}> + <FormattedMessage id='status.show_thread' defaultMessage='Show thread' /> + </button> + ); + const readMoreButton = ( <button className='status__content__read-more-button' onClick={this.props.onClick} key='read-more'> <FormattedMessage id='status.read_more' defaultMessage='Read more' /><Icon id='angle-right' fixedWidth /> @@ -229,6 +237,8 @@ export default class StatusContent extends React.PureComponent { <div tabIndex={!hidden ? 0 : null} className={`status__content__text ${!hidden ? 'status__content__text--visible' : ''}`} style={directionStyle} dangerouslySetInnerHTML={content} /> {!hidden && !!status.get('poll') && <PollContainer pollId={status.get('poll')} />} + + {renderViewThread && showThreadButton} </div> ); } else if (this.props.onClick) { @@ -237,6 +247,8 @@ export default class StatusContent extends React.PureComponent { <div className='status__content__text status__content__text--visible' style={directionStyle} dangerouslySetInnerHTML={content} /> {!!status.get('poll') && <PollContainer pollId={status.get('poll')} />} + + {renderViewThread && showThreadButton} </div>, ]; @@ -251,6 +263,8 @@ export default class StatusContent extends React.PureComponent { <div className='status__content__text status__content__text--visible' style={directionStyle} dangerouslySetInnerHTML={content} /> {!!status.get('poll') && <PollContainer pollId={status.get('poll')} />} + + {renderViewThread && showThreadButton} </div> ); } diff --git a/app/javascript/mastodon/features/compose/components/poll_form.js b/app/javascript/mastodon/features/compose/components/poll_form.js index cc740def2..271019dfe 100644 --- a/app/javascript/mastodon/features/compose/components/poll_form.js +++ b/app/javascript/mastodon/features/compose/components/poll_form.js @@ -75,7 +75,7 @@ class Option extends React.PureComponent { return ( <li> - <label className='poll__text editable'> + <label className='poll__option editable'> <span className={classNames('poll__input', { checkbox: isPollMultiple })} onClick={this.handleToggleMultiple} diff --git a/app/javascript/mastodon/features/direct_timeline/components/conversation.js b/app/javascript/mastodon/features/direct_timeline/components/conversation.js index 235cb7ad8..f9e45067f 100644 --- a/app/javascript/mastodon/features/direct_timeline/components/conversation.js +++ b/app/javascript/mastodon/features/direct_timeline/components/conversation.js @@ -160,7 +160,7 @@ class Conversation extends ImmutablePureComponent { return ( <HotKeys handlers={handlers}> <div className={classNames('conversation focusable muted', { 'conversation--unread': unread })} tabIndex='0'> - <div className='conversation__avatar'> + <div className='conversation__avatar' onClick={this.handleClick} role='presentation'> <AvatarComposite accounts={accounts} size={48} /> </div> diff --git a/app/javascript/mastodon/middleware/errors.js b/app/javascript/mastodon/middleware/errors.js index 3cebb42e0..0a65fd321 100644 --- a/app/javascript/mastodon/middleware/errors.js +++ b/app/javascript/mastodon/middleware/errors.js @@ -8,7 +8,7 @@ export default function errorsMiddleware() { const isFail = new RegExp(`${defaultFailSuffix}$`, 'g'); if (action.type.match(isFail)) { - dispatch(showAlertForError(action.error)); + dispatch(showAlertForError(action.error, action.skipNotFound)); } } diff --git a/app/javascript/mastodon/reducers/compose.js b/app/javascript/mastodon/reducers/compose.js index c6653fe4c..e6e6d2ae1 100644 --- a/app/javascript/mastodon/reducers/compose.js +++ b/app/javascript/mastodon/reducers/compose.js @@ -261,7 +261,6 @@ export default function compose(state = initialState, action) { }); case COMPOSE_SPOILERNESS_CHANGE: return state.withMutations(map => { - map.set('spoiler_text', ''); map.set('spoiler', !state.get('spoiler')); map.set('idempotencyKey', uuid()); diff --git a/app/javascript/styles/mastodon-light/diff.scss b/app/javascript/styles/mastodon-light/diff.scss index 05e52966b..7a846bcc6 100644 --- a/app/javascript/styles/mastodon-light/diff.scss +++ b/app/javascript/styles/mastodon-light/diff.scss @@ -142,7 +142,7 @@ html { } .compose-form__autosuggest-wrapper, -.poll__text input[type="text"], +.poll__option input[type="text"], .compose-form .spoiler-input__input, .compose-form__poll-wrapper select, .search__input, diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index 143384d9e..aea2ae6cb 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -1028,13 +1028,11 @@ } .display-name { + color: $light-text-color; + strong { color: $inverted-text-color; } - - span { - color: $light-text-color; - } } .status__content { @@ -1333,7 +1331,6 @@ border-radius: 50%; overflow: hidden; position: relative; - cursor: default; & > div { float: left; @@ -6570,6 +6567,7 @@ noscript { padding: 10px; padding-top: 12px; position: relative; + cursor: pointer; } &__unread { diff --git a/app/javascript/styles/mastodon/polls.scss b/app/javascript/styles/mastodon/polls.scss index 4e34813ed..1ecc8434d 100644 --- a/app/javascript/styles/mastodon/polls.scss +++ b/app/javascript/styles/mastodon/polls.scss @@ -8,20 +8,18 @@ } &__chart { - position: absolute; - top: 0; - left: 0; - height: 100%; - display: inline-block; border-radius: 4px; - background: darken($ui-primary-color, 14%); + display: block; + background: darken($ui-primary-color, 5%); + height: 5px; + min-width: 1%; &.leading { background: $ui-highlight-color; } } - &__text { + &__option { position: relative; display: flex; padding: 6px 0; @@ -29,6 +27,13 @@ cursor: default; overflow: hidden; + &__text { + display: inline-block; + word-wrap: break-word; + overflow-wrap: break-word; + max-width: calc(100% - 45px - 25px); + } + input[type=radio], input[type=checkbox] { display: none; @@ -112,19 +117,18 @@ &__number { display: inline-block; - width: 52px; + width: 45px; font-weight: 700; - padding: 0 10px; - padding-left: 8px; - text-align: right; - margin-top: auto; - margin-bottom: auto; - flex: 0 0 52px; + flex: 0 0 45px; } - &__vote__mark { - float: left; - line-height: 18px; + &__voted { + padding: 0 5px; + display: inline-block; + + &__mark { + font-size: 18px; + } } &__footer { @@ -199,7 +203,7 @@ display: flex; align-items: center; - .poll__text { + .poll__option { flex: 0 0 auto; width: calc(100% - (23px + 6px)); margin-right: 6px; |