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

feat: Use plus/minus expand button in title for showing body/preview

Browse source
This commit is contained in:
Jay Sitter 2023-06-25 18:43:13 -04:00
parent 6773fe83d8
commit 077603b43e
1 changed files with 24 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -497,6 +497,25 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
/>
</button>
))}
{/**
* If there is a URL, or if the post has a body and we were told not to
* show the body, show the MetadataCard/body toggle.
*/}
{(post.url || (post.body && !this.props.showBody)) && (
<button
className="btn btn-sm btn-link link-dark link-opacity-75 link-opacity-100-hover py-0 align-baseline"
data-tippy-content={post.body && mdNoImages.render(post.body)}
data-tippy-allowHtml={true}
onClick={linkEvent(this, this.handleShowBody)}
>
<Icon
icon={!this.state.showBody ? "plus-square" : "minus-square"}
classes="icon-inline"
/>
</button>
)}
{post.removed && (
<small className="ms-2 badge text-bg-secondary">
{I18NextService.i18n.t("removed")}
@ -634,27 +653,6 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
);
}
showPreviewButton() {
const post_view = this.postView;
const body = post_view.post.body;
return (
<button
className="btn btn-sm btn-animate text-muted py-0"
data-tippy-content={body && mdNoImages.render(body)}
data-tippy-allowHtml={true}
onClick={linkEvent(this, this.handleShowBody)}
>
<Icon
icon="book-open"
classes={classNames("icon-inline me-1", {
"text-success": this.state.showBody,
})}
/>
</button>
);
}
postActions() {
// Possible enhancement: Priority+ pattern instead of just hard coding which get hidden behind the show more button.
// Possible enhancement: Make each button a component.
@ -666,14 +664,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
{this.saveButton}
{this.crossPostButton}
{/**
* If there is a URL, or if the post has a body and we were told not to
* show the body, show the MetadataCard/body toggle.
*/}
{(post.url || (post.body && !this.props.showBody)) &&
this.showPreviewButton()}
{this.showBody && post_view.post.body && this.viewSourceButton}
{this.props.showBody && post_view.post.body && this.viewSourceButton}
<div className="dropdown">
<button
@ -1764,6 +1755,10 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
setupTippy();
}
// handleShowPreview(i: PostListing) {
// return null;
// }
get pointsTippy(): string {
const points = I18NextService.i18n.t("number_of_points", {
count: Number(this.postView.counts.score),