diff options
| -rw-r--r-- | src/components/comments/CommentTile.tsx | 7 | ||||
| -rw-r--r-- | src/components/common/LikeButton.tsx | 12 | ||||
| -rw-r--r-- | src/constants/api.ts | 1 | ||||
| -rw-r--r-- | src/screens/profile/CommentReactionScreen.tsx | 2 | ||||
| -rw-r--r-- | src/services/CommentService.ts | 24 |
5 files changed, 31 insertions, 15 deletions
diff --git a/src/components/comments/CommentTile.tsx b/src/components/comments/CommentTile.tsx index e38946af..1f1fafda 100644 --- a/src/components/comments/CommentTile.tsx +++ b/src/components/comments/CommentTile.tsx @@ -150,10 +150,11 @@ const CommentTile: React.FC<CommentTileProps> = ({ screenType={screenType} /> <LikeButton - filled={commentObject.user_reaction !== null} + initialLikeState={commentObject.user_reaction !== null} onPress={() => { - handleLikeUnlikeComment(commentObject); - setShouldUpdateParent(true); + handleLikeUnlikeComment(commentObject).then(() => { + setShouldUpdateParent(true); + }); }} style={styles.likeButton} /> diff --git a/src/components/common/LikeButton.tsx b/src/components/common/LikeButton.tsx index f817bd98..43b3ac37 100644 --- a/src/components/common/LikeButton.tsx +++ b/src/components/common/LikeButton.tsx @@ -4,23 +4,25 @@ import {normalize} from '../../utils'; interface LikeButtonProps { onPress: () => void; - filled: boolean; style: ImageStyle; + initialLikeState: boolean; } const LikeButton: React.FC<LikeButtonProps> = ({ onPress, - filled: initialFillState, style, + initialLikeState, }) => { - const [filled, setFilled] = useState(initialFillState); + const [filled, setFilled] = useState(initialLikeState); const uri = filled ? require('../../assets/images/heart-filled.png') : require('../../assets/images/heart-outlined.png'); return ( <TouchableOpacity onPress={() => { - setFilled(!filled); - onPress(); + if (filled === initialLikeState) { + setFilled(!filled); + onPress(); + } }}> <Image style={[styles.image, style]} source={uri} /> </TouchableOpacity> diff --git a/src/constants/api.ts b/src/constants/api.ts index 2d9a60db..6a924f1d 100644 --- a/src/constants/api.ts +++ b/src/constants/api.ts @@ -33,6 +33,7 @@ export const MOMENT_THUMBNAIL_ENDPOINT: string = API_URL + 'moment-thumbnail/'; export const VERIFY_INVITATION_CODE_ENDPOUNT: string = API_URL + 'verify-code/'; export const COMMENTS_ENDPOINT: string = API_URL + 'comments/'; export const COMMENT_REACTIONS_ENDPOINT: string = API_URL + 'reaction-comment/'; +export const COMMENT_REACTIONS_REPLY_ENDPOINT: string = API_URL + 'reaction-reply/'; export const FRIENDS_ENDPOINT: string = API_URL + 'friends/'; export const ALL_USERS_ENDPOINT: string = API_URL + 'users/'; export const REPORT_ISSUE_ENDPOINT: string = API_URL + 'report/'; diff --git a/src/screens/profile/CommentReactionScreen.tsx b/src/screens/profile/CommentReactionScreen.tsx index 488497ee..0596a184 100644 --- a/src/screens/profile/CommentReactionScreen.tsx +++ b/src/screens/profile/CommentReactionScreen.tsx @@ -29,7 +29,7 @@ const CommentReactionScreen: React.FC<CommentReactionScreenProps> = ({ const loadUsers = async () => { const response = await getUsersReactedToAComment(comment); if (response.length !== 0) { - setUsers(users); + setUsers(response); } else { Alert.alert(ERROR_SOMETHING_WENT_WRONG); navigation.goBack(); diff --git a/src/services/CommentService.ts b/src/services/CommentService.ts index e85b1991..b21c6dfd 100644 --- a/src/services/CommentService.ts +++ b/src/services/CommentService.ts @@ -3,11 +3,13 @@ import {Alert} from 'react-native'; import { COMMENTS_ENDPOINT, COMMENT_REACTIONS_ENDPOINT, + COMMENT_REACTIONS_REPLY_ENDPOINT, COMMENT_THREAD_ENDPOINT, } from '../constants'; import {ERROR_FAILED_TO_COMMENT} from '../constants/strings'; import { CommentBaseType, + CommentThreadType, CommentType, ProfilePreviewType, ReactionOptionsType, @@ -133,12 +135,18 @@ export const deleteComment = async (id: string, isThread: boolean) => { * @param comment the comment object that contains `user_reaction` (or not) * @returns */ -export const handleLikeUnlikeComment = async (comment: CommentBaseType) => { +export const handleLikeUnlikeComment = async ( + comment: CommentType | CommentThreadType, +) => { try { + const isReply = 'parent_comment' in comment; const token = await AsyncStorage.getItem('token'); + let url = isReply + ? COMMENT_REACTIONS_REPLY_ENDPOINT + : COMMENT_REACTIONS_ENDPOINT; if (comment.user_reaction !== null) { // unlike a comment - const url = COMMENT_REACTIONS_ENDPOINT + `${comment.user_reaction.id}/`; + url += `${comment.user_reaction.id}/`; const response = await fetch(url, { method: 'DELETE', headers: { @@ -148,7 +156,6 @@ export const handleLikeUnlikeComment = async (comment: CommentBaseType) => { return response.status === 200; } else { // like a comment - const url = COMMENT_REACTIONS_ENDPOINT; const form = new FormData(); form.append('comment_id', comment.comment_id); form.append('reaction_type', ReactionOptionsType.Like); @@ -168,11 +175,16 @@ export const handleLikeUnlikeComment = async (comment: CommentBaseType) => { } }; -export const getUsersReactedToAComment = async (comment: CommentBaseType) => { +export const getUsersReactedToAComment = async ( + comment: CommentType | CommentThreadType, +) => { try { + const isReply = 'parent_comment' in comment; const token = await AsyncStorage.getItem('token'); - const url = - COMMENT_REACTIONS_ENDPOINT + `?comment_id=${comment.comment_id}`; + let url = isReply + ? COMMENT_REACTIONS_REPLY_ENDPOINT + : COMMENT_REACTIONS_ENDPOINT; + url += `?comment_id=${comment.comment_id}`; const response = await fetch(url, { method: 'GET', headers: { |