Adding more for advanced actions on comments and posts.

- Fixes #561
This commit is contained in:
Dessalines 2020-02-29 22:06:42 -05:00
parent 93cb0892ae
commit 399be2370d
3 changed files with 452 additions and 386 deletions

View file

@ -48,6 +48,7 @@ interface CommentNodeState {
showConfirmAppointAsAdmin: boolean; showConfirmAppointAsAdmin: boolean;
collapsed: boolean; collapsed: boolean;
viewSource: boolean; viewSource: boolean;
showAdvanced: boolean;
my_vote: number; my_vote: number;
score: number; score: number;
upvotes: number; upvotes: number;
@ -81,6 +82,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
banType: BanType.Community, banType: BanType.Community,
collapsed: false, collapsed: false,
viewSource: false, viewSource: false,
showAdvanced: false,
showConfirmTransferSite: false, showConfirmTransferSite: false,
showConfirmTransferCommunity: false, showConfirmTransferCommunity: false,
showConfirmAppointAsMod: false, showConfirmAppointAsMod: false,
@ -300,93 +302,259 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
</Link> </Link>
</li> </li>
)} )}
<li className="list-inline-item"></li> {!this.state.showAdvanced ? (
<li className="list-inline-item"> <li className="list-inline-item">
<span <span
className="pointer" className="pointer"
onClick={linkEvent(this, this.handleViewSource)} onClick={linkEvent(this, this.handleShowAdvanced)}
> >
{i18n.t('view_source')} {i18n.t('more')}
</span> </span>
</li> </li>
<li className="list-inline-item"> ) : (
<Link
className="text-muted"
to={`/post/${node.comment.post_id}/comment/${node.comment.id}`}
>
{i18n.t('link')}
</Link>
</li>
{/* Admins and mods can remove comments */}
{(this.canMod || this.canAdmin) && (
<> <>
<li className="list-inline-item"></li> <li className="list-inline-item"></li>
<li className="list-inline-item"> <li className="list-inline-item">
{!node.comment.removed ? ( <span
<span className="pointer"
class="pointer" onClick={linkEvent(this, this.handleViewSource)}
onClick={linkEvent( >
this, {i18n.t('view_source')}
this.handleModRemoveShow </span>
)}
>
{i18n.t('remove')}
</span>
) : (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleModRemoveSubmit
)}
>
{i18n.t('restore')}
</span>
)}
</li> </li>
</> <li className="list-inline-item">
)} <Link
{/* Mods can ban from community, and appoint as mods to community */} className="text-muted"
{this.canMod && ( to={`/post/${node.comment.post_id}/comment/${node.comment.id}`}
<> >
{!this.isMod && ( {i18n.t('link')}
<li className="list-inline-item"> </Link>
{!node.comment.banned_from_community ? ( </li>
<span {/* Admins and mods can remove comments */}
class="pointer" {(this.canMod || this.canAdmin) && (
onClick={linkEvent( <>
this, <li className="list-inline-item"></li>
this.handleModBanFromCommunityShow <li className="list-inline-item">
)} {!node.comment.removed ? (
> <span
{i18n.t('ban')} class="pointer"
</span> onClick={linkEvent(
) : ( this,
<span this.handleModRemoveShow
class="pointer" )}
onClick={linkEvent( >
this, {i18n.t('remove')}
this.handleModBanFromCommunitySubmit </span>
)} ) : (
> <span
{i18n.t('unban')} class="pointer"
</span> onClick={linkEvent(
)} this,
</li> this.handleModRemoveSubmit
)}
>
{i18n.t('restore')}
</span>
)}
</li>
</>
)} )}
{!node.comment.banned_from_community && ( {/* Mods can ban from community, and appoint as mods to community */}
{this.canMod && (
<>
{!this.isMod && (
<li className="list-inline-item">
{!node.comment.banned_from_community ? (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleModBanFromCommunityShow
)}
>
{i18n.t('ban')}
</span>
) : (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleModBanFromCommunitySubmit
)}
>
{i18n.t('unban')}
</span>
)}
</li>
)}
{!node.comment.banned_from_community && (
<li className="list-inline-item">
{!this.state.showConfirmAppointAsMod ? (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleShowConfirmAppointAsMod
)}
>
{this.isMod
? i18n.t('remove_as_mod')
: i18n.t('appoint_as_mod')}
</span>
) : (
<>
<span class="d-inline-block mr-1">
{i18n.t('are_you_sure')}
</span>
<span
class="pointer d-inline-block mr-1"
onClick={linkEvent(
this,
this.handleAddModToCommunity
)}
>
{i18n.t('yes')}
</span>
<span
class="pointer d-inline-block"
onClick={linkEvent(
this,
this.handleCancelConfirmAppointAsMod
)}
>
{i18n.t('no')}
</span>
</>
)}
</li>
)}
</>
)}
{/* Community creators and admins can transfer community to another mod */}
{(this.amCommunityCreator || this.canAdmin) &&
this.isMod && (
<li className="list-inline-item">
{!this.state.showConfirmTransferCommunity ? (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleShowConfirmTransferCommunity
)}
>
{i18n.t('transfer_community')}
</span>
) : (
<>
<span class="d-inline-block mr-1">
{i18n.t('are_you_sure')}
</span>
<span
class="pointer d-inline-block mr-1"
onClick={linkEvent(
this,
this.handleTransferCommunity
)}
>
{i18n.t('yes')}
</span>
<span
class="pointer d-inline-block"
onClick={linkEvent(
this,
this
.handleCancelShowConfirmTransferCommunity
)}
>
{i18n.t('no')}
</span>
</>
)}
</li>
)}
{/* Admins can ban from all, and appoint other admins */}
{this.canAdmin && (
<>
{!this.isAdmin && (
<li className="list-inline-item">
{!node.comment.banned ? (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleModBanShow
)}
>
{i18n.t('ban_from_site')}
</span>
) : (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleModBanSubmit
)}
>
{i18n.t('unban_from_site')}
</span>
)}
</li>
)}
{!node.comment.banned && (
<li className="list-inline-item">
{!this.state.showConfirmAppointAsAdmin ? (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleShowConfirmAppointAsAdmin
)}
>
{this.isAdmin
? i18n.t('remove_as_admin')
: i18n.t('appoint_as_admin')}
</span>
) : (
<>
<span class="d-inline-block mr-1">
{i18n.t('are_you_sure')}
</span>
<span
class="pointer d-inline-block mr-1"
onClick={linkEvent(
this,
this.handleAddAdmin
)}
>
{i18n.t('yes')}
</span>
<span
class="pointer d-inline-block"
onClick={linkEvent(
this,
this.handleCancelConfirmAppointAsAdmin
)}
>
{i18n.t('no')}
</span>
</>
)}
</li>
)}
</>
)}
{/* Site Creator can transfer to another admin */}
{this.amSiteCreator && this.isAdmin && (
<li className="list-inline-item"> <li className="list-inline-item">
{!this.state.showConfirmAppointAsMod ? ( {!this.state.showConfirmTransferSite ? (
<span <span
class="pointer" class="pointer"
onClick={linkEvent( onClick={linkEvent(
this, this,
this.handleShowConfirmAppointAsMod this.handleShowConfirmTransferSite
)} )}
> >
{this.isMod {i18n.t('transfer_site')}
? i18n.t('remove_as_mod')
: i18n.t('appoint_as_mod')}
</span> </span>
) : ( ) : (
<> <>
@ -397,7 +565,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
class="pointer d-inline-block mr-1" class="pointer d-inline-block mr-1"
onClick={linkEvent( onClick={linkEvent(
this, this,
this.handleAddModToCommunity this.handleTransferSite
)} )}
> >
{i18n.t('yes')} {i18n.t('yes')}
@ -406,7 +574,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
class="pointer d-inline-block" class="pointer d-inline-block"
onClick={linkEvent( onClick={linkEvent(
this, this,
this.handleCancelConfirmAppointAsMod this.handleCancelShowConfirmTransferSite
)} )}
> >
{i18n.t('no')} {i18n.t('no')}
@ -417,148 +585,6 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
)} )}
</> </>
)} )}
{/* Community creators and admins can transfer community to another mod */}
{(this.amCommunityCreator || this.canAdmin) && this.isMod && (
<li className="list-inline-item">
{!this.state.showConfirmTransferCommunity ? (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleShowConfirmTransferCommunity
)}
>
{i18n.t('transfer_community')}
</span>
) : (
<>
<span class="d-inline-block mr-1">
{i18n.t('are_you_sure')}
</span>
<span
class="pointer d-inline-block mr-1"
onClick={linkEvent(
this,
this.handleTransferCommunity
)}
>
{i18n.t('yes')}
</span>
<span
class="pointer d-inline-block"
onClick={linkEvent(
this,
this.handleCancelShowConfirmTransferCommunity
)}
>
{i18n.t('no')}
</span>
</>
)}
</li>
)}
{/* Admins can ban from all, and appoint other admins */}
{this.canAdmin && (
<>
{!this.isAdmin && (
<li className="list-inline-item">
{!node.comment.banned ? (
<span
class="pointer"
onClick={linkEvent(this, this.handleModBanShow)}
>
{i18n.t('ban_from_site')}
</span>
) : (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleModBanSubmit
)}
>
{i18n.t('unban_from_site')}
</span>
)}
</li>
)}
{!node.comment.banned && (
<li className="list-inline-item">
{!this.state.showConfirmAppointAsAdmin ? (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleShowConfirmAppointAsAdmin
)}
>
{this.isAdmin
? i18n.t('remove_as_admin')
: i18n.t('appoint_as_admin')}
</span>
) : (
<>
<span class="d-inline-block mr-1">
{i18n.t('are_you_sure')}
</span>
<span
class="pointer d-inline-block mr-1"
onClick={linkEvent(this, this.handleAddAdmin)}
>
{i18n.t('yes')}
</span>
<span
class="pointer d-inline-block"
onClick={linkEvent(
this,
this.handleCancelConfirmAppointAsAdmin
)}
>
{i18n.t('no')}
</span>
</>
)}
</li>
)}
</>
)}
{/* Site Creator can transfer to another admin */}
{this.amSiteCreator && this.isAdmin && (
<li className="list-inline-item">
{!this.state.showConfirmTransferSite ? (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleShowConfirmTransferSite
)}
>
{i18n.t('transfer_site')}
</span>
) : (
<>
<span class="d-inline-block mr-1">
{i18n.t('are_you_sure')}
</span>
<span
class="pointer d-inline-block mr-1"
onClick={linkEvent(this, this.handleTransferSite)}
>
{i18n.t('yes')}
</span>
<span
class="pointer d-inline-block"
onClick={linkEvent(
this,
this.handleCancelShowConfirmTransferSite
)}
>
{i18n.t('no')}
</span>
</>
)}
</li>
)}
</> </>
)} )}
</ul> </ul>
@ -1016,4 +1042,9 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
i.state.viewSource = !i.state.viewSource; i.state.viewSource = !i.state.viewSource;
i.setState(i.state); i.setState(i.state);
} }
handleShowAdvanced(i: CommentNode) {
i.state.showAdvanced = !i.state.showAdvanced;
i.setState(i.state);
}
} }

View file

@ -45,6 +45,7 @@ interface PostListingState {
showConfirmTransferCommunity: boolean; showConfirmTransferCommunity: boolean;
imageExpanded: boolean; imageExpanded: boolean;
viewSource: boolean; viewSource: boolean;
showAdvanced: boolean;
my_vote: number; my_vote: number;
score: number; score: number;
upvotes: number; upvotes: number;
@ -75,6 +76,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
showConfirmTransferCommunity: false, showConfirmTransferCommunity: false,
imageExpanded: false, imageExpanded: false,
viewSource: false, viewSource: false,
showAdvanced: false,
my_vote: this.props.post.my_vote, my_vote: this.props.post.my_vote,
score: this.props.post.score, score: this.props.post.score,
upvotes: this.props.post.upvotes, upvotes: this.props.post.upvotes,
@ -511,211 +513,238 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
</li> </li>
</> </>
)} )}
{this.canModOnSelf && (
<> {!this.state.showAdvanced && this.props.showBody ? (
<li className="list-inline-item">
<span
class="pointer"
onClick={linkEvent(this, this.handleModLock)}
>
{post.locked ? i18n.t('unlock') : i18n.t('lock')}
</span>
</li>
<li className="list-inline-item">
<span
class="pointer"
onClick={linkEvent(this, this.handleModSticky)}
>
{post.stickied
? i18n.t('unsticky')
: i18n.t('sticky')}
</span>
</li>
</>
)}
{/* Mods can ban from community, and appoint as mods to community */}
{(this.canMod || this.canAdmin) && (
<li className="list-inline-item"> <li className="list-inline-item">
{!post.removed ? ( <span
<span className="pointer"
class="pointer" onClick={linkEvent(this, this.handleShowAdvanced)}
onClick={linkEvent(this, this.handleModRemoveShow)} >
> {i18n.t('more')}
{i18n.t('remove')} </span>
</span>
) : (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleModRemoveSubmit
)}
>
{i18n.t('restore')}
</span>
)}
</li> </li>
)} ) : (
{this.canMod && (
<> <>
{!this.isMod && ( {this.canModOnSelf && (
<>
<li className="list-inline-item">
<span
class="pointer"
onClick={linkEvent(this, this.handleModLock)}
>
{post.locked
? i18n.t('unlock')
: i18n.t('lock')}
</span>
</li>
<li className="list-inline-item">
<span
class="pointer"
onClick={linkEvent(this, this.handleModSticky)}
>
{post.stickied
? i18n.t('unsticky')
: i18n.t('sticky')}
</span>
</li>
</>
)}
{/* Mods can ban from community, and appoint as mods to community */}
{(this.canMod || this.canAdmin) && (
<li className="list-inline-item"> <li className="list-inline-item">
{!post.banned_from_community ? ( {!post.removed ? (
<span <span
class="pointer" class="pointer"
onClick={linkEvent( onClick={linkEvent(
this, this,
this.handleModBanFromCommunityShow this.handleModRemoveShow
)} )}
> >
{i18n.t('ban')} {i18n.t('remove')}
</span> </span>
) : ( ) : (
<span <span
class="pointer" class="pointer"
onClick={linkEvent( onClick={linkEvent(
this, this,
this.handleModBanFromCommunitySubmit this.handleModRemoveSubmit
)} )}
> >
{i18n.t('unban')} {i18n.t('restore')}
</span> </span>
)} )}
</li> </li>
)} )}
{!post.banned_from_community && ( {this.canMod && (
<li className="list-inline-item">
<span
class="pointer"
onClick={linkEvent(
this,
this.handleAddModToCommunity
)}
>
{this.isMod
? i18n.t('remove_as_mod')
: i18n.t('appoint_as_mod')}
</span>
</li>
)}
</>
)}
{/* Community creators and admins can transfer community to another mod */}
{(this.amCommunityCreator || this.canAdmin) && this.isMod && (
<li className="list-inline-item">
{!this.state.showConfirmTransferCommunity ? (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleShowConfirmTransferCommunity
)}
>
{i18n.t('transfer_community')}
</span>
) : (
<> <>
<span class="d-inline-block mr-1"> {!this.isMod && (
{i18n.t('are_you_sure')} <li className="list-inline-item">
</span> {!post.banned_from_community ? (
<span <span
class="pointer d-inline-block mr-1" class="pointer"
onClick={linkEvent( onClick={linkEvent(
this, this,
this.handleTransferCommunity this.handleModBanFromCommunityShow
)} )}
> >
{i18n.t('yes')} {i18n.t('ban')}
</span> </span>
<span ) : (
class="pointer d-inline-block" <span
onClick={linkEvent( class="pointer"
this, onClick={linkEvent(
this.handleCancelShowConfirmTransferCommunity this,
)} this.handleModBanFromCommunitySubmit
> )}
{i18n.t('no')} >
</span> {i18n.t('unban')}
</span>
)}
</li>
)}
{!post.banned_from_community && (
<li className="list-inline-item">
<span
class="pointer"
onClick={linkEvent(
this,
this.handleAddModToCommunity
)}
>
{this.isMod
? i18n.t('remove_as_mod')
: i18n.t('appoint_as_mod')}
</span>
</li>
)}
</> </>
)} )}
</li> {/* Community creators and admins can transfer community to another mod */}
)} {(this.amCommunityCreator || this.canAdmin) &&
{/* Admins can ban from all, and appoint other admins */} this.isMod && (
{this.canAdmin && ( <li className="list-inline-item">
<> {!this.state.showConfirmTransferCommunity ? (
{!this.isAdmin && ( <span
class="pointer"
onClick={linkEvent(
this,
this.handleShowConfirmTransferCommunity
)}
>
{i18n.t('transfer_community')}
</span>
) : (
<>
<span class="d-inline-block mr-1">
{i18n.t('are_you_sure')}
</span>
<span
class="pointer d-inline-block mr-1"
onClick={linkEvent(
this,
this.handleTransferCommunity
)}
>
{i18n.t('yes')}
</span>
<span
class="pointer d-inline-block"
onClick={linkEvent(
this,
this
.handleCancelShowConfirmTransferCommunity
)}
>
{i18n.t('no')}
</span>
</>
)}
</li>
)}
{/* Admins can ban from all, and appoint other admins */}
{this.canAdmin && (
<>
{!this.isAdmin && (
<li className="list-inline-item">
{!post.banned ? (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleModBanShow
)}
>
{i18n.t('ban_from_site')}
</span>
) : (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleModBanSubmit
)}
>
{i18n.t('unban_from_site')}
</span>
)}
</li>
)}
{!post.banned && (
<li className="list-inline-item">
<span
class="pointer"
onClick={linkEvent(this, this.handleAddAdmin)}
>
{this.isAdmin
? i18n.t('remove_as_admin')
: i18n.t('appoint_as_admin')}
</span>
</li>
)}
</>
)}
{/* Site Creator can transfer to another admin */}
{this.amSiteCreator && this.isAdmin && (
<li className="list-inline-item"> <li className="list-inline-item">
{!post.banned ? ( {!this.state.showConfirmTransferSite ? (
<span
class="pointer"
onClick={linkEvent(this, this.handleModBanShow)}
>
{i18n.t('ban_from_site')}
</span>
) : (
<span <span
class="pointer" class="pointer"
onClick={linkEvent( onClick={linkEvent(
this, this,
this.handleModBanSubmit this.handleShowConfirmTransferSite
)} )}
> >
{i18n.t('unban_from_site')} {i18n.t('transfer_site')}
</span> </span>
) : (
<>
<span class="d-inline-block mr-1">
{i18n.t('are_you_sure')}
</span>
<span
class="pointer d-inline-block mr-1"
onClick={linkEvent(
this,
this.handleTransferSite
)}
>
{i18n.t('yes')}
</span>
<span
class="pointer d-inline-block"
onClick={linkEvent(
this,
this.handleCancelShowConfirmTransferSite
)}
>
{i18n.t('no')}
</span>
</>
)} )}
</li> </li>
)} )}
{!post.banned && (
<li className="list-inline-item">
<span
class="pointer"
onClick={linkEvent(this, this.handleAddAdmin)}
>
{this.isAdmin
? i18n.t('remove_as_admin')
: i18n.t('appoint_as_admin')}
</span>
</li>
)}
</> </>
)} )}
{/* Site Creator can transfer to another admin */}
{this.amSiteCreator && this.isAdmin && (
<li className="list-inline-item">
{!this.state.showConfirmTransferSite ? (
<span
class="pointer"
onClick={linkEvent(
this,
this.handleShowConfirmTransferSite
)}
>
{i18n.t('transfer_site')}
</span>
) : (
<>
<span class="d-inline-block mr-1">
{i18n.t('are_you_sure')}
</span>
<span
class="pointer d-inline-block mr-1"
onClick={linkEvent(this, this.handleTransferSite)}
>
{i18n.t('yes')}
</span>
<span
class="pointer d-inline-block"
onClick={linkEvent(
this,
this.handleCancelShowConfirmTransferSite
)}
>
{i18n.t('no')}
</span>
</>
)}
</li>
)}
</> </>
)} )}
{this.props.showBody && post.body && ( {this.props.showBody && post.body && (
@ -1201,4 +1230,9 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
i.state.viewSource = !i.state.viewSource; i.state.viewSource = !i.state.viewSource;
i.setState(i.state); i.setState(i.state);
} }
handleShowAdvanced(i: PostListing) {
i.state.showAdvanced = !i.state.showAdvanced;
i.setState(i.state);
}
} }

View file

@ -29,6 +29,7 @@
"message": "Message", "message": "Message",
"edit": "edit", "edit": "edit",
"reply": "reply", "reply": "reply",
"more": "more",
"cancel": "Cancel", "cancel": "Cancel",
"preview": "Preview", "preview": "Preview",
"upload_image": "upload image", "upload_image": "upload image",