import { setupTippy } from "../../tippy";
import { Icon, PurgeWarning, Spinner } from "../common/icon";
import { MomentTime } from "../common/moment-time";
+import { UserBadges } from "../common/user-badges";
import { VoteButtonsCompact } from "../common/vote-buttons";
import { CommunityLink } from "../community/community-link";
import { PersonListing } from "../person/person-listing";
return this.commentView.comment.id;
}
+ get hasBadges(): boolean {
+ const cv = this.commentView;
+
+ return (
+ this.isPostCreator ||
+ isMod(cv.creator.id, this.props.moderators) ||
+ isAdmin(cv.creator.id, this.props.admins) ||
+ cv.creator.bot_account
+ );
+ }
+
componentWillReceiveProps(
nextProps: Readonly<{ children?: InfernoNode } & CommentNodeProps>
): void {
classes="icon-inline"
/>
</button>
- <span className="me-2">
- <PersonListing person={cv.creator} />
- </span>
+
+ <PersonListing person={cv.creator} />
+
{cv.comment.distinguished && (
- <Icon icon="shield" inline classes="text-danger me-2" />
- )}
- {this.isPostCreator && (
- <div className="badge text-bg-light d-none d-sm-inline me-2">
- {I18NextService.i18n.t("creator")}
- </div>
- )}
- {isMod_ && (
- <div className="badge text-bg-light d-none d-sm-inline me-2">
- {I18NextService.i18n.t("mod")}
- </div>
- )}
- {isAdmin_ && (
- <div className="badge text-bg-light d-none d-sm-inline me-2">
- {I18NextService.i18n.t("admin")}
- </div>
- )}
- {cv.creator.bot_account && (
- <div className="badge text-bg-light d-none d-sm-inline me-2">
- {I18NextService.i18n.t("bot_account").toLowerCase()}
- </div>
+ <Icon icon="shield" inline classes="text-danger ms-1" />
)}
+
+ <UserBadges
+ classNames="ms-1"
+ isPostCreator={this.isPostCreator}
+ isMod={isMod_}
+ isAdmin={isAdmin_}
+ isBot={cv.creator.bot_account}
+ />
+
{this.props.showCommunity && (
<>
<span className="mx-1">{I18NextService.i18n.t("to")}</span>
</Link>
</>
)}
- {this.linkBtn(true)}
+
+ {this.getLinkButton(true)}
+
{cv.comment.language_id !== 0 && (
<span className="badge text-bg-light d-none d-sm-inline me-2">
{
/>
)}
<div className="d-flex justify-content-between justify-content-lg-start flex-wrap text-muted fw-bold">
- {this.props.showContext && this.linkBtn()}
+ {this.props.showContext && this.getLinkButton()}
{this.props.markable && (
<button
className="btn btn-link btn-animate text-muted"
}
}
- linkBtn(small = false) {
+ getLinkButton(small = false) {
const cv = this.commentView;
const classnames = classNames("btn btn-link btn-animate text-muted", {