LemmyNet/lemmy-ui
2
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-11-28 07:11:14 +00:00
Code Issues Projects Releases Wiki Activity

Fix fullsize post image (#2797)

Browse source 
* 0.19.6-beta.8

* 0.19.6-beta.9

* 0.19.6-beta.14

* Using full-size image column, not thumbnail.

- Fixes #2796
This commit is contained in:
Dessalines 2024-11-07 12:03:07 -05:00 committed by Dessalines
parent 624938fc29
commit b01a3cfaa3
1 changed files with 14 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

44
src/shared/components/post/post-listing.tsx
View file

@ -273,18 +273,22 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
}
get img() {
const { post } = this.postView;
if (this.isoData.showAdultConsentModal) {
return <></>;
}
if (this.imageSrc) {
// Use the full-size image for expands
const post = this.postView.post;
const url = post.url;
const thumbnail = post.thumbnail_url;
const imageSrc = url && isImage(url) ? url : thumbnail;
if (imageSrc) {
return (
<>
<div className="offset-sm-3 my-2 d-none d-sm-block">
<a href={this.imageSrc} className="d-inline-block">
<PictrsImage src={this.imageSrc} alt={post.alt_text} />
<a href={imageSrc} className="d-inline-block">
<PictrsImage src={imageSrc} alt={post.alt_text} />
</a>
</div>
<div className="my-2 d-block d-sm-none">
@ -293,7 +297,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
className="p-0 border-0 bg-transparent d-inline-block"
onClick={linkEvent(this, this.handleImageExpandClick)}
>
<PictrsImage src={this.imageSrc} alt={post.alt_text} />
<PictrsImage src={imageSrc} alt={post.alt_text} />
</button>
</div>
</>
@ -315,26 +319,12 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
);
}
get imageSrc(): string | undefined {
const post = this.postView.post;
const url = post.url;
const thumbnail = post.thumbnail_url;
if (thumbnail) {
return thumbnail;
} else if (url && isImage(url)) {
return url;
} else {
return undefined;
}
}
thumbnail() {
const post = this.postView.post;
const url = post.url;
const thumbnail = post.thumbnail_url;
if (!this.props.hideImage && url && isImage(url) && this.imageSrc) {
if (!this.props.hideImage && url && isImage(url) && thumbnail) {
return (
<button
type="button"
@ -343,20 +333,14 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
onClick={linkEvent(this, this.handleImageExpandClick)}
aria-label={I18NextService.i18n.t("expand_here")}
>
{this.imgThumb(this.imageSrc)}
{this.imgThumb(thumbnail)}
<Icon
icon="image"
classes="d-block text-white position-absolute end-0 top-0 mini-overlay text-opacity-75 text-opacity-100-hover"
/>
</button>
);
} else if (
!this.props.hideImage &&
url &&
thumbnail &&
this.imageSrc &&
!isVideo(url)
) {
} else if (!this.props.hideImage && url && thumbnail && !isVideo(url)) {
return (
<a
className="thumbnail rounded overflow-hidden d-inline-block position-relative p-0 border-0"
@ -365,7 +349,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
title={url}
target={this.linkTarget}
>
{this.imgThumb(this.imageSrc)}
{this.imgThumb(thumbnail)}
<Icon
icon="external-link"
classes="d-block text-white position-absolute end-0 top-0 mini-overlay text-opacity-75 text-opacity-100-hover"