Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix: Add user action buttons to post dropdown #1653 #1655

Merged
merged 14 commits into from
Jun 29, 2023
Merged

fix: Add user action buttons to post dropdown #1653 #1655

Changes from 10 commits
Commits
Show all changes
14 commits
Select commit Hold shift + click to select a range
911477d
fix: Add user action buttons to post dropdown #1653
jsit Jun 27, 2023
3476f39
Merge branch 'main' into fix/put-user-action-buttons-in-dropdown-1653
alectrocute Jun 27, 2023
9830682
fix: Fix alignment of preview mini-overlay buttons on thumbs
jsit Jun 27, 2023
014d380
fix: Restore mdNoImages import
jsit Jun 27, 2023
fa887c0
fix: Change style and capitalization of post user action buttons
jsit Jun 27, 2023
90baf69
fix: Move Trasnfer Community button to dropdown
jsit Jun 27, 2023
c0d75d6
fix: Remove some changes that shouldn't have been in here
jsit Jun 27, 2023
9e961d8
chore: Empty commit to re-trigger Woodpecker
jsit Jun 28, 2023
a87f27d
Merge branch 'main' into fix/put-user-action-buttons-in-dropdown-1653
jsit Jun 28, 2023
9837f1c
Merge branch 'main' into fix/put-user-action-buttons-in-dropdown-1653
dessalines Jun 28, 2023
0ee2958
fix: Remove some unnecessary aria-labels
jsit Jun 28, 2023
3507805
fix: Capitalize first letter on transfer community button
jsit Jun 28, 2023
393120f
Merge branch 'main' into fix/put-user-action-buttons-in-dropdown-1653
jsit Jun 29, 2023
bc57f6a
chore: Empty commit to re-trigger Woodpecker
jsit Jun 29, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
224 changes: 113 additions & 111 deletions src/shared/components/post/post-listing.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -702,6 +702,50 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
{(this.canMod_ || this.canAdmin_) && (
<li>{this.modRemoveButton}</li>
)}

{this.canMod_ && (
<>
<li>
<hr className="dropdown-divider" />
</li>
{!this.creatorIsMod_ &&
(!post_view.creator_banned_from_community ? (
<li>{this.modBanFromCommunityButton}</li>
) : (
<li>{this.modUnbanFromCommunityButton}</li>
))}
{!post_view.creator_banned_from_community && (
<li>{this.addModToCommunityButton}</li>
)}
</>
)}

{(amCommunityCreator(post_view.creator.id, this.props.moderators) ||
this.canAdmin_) &&
this.creatorIsMod_ && <li>{this.transferCommunityButton}</li>}

