Skip to content

Commit

Permalink
Dark mode persist
Browse files Browse the repository at this point in the history
  • Loading branch information
asa-siphuma committed Sep 27, 2024
1 parent 3c5d339 commit 52a924a
Show file tree
Hide file tree
Showing 13 changed files with 383 additions and 369 deletions.
2 changes: 1 addition & 1 deletion frontend/src/Components/FollowerPost.js
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,7 @@ export default function FollowerPost({ postId, uid, username, userHandle, userAv
</TouchableOpacity>
<View style={styles.stats}>
<Pressable onPress={() => {handleCommentPress(postId, false)}}>
<CommIcon name="comment-outline" size={20} style={styles.icon} />
<CommIcon name="comment-outline" size={20} style={styles.icon} color={theme.iconColor} />
</Pressable>
<Text style={styles.statsNumber}>{comments > 0 ? comments : 0}</Text>
</View>
Expand Down
8 changes: 4 additions & 4 deletions frontend/src/Components/FollowerPostTab.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@ import { useTheme } from "../styles/ThemeContext";
import { getPostsOfUser, getReviewsOfUser, getCountCommentsOfPost, getCountCommentsOfReview, removePost, removeReview } from "../Services/PostsApiServices";
import { getLikesOfPost, getLikesOfReview } from "../Services/LikesApiService";
import { FacebookLoader, InstagramLoader } from "react-native-easy-content-loader";
import Post from "./FollowerPost";
import Review from "./FollowerReview";
import FollowerPost from "./FollowerPost";
import FollowerReview from "./FollowerReview";

export default function FollowerPostsTab({ userInfo, userProfile, otherinfo, handleCommentPress }) {
const { theme } = useTheme();
Expand Down Expand Up @@ -155,7 +155,7 @@ export default function FollowerPostsTab({ userInfo, userProfile, otherinfo, han
) : (
posts.map((item, index) =>
item.type === "post" ? (
<Post
<FollowerPost
key={index} // for uniqueness
postId={item.postId}
uid={item.uid}
Expand All @@ -175,7 +175,7 @@ export default function FollowerPostsTab({ userInfo, userProfile, otherinfo, han
ogUserinfo={otherinfo}
/>
) : (
<Review
<FollowerReview
key={index} // for uniqueness
reviewId={item.reviewId}
uid={item.uid}
Expand Down
37 changes: 19 additions & 18 deletions frontend/src/Components/FollowerReview.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import { useNavigation } from "@react-navigation/native";
import { toggleLikeReview } from "../Services/LikesApiService";
import { colors } from "../styles/theme";

export default function FollowerReview({ reviewId, uid, username, userHandle, userAvatar, likes, comments, image, saves, reviewTitle, preview, dateReviewed, isUserReview, handleCommentPress, movieName, rating, onDelete,ogUserinfo }) {
export default function FollowerReview({ reviewId, uid, username, userHandle, userAvatar, likes, comments, image, saves, reviewTitle, preview, dateReviewed, isUserReview, handleCommentPress, movieName, rating, onDelete, ogUserinfo }) {
const { theme } = useTheme();
const [liked, setLiked] = useState(false);
const [likedCount, setLikedCount] = useState(likes);
Expand All @@ -27,11 +27,11 @@ export default function FollowerReview({ reviewId, uid, username, userHandle, us
reviewId: reviewId,
userId: ogUserinfo.userId,
};

try {
await toggleLikeReview(body);
setLiked((prevLiked) => {
setLikedCount((prevCount) => prevLiked ? prevCount - 1 : prevCount + 1);
setLikedCount((prevCount) => (prevLiked ? prevCount - 1 : prevCount + 1));
return !prevLiked; // Toggle liked state
});
console.log("Toggle like successful");
Expand Down Expand Up @@ -109,6 +109,7 @@ export default function FollowerReview({ reviewId, uid, username, userHandle, us
display: "flex",
justifyContent: "center",
alignItems: "center",
marginBottom: 8
},
reviewButtonText: {
color: "white",
Expand Down Expand Up @@ -164,7 +165,7 @@ export default function FollowerReview({ reviewId, uid, username, userHandle, us
position: "absolute",
top: 50,
right: 30,
backgroundColor: "white",
backgroundColor: theme.backgroundColor,
borderRadius: 5,
shadowColor: "#000",
shadowOffset: {
Expand All @@ -182,7 +183,7 @@ export default function FollowerReview({ reviewId, uid, username, userHandle, us
paddingHorizontal: 20,
},
modalText: {
color: "black",
color: theme.textColor,
fontSize: 16,
},
star: {
Expand All @@ -197,19 +198,19 @@ export default function FollowerReview({ reviewId, uid, username, userHandle, us
<View style={styles.container}>
<View style={styles.profileInfo}>
<Image source={{ uri: userAvatar }} style={styles.avatar} />
<View style={{ alignItems: "left" }}>
<View style={{ flex: 1 }}>
<Text style={styles.username}>{username}</Text>
<Text style={styles.userHandle}>
{userHandle} &bull; {dateReviewed}
</Text>
</View>
<View style={styles.reviewButton}>
<Text style={styles.reviewButtonText}>Review</Text>
</View>
<Pressable onPress={toggleModal} style={{ marginLeft: "auto" }}>
<Icon name="more-vert" size={20} />
<Icon name="more-vert" size={20} color={theme.iconColor} />
</Pressable>
</View>
<View style={styles.reviewButton}>
<Text style={styles.reviewButtonText}>Review</Text>
</View>

{image ? <Image source={{ uri: image }} style={styles.reviewImage} /> : null}

Expand All @@ -219,33 +220,33 @@ export default function FollowerReview({ reviewId, uid, username, userHandle, us
<Text style={styles.star}>
<Icon name="star" size={22} color={"gold"} />
</Text>
<Text>{rating}</Text>
<Text style={{ color: theme.textColor }}>{rating}</Text>
</View>
</View>

<Text style={styles.reviewTitle}>{reviewTitle}</Text>
<Text style={styles.reviewPreview}>{preview}</Text>
<View style={styles.statsContainer}>
<TouchableOpacity style={styles.stats} onPress={toggleLike}>
<Icon name={liked ? "favorite" : "favorite-border"} size={20} color={liked ? "red" : "black"} style={{ marginRight: 5 }} />
<Text style={styles.statsNumber}>{liked ? likes + 1 : likes}</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.stats} onPress={toggleLike}>
<Icon name={liked ? "favorite" : "favorite-border"} size={20} color={liked ? "red" : theme.iconColor} style={{ marginRight: 5 }} />
<Text style={styles.statsNumber}>{liked ? likes + 1 : likes}</Text>
</TouchableOpacity>
<View style={styles.stats}>
<Pressable
onPress={() => {
handleCommentPress(reviewId, true);
}}>
<CommIcon name="comment-outline" size={20} style={styles.icon} />
<CommIcon name="comment-outline" size={20} style={styles.icon} color={theme.iconColor} />
</Pressable>
<Text style={styles.statsNumber}>{comments}</Text>
</View>
<View style={styles.stats}>
<Icon name="bookmark-border" size={20} style={styles.icon} />
<Icon name="bookmark-border" size={20} style={styles.icon} color={theme.iconColor} />
<Text style={styles.statsNumber}>{saves}</Text>
</View>
<View style={{ flex: 1 }}></View>
<Pressable onPress={handleShare}>
<CommIcon name="share-outline" size={20} style={styles.icon} />
<CommIcon name="share-outline" size={20} style={styles.icon} color={theme.iconColor} />
</Pressable>
</View>
{modalVisible && (
Expand Down
Loading

0 comments on commit 52a924a

Please sign in to comment.