Conversation
linytas
left a comment
linytas
left a comment
There was a problem hiding this comment.
The way you handled the rating component was very intelligent, and I learned a lot from it. So if my comments confuse you, please let me know and I hope you do well.
| const [disableCss, setDisableCss] = useState<string>(""); | ||
| const [ratingLabel, setRatingLabel] = useState<string>(""); | ||
|
|
||
| const starLabel: any = { |
There was a problem hiding this comment.
I really like what you did with labels here, but it would be better if you could allow users to customize labels. Maybe we could use prop, maybe something else. Also, I would like to see these labels applied to fraction of stars.
There was a problem hiding this comment.
ok! i am still having some trouble with the half-star logic so I will continue my research until I can find a solution.
There was a problem hiding this comment.
I added the custom hover label feature without the half star logic for now otherwise it works for the whole stars.
There was a problem hiding this comment.
Great, your custom label work perfectly! look forward to merge the half star feature into your component!
| // return starArray | ||
| // } | ||
|
|
||
| return ( |
There was a problem hiding this comment.
Wonderful, so far everything is perfect and full of logic. Only thing we may need is a function to handle precision of the rating (or simply, half star). I believe the use of the <style> element is a good way to implement this requirement. Also, you can use MouseEvent.clientX and Element.getBoundingClientRect() to get the current hovering index of star, which help me a lot and I believe it will help you too.
There was a problem hiding this comment.
thank you I will try that out too.
2 participants
No description provided.