diff --git a/src/components/Article/FullArticle.tsx b/src/components/Article/FullArticle.tsx
index d87723a2..7d25a6bf 100644
--- a/src/components/Article/FullArticle.tsx
+++ b/src/components/Article/FullArticle.tsx
@@ -3,7 +3,7 @@ import './Full.scss'
import { Icon } from '../_shared/Icon'
import { AuthorCard } from '../Author/Card'
import { createEffect, createMemo, createSignal, For, Match, onMount, Show, Switch } from 'solid-js'
-import type { Author, Reaction, Shout } from '../../graphql/types.gen'
+import type { Author, Shout } from '../../graphql/types.gen'
import { ReactionKind } from '../../graphql/types.gen'
import MD from './MD'
@@ -124,24 +124,40 @@ export const FullArticle = (props: ArticleProps) => {
checkReaction(Object.values(reactionEntities), ReactionKind.Dislike, userSlug(), props.article.id)
)
- const handleRatingChange = async (isUpvote: boolean) => {
- const reactionKind = isUpvote ? ReactionKind.Like : ReactionKind.Dislike
- const isReacted = (isUpvote && isUpvoted()) || (!isUpvote && isDownvoted())
+ const deleteShoutReaction = async (reactionKind: ReactionKind) => {
+ const reactionToDelete = Object.values(reactionEntities).find(
+ (r) =>
+ r.kind === reactionKind &&
+ r.createdBy.slug === userSlug() &&
+ r.shout.id === props.article.id &&
+ !r.replyTo
+ )
+ return deleteReaction(reactionToDelete.id)
+ }
- if (isReacted) {
- const reactionToDelete = Object.values(reactionEntities).find(
- (r) =>
- r.kind === reactionKind &&
- r.createdBy.slug === userSlug() &&
- r.shout.id === props.article.id &&
- !r.replyTo
- )
- await deleteReaction(reactionToDelete.id)
+ const handleRatingChange = async (isUpvote: boolean) => {
+ if (isUpvote) {
+ if (isUpvoted()) {
+ await deleteShoutReaction(ReactionKind.Like)
+ } else if (isDownvoted()) {
+ await deleteShoutReaction(ReactionKind.Dislike)
+ } else {
+ await createReaction({
+ kind: ReactionKind.Like,
+ shout: props.article.id
+ })
+ }
} else {
- await createReaction({
- kind: reactionKind,
- shout: props.article.id
- })
+ if (isDownvoted()) {
+ await deleteShoutReaction(ReactionKind.Dislike)
+ } else if (isUpvoted()) {
+ await deleteShoutReaction(ReactionKind.Like)
+ } else {
+ await createReaction({
+ kind: ReactionKind.Dislike,
+ shout: props.article.id
+ })
+ }
}
loadShout(props.article.slug)
diff --git a/src/components/Feed/Card.tsx b/src/components/Feed/Card.tsx
index c2cc1b7b..d6522466 100644
--- a/src/components/Feed/Card.tsx
+++ b/src/components/Feed/Card.tsx
@@ -101,20 +101,36 @@ export const ArticleCard = (props: ArticleCardProps) => {
checkReaction(Object.values(reactionEntities), ReactionKind.Dislike, userSlug(), id)
)
- const handleRatingChange = async (isUpvote: boolean) => {
- const reactionKind = isUpvote ? ReactionKind.Like : ReactionKind.Dislike
- const isReacted = (isUpvote && isUpvoted()) || (!isUpvote && isDownvoted())
+ const deleteShoutReaction = async (reactionKind: ReactionKind) => {
+ const reactionToDelete = Object.values(reactionEntities).find(
+ (r) => r.kind === reactionKind && r.createdBy.slug === userSlug() && r.shout.id === id && !r.replyTo
+ )
+ return deleteReaction(reactionToDelete.id)
+ }
- if (isReacted) {
- const reactionToDelete = Object.values(reactionEntities).find(
- (r) => r.kind === reactionKind && r.createdBy.slug === userSlug() && r.shout.id === id && !r.replyTo
- )
- await deleteReaction(reactionToDelete.id)
+ const handleRatingChange = async (isUpvote: boolean) => {
+ if (isUpvote) {
+ if (isUpvoted()) {
+ await deleteShoutReaction(ReactionKind.Like)
+ } else if (isDownvoted()) {
+ await deleteShoutReaction(ReactionKind.Dislike)
+ } else {
+ await createReaction({
+ kind: ReactionKind.Like,
+ shout: id
+ })
+ }
} else {
- await createReaction({
- kind: reactionKind,
- shout: id
- })
+ if (isDownvoted()) {
+ await deleteShoutReaction(ReactionKind.Dislike)
+ } else if (isUpvoted()) {
+ await deleteShoutReaction(ReactionKind.Like)
+ } else {
+ await createReaction({
+ kind: ReactionKind.Dislike,
+ shout: id
+ })
+ }
}
loadShout(slug)
diff --git a/src/components/_shared/PageLayout.tsx b/src/components/_shared/PageLayout.tsx
index 10e7d688..30a7e84c 100644
--- a/src/components/_shared/PageLayout.tsx
+++ b/src/components/_shared/PageLayout.tsx
@@ -6,6 +6,7 @@ import { Show } from 'solid-js'
import { clsx } from 'clsx'
import '../../styles/app.scss'
import styles from './PageLayout.module.scss'
+import { Meta } from '@solidjs/meta'
type PageLayoutProps = {
headerTitle?: string
@@ -23,6 +24,7 @@ export const PageLayout = (props: PageLayoutProps) => {
return (
<>
+
@@ -80,7 +80,7 @@ export const ReactionsProvider = (props: { children: JSX.Element }) => {
setReactionEntities(reaction.id, reaction)
}
- onCleanup(() => setReactionEntities({}))
+ onCleanup(() => setReactionEntities(reconcile({})))
const actions = {
loadReactionsBy,