mirror of
https://git.kescher.at/CatCatNya/catstodon.git
synced 2024-11-27 23:01:36 +01:00
[Glitch] Add "not available" label on unknown media attachments
Port d344289431
to glitch-soc
Signed-off-by: Thibaut Girka <thib@sitedethib.com>
This commit is contained in:
parent
5088eb8388
commit
23c513846a
2 changed files with 19 additions and 4 deletions
|
@ -329,7 +329,8 @@ export default class MediaGallery extends React.PureComponent {
|
|||
render () {
|
||||
const { media, intl, sensitive, letterbox, fullwidth, defaultWidth } = this.props;
|
||||
const { visible } = this.state;
|
||||
const size = media.take(4).size;
|
||||
const size = media.take(4).size;
|
||||
const uncached = media.every(attachment => attachment.get('type') === 'unknown');
|
||||
|
||||
const width = this.state.width || defaultWidth;
|
||||
|
||||
|
@ -350,10 +351,16 @@ export default class MediaGallery extends React.PureComponent {
|
|||
if (this.isStandaloneEligible()) {
|
||||
children = <Item standalone onClick={this.handleClick} attachment={media.get(0)} displayWidth={width} visible={visible} />;
|
||||
} else {
|
||||
children = media.take(4).map((attachment, i) => <Item key={attachment.get('id')} onClick={this.handleClick} attachment={attachment} index={i} size={size} letterbox={letterbox} displayWidth={width} visible={visible} />);
|
||||
children = media.take(4).map((attachment, i) => <Item key={attachment.get('id')} onClick={this.handleClick} attachment={attachment} index={i} size={size} letterbox={letterbox} displayWidth={width} visible={visible || uncached} />);
|
||||
}
|
||||
|
||||
if (visible) {
|
||||
if (uncached) {
|
||||
spoilerButton = (
|
||||
<button type='button' disabled className='spoiler-button__overlay'>
|
||||
<span className='spoiler-button__overlay__label'><FormattedMessage id='status.uncached_media_warning' defaultMessage='Not available' /></span>
|
||||
</button>
|
||||
);
|
||||
} else if (visible) {
|
||||
spoilerButton = <IconButton title={intl.formatMessage(messages.toggle_visible)} icon='eye-slash' overlay onClick={this.handleOpen} />;
|
||||
} else {
|
||||
spoilerButton = (
|
||||
|
@ -365,7 +372,7 @@ export default class MediaGallery extends React.PureComponent {
|
|||
|
||||
return (
|
||||
<div className={computedClass} style={style} ref={this.handleRef}>
|
||||
<div className={classNames('spoiler-button', { 'spoiler-button--minified': visible })}>
|
||||
<div className={classNames('spoiler-button', { 'spoiler-button--minified': visible && !uncached })}>
|
||||
{spoilerButton}
|
||||
{visible && sensitive && (
|
||||
<span className='sensitive-marker'>
|
||||
|
|
|
@ -1267,6 +1267,14 @@
|
|||
background: rgba($base-overlay-background, 0.8);
|
||||
}
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
cursor: not-allowed;
|
||||
|
||||
.spoiler-button__overlay__label {
|
||||
background: rgba($base-overlay-background, 0.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue