0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-01-06 22:40:14 -05:00

Added close method to context menus

This commit is contained in:
Simon Backx 2022-07-06 11:31:01 +02:00
parent 03ab129380
commit 1be6d305a0
3 changed files with 13 additions and 2 deletions

View file

@ -49,7 +49,7 @@ class Comment extends React.Component {
<button className="flex font-sans mr-5"><LikeIcon className='gh-comments-icon gh-comments-icon-like mr-1' />3</button> <button className="flex font-sans mr-5"><LikeIcon className='gh-comments-icon gh-comments-icon-like mr-1' />3</button>
<div className="relative"> <div className="relative">
<button onClick={this.toggleContextMenu}><MoreIcon className='gh-comments-icon gh-comments-icon-more -m-[3px]' /></button> <button onClick={this.toggleContextMenu}><MoreIcon className='gh-comments-icon gh-comments-icon-more -m-[3px]' /></button>
{this.state.isContextMenuOpen ? <CommentContextMenu comment={comment} /> : null} {this.state.isContextMenuOpen ? <CommentContextMenu comment={comment} close={this.toggleContextMenu} /> : null}
</div> </div>
</div> </div>
</div> </div>

View file

@ -13,6 +13,11 @@ class AuthorContextMenu extends React.Component {
deleteComment(event) { deleteComment(event) {
this.context.onAction('deleteComment', this.props.comment); this.context.onAction('deleteComment', this.props.comment);
this.close();
}
close() {
this.props.close();
} }
render() { render() {

View file

@ -10,6 +10,8 @@ class CommentContextMenu extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = {}; this.state = {};
this.close = this.close.bind(this);
} }
get isAuthor() { get isAuthor() {
@ -20,12 +22,16 @@ class CommentContextMenu extends React.Component {
return !!this.context.admin; return !!this.context.admin;
} }
close() {
this.props.close();
}
render() { render() {
const comment = this.props.comment; const comment = this.props.comment;
return ( return (
<div className="bg-white absolute font-sans rounded py-3 px-4 drop-shadow-xl text-sm whitespace-nowrap"> <div className="bg-white absolute font-sans rounded py-3 px-4 drop-shadow-xl text-sm whitespace-nowrap">
{this.isAuthor ? <AuthorContextMenu comment={comment}/> : (this.isAdmin ? <AdminContextMenu comment={comment}/> : <NotAuthorContextMenu comment={comment}/>)} {this.isAuthor ? <AuthorContextMenu comment={comment} close={this.close}/> : (this.isAdmin ? <AdminContextMenu comment={comment} close={this.close}/> : <NotAuthorContextMenu comment={comment} close={this.close}/>)}
</div> </div>
); );
} }