-import { getRoleLabelPill, myAuthRequired } from "@utils/app";
+import { myAuthRequired } from "@utils/app";
import { canShare, share } from "@utils/browser";
import { getExternalHost, getHttpBase } from "@utils/env";
import {
import { Icon, PurgeWarning, Spinner } from "../common/icon";
import { MomentTime } from "../common/moment-time";
import { PictrsImage } from "../common/pictrs-image";
+import { UserBadges } from "../common/user-badges";
import { VoteButtons, VoteButtonsCompact } from "../common/vote-buttons";
import { CommunityLink } from "../community/community-link";
import { PersonListing } from "../person/person-listing";
return (
<button
type="button"
- className="d-inline-block position-relative mb-2 p-0 border-0"
+ className="thumbnail rounded overflow-hidden d-inline-block position-relative p-0 border-0 bg-transparent"
data-tippy-content={I18NextService.i18n.t("expand_here")}
onClick={linkEvent(this, this.handleImageExpandClick)}
aria-label={I18NextService.i18n.t("expand_here")}
} else if (!this.props.hideImage && url && thumbnail && this.imageSrc) {
return (
<a
- className="text-body d-inline-block position-relative mb-2"
+ className="thumbnail rounded overflow-hidden d-inline-block position-relative p-0 border-0"
href={url}
rel={relTags}
title={url}
createdLine() {
const post_view = this.postView;
+
return (
- <div className="small">
- <span className="me-1">
- <PersonListing person={post_view.creator} />
- </span>
- {this.creatorIsMod_ &&
- getRoleLabelPill({
- label: I18NextService.i18n.t("mod"),
- tooltip: I18NextService.i18n.t("mod"),
- classes: "text-bg-primary",
- })}
- {this.creatorIsAdmin_ &&
- getRoleLabelPill({
- label: I18NextService.i18n.t("admin"),
- tooltip: I18NextService.i18n.t("admin"),
- classes: "text-bg-danger",
- })}
- {post_view.creator.bot_account &&
- getRoleLabelPill({
- label: I18NextService.i18n.t("bot_account").toLowerCase(),
- tooltip: I18NextService.i18n.t("bot_account"),
- })}
+ <div className="small mb-1 mb-md-0">
+ <PersonListing person={post_view.creator} />
+ <UserBadges
+ classNames="ms-1"
+ isMod={this.creatorIsMod_}
+ isAdmin={this.creatorIsAdmin_}
+ isBot={post_view.creator.bot_account}
+ />
{this.props.showCommunity && (
<>
{" "}
return (
<>
- <div className="post-title overflow-hidden">
- <h5 className="d-inline">
+ <div className="post-title">
+ <h1 className="h5 d-inline text-break">
{url && this.props.showBody ? (
<a
className={
) : (
this.postLink
)}
- </h5>
+ </h1>
{/**
- * If there is a URL, an embed title, and we were not told to show the
- * body by the parent component, show the MetadataCard/body toggle.
+ * If there is (a) a URL and an embed title, or (b) a post body, and
+ * we were not told to show the body by the parent component, show the
+ * MetadataCard/body toggle.
*/}
{!this.props.showBody &&
- post.url &&
- post.embed_title &&
+ ((post.url && post.embed_title) || post.body) &&
this.showPreviewButton()}
{post.removed && (
)}
<div className="col flex-grow-1">
<div className="row">
- <div className="col-sm-3 col-lg-2 pe-0 post-media">
+ <div className="col flex-grow-0 px-0">
<div className="">{this.thumbnail()}</div>
</div>
- <div className="col-12 col-sm-9 col-lg-10">
+ <div className="col flex-grow-1">
{this.postTitleLine()}
{this.createdLine()}
{this.commentsLine()}
UserService.Instance.myUserInfo?.local_user_view.person.id
);
}
+
handleEditClick(i: PostListing) {
i.setState({ showEdit: true });
}
post_id: i.postView.post.id,
removed: !i.postView.post.removed,
auth: myAuthRequired(),
+ reason: i.state.removeReason,
});
}
handlePurgeSubmit(i: PostListing, event: any) {
event.preventDefault();
i.setState({ purgeLoading: true });
- if (i.state.purgeType == PurgeType.Person) {
+ if (i.state.purgeType === PurgeType.Person) {
i.props.onPurgePerson({
person_id: i.postView.creator.id,
reason: i.state.purgeReason,
auth: myAuthRequired(),
});
- } else if (i.state.purgeType == PurgeType.Post) {
+ } else if (i.state.purgeType === PurgeType.Post) {
i.props.onPurgePost({
post_id: i.postView.post.id,
reason: i.state.purgeReason,