{/* Admins can ban from all, and appoint other admins */}
{this.canAdmin_ && (
<>
<li>
<hr className="dropdown-divider" />
</li>
{!this.creatorIsAdmin_ && (
<>
{!isBanned(post_view.creator) ? (
<li>{this.modBanButton}</li>
) : (
<li>{this.modUnbanButton}</li>
)}
<li>{this.purgePersonButton}</li>
<li>{this.purgePostButton}</li>
</>
)}
{!isBanned(post_view.creator) && post_view.creator.local && (
<li>{this.toggleAdminButton}</li>
)}
</>
)}
</ul>
</div>
</>
Expand Down Expand Up @@ -969,7 +1013,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
get modBanFromCommunityButton() {
return (
<button
className="btn btn-link btn-animate text-muted py-0"
className="btn btn-link btn-sm d-flex align-items-center rounded-0 dropdown-item"
onClick={linkEvent(this, this.handleModBanFromCommunityShow)}
aria-label={I18NextService.i18n.t("ban_from_community")}
>
Expand All @@ -981,7 +1025,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
get modUnbanFromCommunityButton() {
return (
<button
className="btn btn-link btn-animate text-muted py-0"
className="btn btn-link btn-sm d-flex align-items-center rounded-0 dropdown-item"
onClick={linkEvent(this, this.handleModBanFromCommunitySubmit)}
aria-label={I18NextService.i18n.t("unban")}
>
Expand All @@ -993,20 +1037,20 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
get addModToCommunityButton() {
return (
<button
className="btn btn-link btn-animate text-muted py-0"
className="btn btn-link btn-sm d-flex align-items-center rounded-0 dropdown-item"
onClick={linkEvent(this, this.handleAddModToCommunity)}
aria-label={
this.creatorIsMod_
? I18NextService.i18n.t("remove_as_mod")
: I18NextService.i18n.t("appoint_as_mod")
? capitalizeFirstLetter(I18NextService.i18n.t("remove_as_mod"))
: capitalizeFirstLetter(I18NextService.i18n.t("appoint_as_mod"))
}
>
{this.state.addModLoading ? (
<Spinner />
) : this.creatorIsMod_ ? (
I18NextService.i18n.t("remove_as_mod")
capitalizeFirstLetter(I18NextService.i18n.t("remove_as_mod"))
) : (
I18NextService.i18n.t("appoint_as_mod")
capitalizeFirstLetter(I18NextService.i18n.t("appoint_as_mod"))
)}
</button>
);
Expand All @@ -1015,26 +1059,28 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
get modBanButton() {
return (
<button
className="btn btn-link btn-animate text-muted py-0"
className="btn btn-link btn-sm d-flex align-items-center rounded-0 dropdown-item"
onClick={linkEvent(this, this.handleModBanShow)}
aria-label={I18NextService.i18n.t("ban_from_site")}
>
{I18NextService.i18n.t("ban_from_site")}
{capitalizeFirstLetter(I18NextService.i18n.t("ban_from_site"))}
</button>
);
}

get modUnbanButton() {
return (
<button
className="btn btn-link btn-animate text-muted py-0"
className="btn btn-link btn-sm d-flex align-items-center rounded-0 dropdown-item"
onClick={linkEvent(this, this.handleModBanSubmit)}
aria-label={I18NextService.i18n.t("unban_from_site")}
aria-label={capitalizeFirstLetter(
I18NextService.i18n.t("unban_from_site")
)}
>
{this.state.banLoading ? (
<Spinner />
) : (
I18NextService.i18n.t("unban_from_site")
capitalizeFirstLetter(I18NextService.i18n.t("unban_from_site"))
)}
</button>
);
Expand All @@ -1043,44 +1089,56 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
get purgePersonButton() {
return (
<button
className="btn btn-link btn-animate text-muted py-0"
className="btn btn-link btn-sm d-flex align-items-center rounded-0 dropdown-item"
onClick={linkEvent(this, this.handlePurgePersonShow)}
aria-label={I18NextService.i18n.t("purge_user")}
>
{I18NextService.i18n.t("purge_user")}
{capitalizeFirstLetter(I18NextService.i18n.t("purge_user"))}
</button>
);
}

get purgePostButton() {
return (
<button
className="btn btn-link btn-animate text-muted py-0"
className="btn btn-link btn-sm d-flex align-items-center rounded-0 dropdown-item"
onClick={linkEvent(this, this.handlePurgePostShow)}
aria-label={I18NextService.i18n.t("purge_post")}
>
{I18NextService.i18n.t("purge_post")}
{capitalizeFirstLetter(I18NextService.i18n.t("purge_post"))}
</button>
);
}

get toggleAdminButton() {
return (
<button
className="btn btn-link btn-animate text-muted py-0"
className="btn btn-link btn-sm d-flex align-items-center rounded-0 dropdown-item"
onClick={linkEvent(this, this.handleAddAdmin)}
>
{this.state.addAdminLoading ? (
<Spinner />
) : this.creatorIsAdmin_ ? (
I18NextService.i18n.t("remove_as_admin")
capitalizeFirstLetter(I18NextService.i18n.t("remove_as_admin"))
) : (
I18NextService.i18n.t("appoint_as_admin")
capitalizeFirstLetter(I18NextService.i18n.t("appoint_as_admin"))
)}
</button>
);
}

get transferCommunityButton() {
return (
<button
className="btn btn-link btn-sm d-flex align-items-center rounded-0 dropdown-item"
onClick={linkEvent(this, this.handleShowConfirmTransferCommunity)}
aria-label={I18NextService.i18n.t("transfer_community")}
>
{I18NextService.i18n.t("transfer_community")}
</button>
);
}

get modRemoveButton() {
const removed = this.postView.post.removed;
return (
Expand All @@ -1095,102 +1153,17 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
{this.state.removeLoading ? (
<Spinner />
) : !removed ? (
I18NextService.i18n.t("remove")
capitalizeFirstLetter(I18NextService.i18n.t("remove_post"))
) : (
I18NextService.i18n.t("restore")
<>
{capitalizeFirstLetter(I18NextService.i18n.t("restore"))}{" "}
{I18NextService.i18n.t("post")}
</>
)}
</button>
);
}

/**
* Mod/Admin actions to be taken against the author.
*/
userActionsLine() {
// TODO: make nicer
const post_view = this.postView;
return (
this.state.showAdvanced && (
<div className="mt-3">
{this.canMod_ && (
<>
{!this.creatorIsMod_ &&
(!post_view.creator_banned_from_community
? this.modBanFromCommunityButton
: this.modUnbanFromCommunityButton)}
{!post_view.creator_banned_from_community &&
this.addModToCommunityButton}
</>
)}

{/* Community creators and admins can transfer community to another mod */}
{(amCommunityCreator(post_view.creator.id, this.props.moderators) ||
this.canAdmin_) &&
this.creatorIsMod_ &&
(!this.state.showConfirmTransferCommunity ? (
<button
className="btn btn-link btn-animate text-muted py-0"
onClick={linkEvent(
this,
this.handleShowConfirmTransferCommunity
)}
aria-label={I18NextService.i18n.t("transfer_community")}
>
{I18NextService.i18n.t("transfer_community")}
</button>
) : (
<>
<button
className="d-inline-block me-1 btn btn-link btn-animate text-muted py-0"
aria-label={I18NextService.i18n.t("are_you_sure")}
>
{I18NextService.i18n.t("are_you_sure")}
</button>
<button
className="btn btn-link btn-animate text-muted py-0 d-inline-block me-1"
aria-label={I18NextService.i18n.t("yes")}
onClick={linkEvent(this, this.handleTransferCommunity)}
>
{this.state.transferLoading ? (
<Spinner />
) : (
I18NextService.i18n.t("yes")
)}
</button>
<button
className="btn btn-link btn-animate text-muted py-0 d-inline-block"
onClick={linkEvent(
this,
this.handleCancelShowConfirmTransferCommunity
)}
aria-label={I18NextService.i18n.t("no")}
>
{I18NextService.i18n.t("no")}
</button>
</>
))}
{/* Admins can ban from all, and appoint other admins */}
{this.canAdmin_ && (
<>
{!this.creatorIsAdmin_ && (
<>
{!isBanned(post_view.creator)
? this.modBanButton
: this.modUnbanButton}
{this.purgePersonButton}
{this.purgePostButton}
</>
)}
{!isBanned(post_view.creator) &&
post_view.creator.local &&
this.toggleAdminButton}
</>
)}
</div>
)
);
}

removeAndBanDialogs() {
const post = this.postView;
const purgeTypeText =
Expand Down Expand Up @@ -1231,6 +1204,37 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
</button>
</form>
)}
{this.state.showConfirmTransferCommunity && (
<>
<button
className="d-inline-block me-1 btn btn-link btn-animate text-muted py-0"
aria-label={I18NextService.i18n.t("are_you_sure")}
>
{I18NextService.i18n.t("are_you_sure")}
</button>
<button
className="btn btn-link btn-animate text-muted py-0 d-inline-block me-1"
aria-label={I18NextService.i18n.t("yes")}
onClick={linkEvent(this, this.handleTransferCommunity)}
>
{this.state.transferLoading ? (
<Spinner />
) : (
I18NextService.i18n.t("yes")
)}
</button>
<button
className="btn btn-link btn-animate text-muted py-0 d-inline-block"
onClick={linkEvent(
this,
this.handleCancelShowConfirmTransferCommunity
)}
aria-label={I18NextService.i18n.t("no")}
>
{I18NextService.i18n.t("no")}
</button>
</>
)}
{this.state.showBanDialog && (
<form onSubmit={linkEvent(this, this.handleModBanBothSubmit)}>
<div className="mb-3 row col-12">
Expand Down Expand Up @@ -1409,7 +1413,6 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
{this.mobileThumbnail()}

{this.commentsLine(true)}
{this.userActionsLine()}
{this.duplicatesLine()}
{this.removeAndBanDialogs()}
</div>
Expand Down Expand Up @@ -1441,7 +1444,6 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
{this.createdLine()}
{this.commentsLine()}
{this.duplicatesLine()}
{this.userActionsLine()}
{this.removeAndBanDialogs()}
</div>
</div>
Expand Down