TryGhost/Ghost
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-12-28 13:22:39 +03:00
Code Issues Projects Releases Wiki Activity

Added basic toggle state to like component

Browse Source
This commit is contained in:
James Morris 2022-07-06 17:02:18 +02:00
parent ddd72eba98
commit c394037cab
1 changed files with 26 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
apps/comments-ui/src/components/Like.js
View File

@ -1,9 +1,30 @@
import React from 'react';
import AppContext from '../AppContext';
import {ReactComponent as LikeIcon} from '../images/icons/like.svg';
function Like() {
return (
<button className="flex font-sans text-[14px] items-center"><LikeIcon className='gh-comments-icon gh-comments-icon-like mr-1' />3</button>
);
class Like extends React.Component {
static contextType = AppContext;
constructor(props) {
super(props);
this.state = {
liked: false
};
this.toggleLike = this.toggleLike.bind(this);
}
toggleLike() {
this.setState(state => ({
liked: !state.liked
}));
}
render() {
return (
<button className="flex font-sans text-[14px] items-center" onClick={this.toggleLike}><LikeIcon className={`gh-comments-icon gh-comments-icon-like mr-1 ${this.state.liked ? 'fill-black' : ''}`} />3</button>
);
}
}
export default Like;