Skip to content

Commit 21c05f8

Browse files
ClearlyClaireClearlyClaire
authored
Merge pull request #3012 from ClearlyClaire/glitch-soc/merge-upstream
Merge upstream changes up to c93b2c6
2 parents 2d24862 + 7e8a06b commit 21c05f8

File tree

21 files changed

+182
-111
lines changed

21 files changed

+182
-111
lines changed

‎app/javascript/flavours/glitch/components/media_gallery.jsx

+3-2
Original file line numberDiff line numberDiff line change
@@ -231,6 +231,7 @@ class MediaGallery extends PureComponent {
231231
visible: PropTypes.bool,
232232
autoplay: PropTypes.bool,
233233
onToggleVisibility: PropTypes.func,
234+
matchedFilters: PropTypes.arrayOf(PropTypes.string),
234235
};
235236

236237
static defaultProps = {
@@ -314,7 +315,7 @@ class MediaGallery extends PureComponent {
314315
}
315316

316317
render () {
317-
const { media, lang, sensitive, letterbox, fullwidth, defaultWidth, autoplay } = this.props;
318+
const { media, lang, sensitive, letterbox, fullwidth, defaultWidth, autoplay, matchedFilters } = this.props;
318319
const { visible } = this.state;
319320
const size = media.size;
320321
const uncached = media.every(attachment => attachment.get('type') === 'unknown');
@@ -343,7 +344,7 @@ class MediaGallery extends PureComponent {
343344
<div className={computedClass} style={style} ref={this.handleRef}>
344345
{children}
345346

346-
{(!visible || uncached) && <SpoilerButton uncached={uncached} sensitive={sensitive} onClick={this.handleOpen} />}
347+
{(!visible || uncached) && <SpoilerButton uncached={uncached} sensitive={sensitive} onClick={this.handleOpen} matchedFilters={matchedFilters} />}
347348

348349
{(visible && !uncached) && (
349350
<div className='media-gallery__actions'>

‎app/javascript/flavours/glitch/components/spoiler_button.tsx

+16
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,15 @@ interface Props {
66
hidden?: boolean;
77
sensitive: boolean;
88
uncached?: boolean;
9+
matchedFilters?: string[];
910
onClick: React.MouseEventHandler<HTMLButtonElement>;
1011
}
1112

1213
export const SpoilerButton: React.FC<Props> = ({
1314
hidden = false,
1415
sensitive,
1516
uncached = false,
17+
matchedFilters,
1618
onClick,
1719
}) => {
1820
let warning;
@@ -28,6 +30,20 @@ export const SpoilerButton: React.FC<Props> = ({
2830
action = (
2931
<FormattedMessage id='status.media.open' defaultMessage='Click to open' />
3032
);
33+
} else if (matchedFilters) {
34+
warning = (
35+
<FormattedMessage
36+
id='filter_warning.matches_filter'
37+
defaultMessage='Matches filter “<span>{title}</span>”'
38+
values={{
39+
title: matchedFilters.join(', '),
40+
span: (chunks) => <span className='filter-name'>{chunks}</span>,
41+
}}
42+
/>
43+
);
44+
action = (
45+
<FormattedMessage id='status.media.show' defaultMessage='Click to show' />
46+
);
3147
} else if (sensitive) {
3248
warning = (
3349
<FormattedMessage

‎app/javascript/flavours/glitch/components/status.jsx

+4-1
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ export const defaultMediaVisibility = (status, settings) => {
7070
return true;
7171
}
7272

73-
return (displayMedia !== 'hide_all' && !status.get('sensitive') || displayMedia === 'show_all');
73+
return !status.get('matched_media_filters') && (displayMedia !== 'hide_all' && !status.get('sensitive') || displayMedia === 'show_all');
7474
};
7575

7676
class Status extends ImmutablePureComponent {
@@ -557,6 +557,7 @@ class Status extends ImmutablePureComponent {
557557
defaultWidth={this.props.cachedMediaWidth}
558558
visible={this.state.showMedia}
559559
onToggleVisibility={this.handleToggleMediaVisibility}
560+
matchedFilters={status.get('matched_media_filters')}
560561
/>
561562
)}
562563
</Bundle>,
@@ -586,6 +587,7 @@ class Status extends ImmutablePureComponent {
586587
blurhash={attachment.get('blurhash')}
587588
visible={this.state.showMedia}
588589
onToggleVisibility={this.handleToggleMediaVisibility}
590+
matchedFilters={status.get('matched_media_filters')}
589591
/>
590592
)}
591593
</Bundle>,
@@ -613,6 +615,7 @@ class Status extends ImmutablePureComponent {
613615
deployPictureInPicture={pictureInPicture.get('available') ? this.handleDeployPictureInPicture : undefined}
614616
visible={this.state.showMedia}
615617
onToggleVisibility={this.handleToggleMediaVisibility}
618+
matchedFilters={status.get('matched_media_filters')}
616619
/>)}
617620
</Bundle>,
618621
);

‎app/javascript/flavours/glitch/features/audio/index.jsx

+3-2
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,7 @@ class Audio extends PureComponent {
6262
volume: PropTypes.number,
6363
muted: PropTypes.bool,
6464
deployPictureInPicture: PropTypes.func,
65+
matchedFilters: PropTypes.arrayOf(PropTypes.string),
6566
};
6667

6768
state = {
@@ -478,7 +479,7 @@ class Audio extends PureComponent {
478479
};
479480

480481
render () {
481-
const { src, intl, alt, lang, editable, autoPlay, sensitive, blurhash } = this.props;
482+
const { src, intl, alt, lang, editable, autoPlay, sensitive, blurhash, matchedFilters } = this.props;
482483
const { paused, volume, currentTime, duration, buffer, dragging, revealed } = this.state;
483484
const progress = Math.min((currentTime / duration) * 100, 100);
484485
const muted = this.state.muted || volume === 0;
@@ -520,7 +521,7 @@ class Audio extends PureComponent {
520521
lang={lang}
521522
/>
522523

523-
<SpoilerButton hidden={revealed || editable} sensitive={sensitive} onClick={this.toggleReveal} />
524+
<SpoilerButton hidden={revealed || editable} sensitive={sensitive} onClick={this.toggleReveal} matchedFilters={matchedFilters} />
524525

525526
{(revealed || editable) && <img
526527
src={this.props.poster}

‎app/javascript/flavours/glitch/features/status/components/detailed_status.tsx

+3
Original file line numberDiff line numberDiff line change
@@ -190,6 +190,7 @@ export const DetailedStatus: React.FC<{
190190
onOpenMedia={onOpenMedia}
191191
visible={showMedia}
192192
onToggleVisibility={onToggleMediaVisibility}
193+
matchedFilters={status.get('matched_media_filters')}
193194
/>
194195
);
195196
mediaIcons.push('picture-o');
@@ -217,6 +218,7 @@ export const DetailedStatus: React.FC<{
217218
blurhash={attachment.get('blurhash')}
218219
height={150}
219220
onToggleVisibility={onToggleMediaVisibility}
221+
matchedFilters={status.get('matched_media_filters')}
220222
/>
221223
);
222224
mediaIcons.push('music');
@@ -242,6 +244,7 @@ export const DetailedStatus: React.FC<{
242244
sensitive={status.get('sensitive')}
243245
visible={showMedia}
244246
onToggleVisibility={onToggleMediaVisibility}
247+
matchedFilters={status.get('matched_media_filters')}
245248
letterbox={letterboxMedia}
246249
fullwidth={fullwidthMedia}
247250
preventPlayback={!expanded}

‎app/javascript/flavours/glitch/features/video/index.jsx

+3-2
Original file line numberDiff line numberDiff line change
@@ -139,6 +139,7 @@ class Video extends PureComponent {
139139
muted: PropTypes.bool,
140140
componentIndex: PropTypes.number,
141141
autoFocus: PropTypes.bool,
142+
matchedFilters: PropTypes.arrayOf(PropTypes.string),
142143
};
143144

144145
static defaultProps = {
@@ -542,7 +543,7 @@ class Video extends PureComponent {
542543
}
543544

544545
render () {
545-
const { preview, src, inline, onOpenVideo, onCloseVideo, intl, alt, lang, letterbox, fullwidth, detailed, sensitive, editable, blurhash, autoFocus } = this.props;
546+
const { preview, src, inline, onOpenVideo, onCloseVideo, intl, alt, lang, letterbox, fullwidth, detailed, sensitive, editable, blurhash, autoFocus, matchedFilters } = this.props;
546547
const { currentTime, duration, volume, buffer, dragging, paused, fullscreen, hovered, revealed } = this.state;
547548
const progress = Math.min((currentTime / duration) * 100, 100);
548549
const muted = this.state.muted || volume === 0;
@@ -603,7 +604,7 @@ class Video extends PureComponent {
603604
style={{ ...playerStyle, width: '100%' }}
604605
/>}
605606

606-
<SpoilerButton hidden={revealed || editable} sensitive={sensitive} onClick={this.toggleReveal} />
607+
<SpoilerButton hidden={revealed || editable} sensitive={sensitive} onClick={this.toggleReveal} matchedFilters={matchedFilters} />
607608

608609
<div className={classNames('video-player__controls', { active: paused || hovered })}>
609610
<div className='video-player__seek' onMouseDown={this.handleMouseDown} ref={this.setSeekRef}>

‎app/javascript/flavours/glitch/selectors/index.js

+9-1
Original file line numberDiff line numberDiff line change
@@ -24,12 +24,19 @@ export const makeGetStatus = () => {
2424
}
2525

2626
let filtered = false;
27+
let mediaFiltered = false;
2728
if ((accountReblog || accountBase).get('id') !== me && filters) {
2829
let filterResults = statusReblog?.get('filtered') || statusBase.get('filtered') || ImmutableList();
2930
if (!warnInsteadOfHide && filterResults.some((result) => filters.getIn([result.get('filter'), 'filter_action']) === 'hide')) {
3031
return null;
3132
}
32-
filterResults = filterResults.filter(result => filters.has(result.get('filter')));
33+
34+
let mediaFilters = filterResults.filter(result => filters.getIn([result.get('filter'), 'filter_action']) === 'blur');
35+
if (!mediaFilters.isEmpty()) {
36+
mediaFiltered = mediaFilters.map(result => filters.getIn([result.get('filter'), 'title']));
37+
}
38+
39+
filterResults = filterResults.filter(result => filters.has(result.get('filter')) && filters.getIn([result.get('filter'), 'filter_action']) !== 'blur');
3340
if (!filterResults.isEmpty()) {
3441
filtered = filterResults.map(result => filters.getIn([result.get('filter'), 'title']));
3542
}
@@ -46,6 +53,7 @@ export const makeGetStatus = () => {
4653
map.set('reblog', statusReblog);
4754
map.set('account', accountBase);
4855
map.set('matched_filters', filtered);
56+
map.set('matched_media_filters', mediaFiltered);
4957
});
5058
},
5159
);

‎app/javascript/mastodon/components/media_gallery.jsx

+3-2
Original file line numberDiff line numberDiff line change
@@ -226,6 +226,7 @@ class MediaGallery extends PureComponent {
226226
visible: PropTypes.bool,
227227
autoplay: PropTypes.bool,
228228
onToggleVisibility: PropTypes.func,
229+
matchedFilters: PropTypes.arrayOf(PropTypes.string),
229230
};
230231

231232
state = {
@@ -296,7 +297,7 @@ class MediaGallery extends PureComponent {
296297
}
297298

298299
render () {
299-
const { media, lang, sensitive, defaultWidth, autoplay } = this.props;
300+
const { media, lang, sensitive, defaultWidth, autoplay, matchedFilters } = this.props;
300301
const { visible } = this.state;
301302
const width = this.state.width || defaultWidth;
302303

@@ -323,7 +324,7 @@ class MediaGallery extends PureComponent {
323324
<div className={`media-gallery media-gallery--layout-${size}`} style={style} ref={this.handleRef}>
324325
{children}
325326

326-
{(!visible || uncached) && <SpoilerButton uncached={uncached} sensitive={sensitive} onClick={this.handleOpen} />}
327+
{(!visible || uncached) && <SpoilerButton uncached={uncached} sensitive={sensitive} onClick={this.handleOpen} matchedFilters={matchedFilters} />}
327328

328329
{(visible && !uncached) && (
329330
<div className='media-gallery__actions'>

‎app/javascript/mastodon/components/spoiler_button.tsx

+16
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,15 @@ interface Props {
66
hidden?: boolean;
77
sensitive: boolean;
88
uncached?: boolean;
9+
matchedFilters?: string[];
910
onClick: React.MouseEventHandler<HTMLButtonElement>;
1011
}
1112

1213
export const SpoilerButton: React.FC<Props> = ({
1314
hidden = false,
1415
sensitive,
1516
uncached = false,
17+
matchedFilters,
1618
onClick,
1719
}) => {
1820
let warning;
@@ -28,6 +30,20 @@ export const SpoilerButton: React.FC<Props> = ({
2830
action = (
2931
<FormattedMessage id='status.media.open' defaultMessage='Click to open' />
3032
);
33+
} else if (matchedFilters) {
34+
warning = (
35+
<FormattedMessage
36+
id='filter_warning.matches_filter'
37+
defaultMessage='Matches filter “<span>{title}</span>”'
38+
values={{
39+
title: matchedFilters.join(', '),
40+
span: (chunks) => <span className='filter-name'>{chunks}</span>,
41+
}}
42+
/>
43+
);
44+
action = (
45+
<FormattedMessage id='status.media.show' defaultMessage='Click to show' />
46+
);
3147
} else if (sensitive) {
3248
warning = (
3349
<FormattedMessage

‎app/javascript/mastodon/components/status.jsx

+4-1
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ export const defaultMediaVisibility = (status) => {
7070
status = status.get('reblog');
7171
}
7272

73-
return (displayMedia !== 'hide_all' && !status.get('sensitive') || displayMedia === 'show_all');
73+
return !status.get('matched_media_filters') && (displayMedia !== 'hide_all' && !status.get('sensitive') || displayMedia === 'show_all');
7474
};
7575

7676
const messages = defineMessages({
@@ -470,6 +470,7 @@ class Status extends ImmutablePureComponent {
470470
defaultWidth={this.props.cachedMediaWidth}
471471
visible={this.state.showMedia}
472472
onToggleVisibility={this.handleToggleMediaVisibility}
473+
matchedFilters={status.get('matched_media_filters')}
473474
/>
474475
)}
475476
</Bundle>
@@ -498,6 +499,7 @@ class Status extends ImmutablePureComponent {
498499
blurhash={attachment.get('blurhash')}
499500
visible={this.state.showMedia}
500501
onToggleVisibility={this.handleToggleMediaVisibility}
502+
matchedFilters={status.get('matched_media_filters')}
501503
/>
502504
)}
503505
</Bundle>
@@ -522,6 +524,7 @@ class Status extends ImmutablePureComponent {
522524
deployPictureInPicture={pictureInPicture.get('available') ? this.handleDeployPictureInPicture : undefined}
523525
visible={this.state.showMedia}
524526
onToggleVisibility={this.handleToggleMediaVisibility}
527+
matchedFilters={status.get('matched_media_filters')}
525528
/>
526529
)}
527530
</Bundle>

‎app/javascript/mastodon/features/audio/index.jsx

+3-2
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,7 @@ class Audio extends PureComponent {
6262
volume: PropTypes.number,
6363
muted: PropTypes.bool,
6464
deployPictureInPicture: PropTypes.func,
65+
matchedFilters: PropTypes.arrayOf(PropTypes.string),
6566
};
6667

6768
state = {
@@ -472,7 +473,7 @@ class Audio extends PureComponent {
472473
};
473474

474475
render () {
475-
const { src, intl, alt, lang, editable, autoPlay, sensitive, blurhash } = this.props;
476+
const { src, intl, alt, lang, editable, autoPlay, sensitive, blurhash, matchedFilters } = this.props;
476477
const { paused, volume, currentTime, duration, buffer, dragging, revealed } = this.state;
477478
const progress = Math.min((currentTime / duration) * 100, 100);
478479
const muted = this.state.muted || volume === 0;
@@ -514,7 +515,7 @@ class Audio extends PureComponent {
514515
lang={lang}
515516
/>
516517

517-
<SpoilerButton hidden={revealed || editable} sensitive={sensitive} onClick={this.toggleReveal} />
518+
<SpoilerButton hidden={revealed || editable} sensitive={sensitive} onClick={this.toggleReveal} matchedFilters={matchedFilters} />
518519

519520
{(revealed || editable) && <img
520521
src={this.props.poster}

‎app/javascript/mastodon/features/status/components/detailed_status.tsx

+3
Original file line numberDiff line numberDiff line change
@@ -175,6 +175,7 @@ export const DetailedStatus: React.FC<{
175175
onOpenMedia={onOpenMedia}
176176
visible={showMedia}
177177
onToggleVisibility={onToggleMediaVisibility}
178+
matchedFilters={status.get('matched_media_filters')}
178179
/>
179180
);
180181
} else if (status.getIn(['media_attachments', 0, 'type']) === 'audio') {
@@ -201,6 +202,7 @@ export const DetailedStatus: React.FC<{
201202
blurhash={attachment.get('blurhash')}
202203
height={150}
203204
onToggleVisibility={onToggleMediaVisibility}
205+
matchedFilters={status.get('matched_media_filters')}
204206
/>
205207
);
206208
} else if (status.getIn(['media_attachments', 0, 'type']) === 'video') {
@@ -224,6 +226,7 @@ export const DetailedStatus: React.FC<{
224226
sensitive={status.get('sensitive')}
225227
visible={showMedia}
226228
onToggleVisibility={onToggleMediaVisibility}
229+
matchedFilters={status.get('matched_media_filters')}
227230
/>
228231
);
229232
}

‎app/javascript/mastodon/features/video/index.jsx

+3-2
Original file line numberDiff line numberDiff line change
@@ -136,6 +136,7 @@ class Video extends PureComponent {
136136
muted: PropTypes.bool,
137137
componentIndex: PropTypes.number,
138138
autoFocus: PropTypes.bool,
139+
matchedFilters: PropTypes.arrayOf(PropTypes.string),
139140
};
140141

141142
static defaultProps = {
@@ -535,7 +536,7 @@ class Video extends PureComponent {
535536
}
536537

537538
render () {
538-
const { preview, src, aspectRatio, onOpenVideo, onCloseVideo, intl, alt, lang, detailed, sensitive, editable, blurhash, autoFocus } = this.props;
539+
const { preview, src, aspectRatio, onOpenVideo, onCloseVideo, intl, alt, lang, detailed, sensitive, editable, blurhash, autoFocus, matchedFilters } = this.props;
539540
const { currentTime, duration, volume, buffer, dragging, paused, fullscreen, hovered, revealed } = this.state;
540541
const progress = Math.min((currentTime / duration) * 100, 100);
541542
const muted = this.state.muted || volume === 0;
@@ -592,7 +593,7 @@ class Video extends PureComponent {
592593
style={{ width: '100%' }}
593594
/>}
594595

595-
<SpoilerButton hidden={revealed || editable} sensitive={sensitive} onClick={this.toggleReveal} />
596+
<SpoilerButton hidden={revealed || editable} sensitive={sensitive} onClick={this.toggleReveal} matchedFilters={matchedFilters} />
596597

597598
<div className={classNames('video-player__controls', { active: paused || hovered })}>
598599
<div className='video-player__seek' onMouseDown={this.handleMouseDown} ref={this.setSeekRef}>

0 commit comments

Comments
 (0)