Implemented Comments part 1 #34
Conversation
src/components/icon/index.tsx
Outdated
| }>; | ||
| size: typeof ICON_SIZE[keyof typeof ICON_SIZE]; | ||
| title?: string; | ||
| titleId?: string; | ||
| className?: string; | ||
| SvgClassName?: string; |
There was a problem hiding this comment.
SvgClassName isn't needed. We can use className instead to change the styling of the SVG icon. By using text- classes rather than fill-. Like we're doing in PostVotes.
There was a problem hiding this comment.
Did you notice that it doesnt work? Those are svg icons not font icons!
text- is good for font icons in our case its svg.
And i would keep it as so, when we want to change the div in the background.
There was a problem hiding this comment.
This works just fine for me.
<Icon IconType={ArrowUpIcon} size={ICON_SIZE.SMALL} className={`hover:text-blue-400 ${myVote === 1 && 'text-blue-600'}`} />
And i would keep it as so, when we want to change the div in the background.
If we want to change the background color we'll just use a bg- class. It won't interfere with the SVG.
There was a problem hiding this comment.
hmm then on firefox this doesnt work. ( or just on my side )
There was a problem hiding this comment.
Yep it does NOT work on firefox and its probably just a sideeffect of chromes svg implementation.
Because of this i would propose to stay what i done for firefox compatibility
| @@ -1,3 +1,5 @@ | |||
| 'use client'; | |||
There was a problem hiding this comment.
Rather than making the parent components of VoteButtons client-side, could we move the like/dislike logic into it? I don't think we would expect to do anything other than calling the likeComment API function when an arrow is clicked. All it would need to know is the entity ID and whether it's a post or a comment that's being voted on.
There was a problem hiding this comment.
And likePost + in the future invalidate cache and refetch that post
Implemented Comments ( Upvotes, Downvotes )
Not implemented:
Replies
More options button