Adds basic like state tracking using Atom Util #1

merged
opened by minito.dev targeting main

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.

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