discours.io/webapp
5
0
Fork 0
Code Issues Pull Requests Actions Projects Wiki Activity

rating-reactivity-fixing

Browse Source
This commit is contained in:
Untone 2024-02-16 11:01:40 +03:00
parent 54ef10307e
commit dab1eff314
1 changed files with 25 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
src/components/Article/RatingControl.tsx
View File

@ -32,9 +32,19 @@ export const RatingControl = (props: RatingControlProps) => {
createEffect(
on(
[() => props.comment, () => props.shout],
([comment, shout]) => {
setTotal(comment?.stat?.rating || shout?.stat?.rating || 0)
() => props.comment,
(comment) => {
setTotal(comment?.stat?.rating || 0)
},
{ defer: true },
),
)
createEffect(
on(
() => props.shout,
(shout) => {
setTotal(shout?.stat?.rating || 0)
},
{ defer: true },
),
@ -97,10 +107,11 @@ export const RatingControl = (props: RatingControlProps) => {
setIsLoading(false)
}, 'vote')
}
const isNotDisliked = createMemo(() => !myRate() || myRate()?.kind === ReactionKind.Dislike)
const isNotLiked = createMemo(() => !myRate() || myRate()?.kind === ReactionKind.Like)
const getTrigger = () => {
const getTrigger = createMemo(() => {
return props.comment ? (
<div
class={clsx(stylesComment.commentRatingValue, {
@ -113,18 +124,18 @@ export const RatingControl = (props: RatingControlProps) => {
) : (
<span class={stylesShout.ratingValue}>{total()}</span>
)
}
})
return (
<div class={clsx(props.comment ? stylesComment.commentRating : stylesShout.rating, props.class)}>
<button
onClick={() => handleRatingChange(ReactionKind.Dislike)}
disabled={isLoading()}
class={
props.comment
? clsx(stylesComment.commentRatingControl, stylesComment.commentRatingControlUp, {
[stylesComment.voted]: myRate()?.kind === 'LIKE',
})
: ''
props.comment ? clsx(stylesComment.commentRatingControl,
stylesComment.commentRatingControlUp,
{ [stylesComment.voted]: myRate()?.kind === 'LIKE'}
) : ''
}
>
<Show when={!props.comment}>
@ -146,11 +157,10 @@ export const RatingControl = (props: RatingControlProps) => {
onClick={() => handleRatingChange(ReactionKind.Like)}
disabled={isLoading()}
class={
props.comment
? clsx(stylesComment.commentRatingControl, stylesComment.commentRatingControlDown, {
[stylesComment.voted]: myRate()?.kind === 'DISLIKE',
})
: ''
props.comment ? clsx(stylesComment.commentRatingControl,
stylesComment.commentRatingControlDown,
{ [stylesComment.voted]: myRate()?.kind === 'DISLIKE'}
) : ''
}
>
<Show when={!props.comment}>