patch of Adds basic like state tracking using Atom Util · round #0 · pull #1 · whey.party/red-dwarf

Stores liked post URIs in the atom store, modifying the Atom store in the util to store both the Post Uri and the LikeUri, to allow for storing what posts were liked and allowing for deleting the like record.

Also modified the hasLiked boolean to be true if the post has a like string, or if the post exists in the Liked Posts Cache.

+12 -1

src/components/UniversalPostRenderer.tsx

··· 3 import { useNavigate } from "@tanstack/react-router"; 4 import { type SVGProps } from "react"; 5 import { useHydratedEmbed } from "~/utils/useHydrated"; 6 import { 7 useQueryPost, 8 useQueryIdentity, ··· 1097 repostedby?: string; 1098 }) { 1099 const navigate = useNavigate(); 1100 const [hasRetweeted, setHasRetweeted] = useState<Boolean>( 1101 post.viewer?.repost ? true : false 1102 ); 1103 const [hasLiked, setHasLiked] = useState<Boolean>( 1104 - post.viewer?.like ? true : false 1105 ); 1106 const { agent } = useAuth(); 1107 const [likeUri, setLikeUri] = useState<string | undefined>(post.viewer?.like); ··· 1110 ); 1111 1112 const likeOrUnlikePost = async () => { 1113 if (!agent) { 1114 console.error("Agent is null or undefined"); 1115 return; 1116 } 1117 if (hasLiked) { 1118 if (likeUri) { 1119 await agent.deleteLike(likeUri); 1120 setHasLiked(false); 1121 } 1122 } else { 1123 const { uri } = await agent.like(post.uri, post.cid); 1124 setLikeUri(uri); 1125 setHasLiked(true); 1126 } 1127 }; 1128 1129 const repostOrUnrepostPost = async () => {

··· 3 import { useNavigate } from "@tanstack/react-router"; 4 import { type SVGProps } from "react"; 5 import { useHydratedEmbed } from "~/utils/useHydrated"; 6 + import { useAtom } from 'jotai'; 7 + import { likedPostsAtom } from "~/utils/atoms"; 8 import { 9 useQueryPost, 10 useQueryIdentity, ··· 1099 repostedby?: string; 1100 }) { 1101 const navigate = useNavigate(); 1102 + const [likedPosts, setLikedPosts] = useAtom(likedPostsAtom); 1103 const [hasRetweeted, setHasRetweeted] = useState<Boolean>( 1104 post.viewer?.repost ? true : false 1105 ); 1106 const [hasLiked, setHasLiked] = useState<Boolean>( 1107 + (post.uri in likedPosts) || post.viewer?.like ? true : false 1108 ); 1109 const { agent } = useAuth(); 1110 const [likeUri, setLikeUri] = useState<string | undefined>(post.viewer?.like); ··· 1113 ); 1114 1115 const likeOrUnlikePost = async () => { 1116 + const newLikedPosts = { ...likedPosts }; 1117 if (!agent) { 1118 console.error("Agent is null or undefined"); 1119 return; 1120 } 1121 if (hasLiked) { 1122 + if (post.uri in likedPosts) { 1123 + const likeUri = likedPosts[post.uri]; 1124 + setLikeUri(likeUri); 1125 + } 1126 if (likeUri) { 1127 await agent.deleteLike(likeUri); 1128 setHasLiked(false); 1129 + delete newLikedPosts[post.uri]; 1130 } 1131 } else { 1132 const { uri } = await agent.like(post.uri, post.cid); 1133 setLikeUri(uri); 1134 setHasLiked(true); 1135 + newLikedPosts[post.uri] = uri; 1136 } 1137 + setLikedPosts(newLikedPosts) 1138 }; 1139 1140 const repostOrUnrepostPost = async () => {